/*
Theme Name: fukuoka-renewal-kensetsu.com
Theme URI: https://fukuoka-renewal-kensetsu.com/
Description: pcbrain
Version: 1.0
Author: pcbrain.co.jp
*/

:root {
  --primaryColor: #105fac;
  --blackColor: #231815;
  --primaryValiant: var(--blackColor);
  --secondaryColor: #0f9e3b;
  --attentionColor: #e00000;
  --whiteColor: #fff;
}

/* default style - リセット及びbody基本設定
----------------------------------------------------------- */

/* @import url("css/default.css"); */
/* ===================================================================
CSS information
 file name  :  default.css
 style info :  リセット及びbody初期設定 (このスタイルシートは基本的に変更しない)
=================================================================== */
/*--- reset */
html {
  overflow-y: scroll;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption,
th {
  text-align: left;
}

q:before,
q:after {
  content: "";
}

object,
embed {
  vertical-align: top;
}

hr,
legend {
  display: none;
}

img,
abbr,
acronym,
fieldset {
  border: 0;
}

img {
  vertical-align: bottom;
}

li {
  list-style-type: none;
}

/*--- default */
body {
  color: var(--blackColor);
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", Sans-Serif;
  line-height: 1.8;
}

/* all style
----------------------------------------------------------- */

/* @import url("css/style.css"); */
/* ===================================================================
CSS information

 file name  :style.css
 author     :PCBrain
 style info :コンテンツエリア関係 他

このスタイルシートの構成
 基本設定、レイアウト、横幅設定など
 汎用class
=================================================================== */
/*----------------------------------------------------
    基本設定、リンクカラーなど
----------------------------------------------------*/

a:link,
a:visited {
  color: var(--primaryColor);
  text-decoration: underline;
  transition: 0.7s;
}

a:hover {
  color: #ff9933;
  transition: 0.7s;
}

a img {
  transition: 0.7s;
  backface-visibility: hidden;
}

a:hover img,
a:hover.btn {
  opacity: 0.7;
  transition: 0.7s;
}

/*----------------------------------------------------
    汎用class
----------------------------------------------------*/
.imgR {
  float: right;
  margin: 0 0 10px 10px;
}

.imgR20 {
  float: right;
  margin: 0 0 20px 20px;
}

.imgL {
  float: left;
  margin: 0 10px 10px 0;
}

.imgL20 {
  float: left;
  margin: 0 20px 20px 0;
}

.imgL30 {
  float: left;
  margin: 0 30px 20px 0;
  margin-top: 0 !important;
}

.imgR30 {
  float: right;
  margin: 0 0 20px 30px;
}

.imgL50 {
  float: left;
  margin: 0 50px 30px 0;
  margin-top: 0 !important;
}

.imgR50 {
  float: right;
  margin: 0 0 20px 30px;
}

.imgC {
  margin: 0 auto 10px auto;
  display: block;
}

.imgBox {
  border: #cccccc solid 1px;
  padding: 3px;
}

.imgLayer {
  position: absolute;
}

.mt-20 {
  margin-top: -20px !important;
}

.mt-20 p {
  margin: 0 !important;
}

.mt0 {
  margin-top: 0 !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mr30 {
  margin-right: 30px !important;
}

.ml30 {
  margin-left: 30px;
}

.pt0 {
  padding-top: 0 !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pt30 {
  padding-top: 30px !important;
}

.pb0 {
  padding-bottom: 0 !important;
}

.btn {
  text-align: center;
  margin-bottom: 10px;
}

.overflowH {
  overflow: hidden;
}

.overflowA {
  overflow: auto;
}

.overflowI {
  overflow: initial !important;
}

.clearBoth {
  clear: both;
}

.clearRight {
  clear: right;
}

.clearLeft {
  clear: left;
}

.clearNone {
  clear: none !important;
}

.textRight {
  text-align: right !important;
}

.textCenter {
  text-align: center !important;
  display: block;
}

.remark_red {
  color: #d0004e;
}

.floatR {
  float: right !important;
}

.floatL {
  float: left !important;
}

.imgM {
  margin: 0 auto;
}

strong {
  font-weight: bold;
}

.must {
  font-size: 10px;
  color: #ff0000;
}

.main .comming {
  font-size: 24px;
  font-weight: 700;
  width: 100%;
  padding: 40px 0;
  text-align: center;
}

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

/* 外部リンクは別窓用の指定 */
.externalIcon {
  padding-left: 5px;
  vertical-align: middle;
}

/* clearfix */
.clearfix:after {
  content: ".";
  /* 新しい要素を作る */
  display: block;
  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

.resetAll *+h2,
.resetAll *+h3,
.resetAll *+h4,
.resetAll *+h5,
.resetAll *+h6 {
  margin-top: 0;
}

.resetAll h2,
.resetAll h3,
.resetAll h4,
.resetAll h5,
.resetAll h6 {
  background: none;
  color: initial;
  line-height: 1;
  margin: 0;
  padding: 0;
  position: static;
  border: none;
  display: block;
  border-radius: 0;
}

.resetAll h2 span {
  font-size: initial;
  margin-left: 0;
}

.resetAll h2::before,
.resetAll h2::after,
.resetAll h3::before,
.resetAll h3::after,
.resetAll h4::before,
.resetAll h4::after,
.resetAll h5::before,
.resetAll h5::after,
.resetAll h6::before,
.resetAll h6::after {
  border-radius: 0;
  position: static;
  font-size: initial;
  top: initial;
  left: initial;
  background: none;
  width: auto;
  height: auto;
  opacity: 1;
  margin: 0;
  border: none;
  transform: initial;
}

.resetAll ul,
.resetAll ol {
  margin: 0;
  padding: 0;
  position: static;
}

.resetAll ul li,
.resetAll ol li {
  position: static;
  padding: 0;
  margin: 0;
  line-height: 1;
  list-style-type: initial;
}

.resetAll ul li::before,
.resetAll ul li::after,
.resetAll ol li::before,
.resetAll ol li::after {
  position: static;
  top: initial;
  left: initial;
  right: initial;
  bottom: initial;
  content: "";
  vertical-align: initial;
  padding: 0;
  margin: 0;
  width: auto;
  height: auto;
  background: none;
  border: none;
  color: initial;
  transform: initial;
}

​ .resetAll table {
  margin: 0;
  width: auto;
  border-spacing: none;
}

.resetAll table th,
.resetAll table td {
  padding: 0;
  line-height: 1;
  text-align: initial;
  vertical-align: initial;
  border: none;
  width: auto;
  background: none;
  color: initial;
  font-weight: initial;
  position: static;
  overflow: initial;
}

.resetAll table tr:first-child th,
.resetAll table tr:first-child td {
  border-top: var(--whiteColor) solid 1px;
}

/*----------------------------------------------------
    スマホ用
----------------------------------------------------*/
.spblock,
.spinline,
.sptr {
  display: none;
}

body {
  font-size: 16px;
  box-sizing: border-box;
}

.inner {
  width: 1100px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  padding: 30px 0 30px;
  box-sizing: border-box;
}

.inner+.inner {
  padding-top: 0;
}

.bnrLists {
  text-align: center;
}

article {
  padding: 0 0 20px;
}

@font-face {
  src: url(./font/BAHNSCHRIFT.woff);
  font-family: "Bahnschrift";
  font-style: normal;
}

/*------------- tmp -------------*/

.tmp img {
  display: block;
  margin: 0 auto;
}

.bg01 {
  margin-top: 1px;
  background: url(./img/common/bg01.png) center center;
}

.bg02 {
  background: #f5f5f5;
}

.bg03 {
  background: #f5f5f5 url(./img/common/bg03.png) no-repeat center right;
  background-size: cover;
}

.bg04 {
  background: url(./img/common/bg04.png) repeat center center,
    url(./img/common/bg04.jpg) no-repeat center center;
  background-size: auto, cover;
  margin-top: 1px;
}

.bg05 {
  background: url(./img/common/bg04.png) repeat center center,
    url(./img/common/bg05.jpg) no-repeat center center;
  background-size: auto, cover;
  margin-top: 1px;
}

.bg06 {
  background: #f5f5f5 url(./img/common/bg06.png) no-repeat center left;
  background-size: cover;
}

.bg07 {
  background: url(./img/common/bg04.png) repeat center center,
    url(./img/common/bg07.jpg) no-repeat center center;
  background-size: auto, cover;
  margin-top: 1px;
}

.btn {
  display: inline-block;
  box-sizing: border-box;
  margin-top: 0;
}

.btn a {
  display: block;
  color: var(--whiteColor) !important;
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding: 10px 50px;
  text-decoration: none !important;
  border: var(--secondaryColor) solid 2px;
  background: var(--secondaryColor);
  transition: ease 0.4s;
}

.btn a:hover {
  color: var(--secondaryColor) !important;
  background: var(--whiteColor);
}

.btnDetail {
  position: relative;
  font-weight: bold;
  transition: 0.7s;
  text-align: center;
  color: var(--whiteColor);
  font-size: 12px !important;
  margin: 0 auto 0 !important;
  padding: 5px 6px;
  background: var(--primaryColor);
  text-decoration: none;
  display: block;
}

.btn:hover,
.btnDetail:hover {
  opacity: 0.7;
  transition: 0.7s;
}

.btnDetail a {
  display: block;
  padding: 3px 7px;
  color: var(--whiteColor);
  text-decoration: none;
  text-align: center;
  transition: 0.7s;
}

.notice-r {
  color: var(--attentionColor);
}

.notice-o {
  color: var(--secondaryColor);
}

.notice-b {
  color: var(--primaryColor);
}

.notice-g {
  color: var(--secondaryColor);
}

.tel {
  font-size: 13px;
}

.tel {
  display: inline-block;
  font-size: 11px;
}

.tel .bHours {
  display: none;
}

.tel span {
  background: url(./img/common/ico_fd03.png) no-repeat left 90%;
  color: var(--attentionColor);
  font-size: 40px;
  font-weight: 900;
  line-height: 1;
  padding-left: 60px;
  display: inline-block;
  position: relative;
}

/* .tel .dNum:before,
.tel span:before {
  font-family: "Font Awesome 5 Free";
  content: "\f879";
  font-weight: 900;
  font-size: 0.6em;
  transform: rotate(10deg);
  width: 35px;
  height: 35px;
  position: absolute;
  left: 5px;
  top: 0;
  bottom: -7px;
  margin: auto;
} */

.tel span a {
  color: var(--attentionColor);
  text-decoration: none;
}

.spblock,
.spinline,
.sptr {
  display: none;
}

/*--トップページメインカラム調整--*/

#top .contents {
  margin: 0 auto 0;
  position: relative;
}

/* -----------------------------------------------------------
.header
----------------------------------------------------------- */
.header .htxt {
  padding: 7px 0 10px;
}

.header .htxt h1,
.header .htxt p {
  font-size: 11px;
  font-weight: normal;
  display: block;
  width: 1100px;
  padding: 0;
  margin: 0 auto;
}

.header .htxt p strong {
  font-weight: normal;
}

.header .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  padding: 0;
  overflow: inherit;
  width: 1200px;
}

.header .corpNumber {
  font-size: 12px;
  position: absolute;
  bottom: 0;
  left: 0;
}

.header .logoTxt {
  font-size: 13px;
  font-weight: normal;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.header .floatL {
  display: flex;
  float: left;
}

.header .hdrLogo {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header .hdrLogo a {
  margin: 0 5px 0 0;
  display: block;
  float: left;
  color: var(--blackColor);
  text-decoration: none;
}

.header img.logo01 {
  height: auto;
}

.header img.logo02 {
  width: 58%;
}

.header .floatR {
  display: flex;
  align-items: center;
}

.header .hdrContact {
  float: left;
  position: relative;
  text-align: center;
  margin-left: 5px;
}

.header .hdrContact .contactCatch {
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  background-color: var(--primaryColor);
  color: var(--whiteColor);
  font-size: 13px;
  text-align: center;
  padding: 0 10px;
  margin-bottom: 0;
}

.header .hdrContact .telBox {
  background: var(--whiteColor);
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  margin: 0 12px 0 0;
  float: left;
}

.header .hdrContact .tel {
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
}

.header .hdrContact .tel span {
  font-size: 30px;
  line-height: 1;
  padding-left: 35px;
  display: block;
  background-size: 35px auto !important;
}

.header .hdrContact .tel .note {
  color: var(--blackColor);
  font-size: 12.5px;
  background: none;
  font-weight: normal;
  margin: 2px 0 5px 0;
}

.hdrBnr {
  position: relative;
  overflow: hidden;
  float: right;
}

.hdrBnr li {
  float: left;
  margin-left: 5px;
}

.hdrBnr li:last-child {
  margin-right: 0;
}

.hdrBnr li:hover,
.hdrBnr li a:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.header .telBtn {
  display: none;
}

/* -----------------------------------------------------------
    .footer
----------------------------------------------------------- */

.footer {
  font-size: 13px;
  border-top: var(--primaryColor) solid 5px;
  margin-top: 1px;
}

.footer .inner {
  width: 1100px;
  padding: 30px 0;
}

.footer .ftrConBox {
  background: var(--primaryColor);
  padding: 15px 20px;
  color: var(--whiteColor);
  text-align: center;
  margin-bottom: 30px;
}

.footer .ftrConBox h2 {
  background: none;
  border: none;
  padding: 0;
  margin-bottom: 0;
  font-size: 22px;
  line-height: 1.2;
}

.footer .ftrConBox small {
  font-size: 12px;
  font-weight: bold;
}

.footer .ftrConBox .tel {
  margin: 10px 0;
  display: block;
  position: relative;
  overflow: hidden;
  background: var(--whiteColor);
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  padding: 3px;
  box-sizing: border-box;
  min-height: 50px;
}

.footer .ftrConBox .note {
  margin: -10px 0 10px;
  font-size: 16px;
}

.footer .ftrConBox .btn {
  display: block;
  position: relative;
  overflow: hidden;
  background: var(--secondaryColor);
  box-sizing: border-box;
  color: var(--whiteColor);
  margin-bottom: 0;
}

.footer .ftrConBox .btn a {
  padding: 3px 3px 3px 35px;
  font-size: 22px;
  font-weight: 500;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(./img/common/ico_mail.png) no-repeat 15px center;
  height: 100%;
  display: block;
  min-height: 50px;
  color: var(--whiteColor) !important;
  border: none;
  background-size: 35px auto;
}

.footer .ftrConBox a {
  display: block;
}

.footer .ftrConBox .catchTxt {
  background: #7d4b30;
  color: var(--whiteColor);
  font-size: 20px;
  margin: 10px -10px 0 -10px;
  clear: both;
  padding: 0 10px;
  font-weight: bold;
}

.footer .ftrConBox strong {
  border-radius: 4px;
  color: var(--whiteColor);
}

.footer .ftrConBox ul {
  position: relative;
  overflow: hidden;
  float: none;
}

.footer .ftrConBox ul li {
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  position: relative;
  overflow: hidden;
  font-size: 13px;
  font-weight: bold;
}

.footer .ftrConBox ul li:last-child {
  margin-right: 0;
}

.footer .ftrConBox ul li a {
  display: block;
  text-decoration: none;
  color: var(--blackColor);
}

.footer .ftrBnr {
  position: relative;
  overflow: hidden;
  margin: 0 40px 20px 0;
  float: left;
  width: 420px;
}

.footer .ftrBnr ul li {
  margin-bottom: 20px;
}

.footer .ftrBnr ul li:last-of-type {
  margin-bottom: 0;
}

.footer .corpNumber {
  font-size: 11px;
}

.footer a,
.footer a:link,
.footer a:visited {
  color: var(--whiteColor);
  text-decoration: none;
}

.footer .ftrLogo {
  margin-bottom: 10px;
  display: block;
}

.footer .ftrLogo span {
  margin-left: 20px;
}

.footer h5,
.footer h6 {
  font-size: 14px;
  margin-bottom: 0;
}

.footer h6 {
  margin-top: 1em;
}

.footer nav {
  float: right;
  background: none;
  margin-top: 0;
}

.footer nav .ftrNav {
  position: relative;
  overflow: hidden;
}

.footer nav .ftrNav>li {
  margin-left: 25px;
}

.footer nav .ftrNav li {
  position: relative;
  padding-left: 13px;
}

.footer nav .ftrNav li:before,
.footer nav .ftrNav li:after {
  display: block;
  content: "";
  position: absolute;
  top: 8px;
  margin: auto;
}

.footer nav .ftrNav li:before {
  z-index: 2;
  left: 1px;
  width: 3px;
  height: 3px;
  border-right: 1px solid var(--whiteColor);
  border-bottom: 1px solid var(--whiteColor);
  transform: rotate(-45deg);
  top: 10px;
}

.footer nav .ftrNav li:after {
  left: 0px;
  top: 8px;
  width: 8px;
  height: 8px;
  background-color: var(--primaryColor);
}

.footer nav .ftrNav li a {
  text-decoration: none;
  color: var(--blackColor);
}

.footer .ftrOuterBnr {
  clear: both;
}

.footer .ftrOuterBnrList {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-end;
}

.footer .ftrOuterBnrList li {
  margin: 0 0 10px 10px;
}

.footer .copyRight {
  text-align: left;
  padding-top: 30px;
  clear: both;
}

.footer .copyRight p {
  font-size: 13px;
}

.footer .footerCom {
  padding: 60px 0 150px;
  position: relative;
  overflow: hidden;
}

.footer .ftrScroll {
  padding: 3px 0;
  background: rgba(0, 0, 0, 0.7);
  position: fixed;
  bottom: 0;
  width: 100%;
  display: none;
  z-index: 100;
  font-size: 12px;
  line-height: 1.2;
}

.footer .ftrScroll .inner {
  margin: 10px auto;
  padding: 0;
  width: 1100px;
}

.footer .ftrScroll .ftrCont {
  background: var(--whiteColor);
  padding: 5px 7px 5px 10px;
  float: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: space-between;
  margin-right: 10px;
}

.footer .ftrScroll .ftrCont h3 {
  background: var(--primaryColor);
  color: var(--whiteColor);
  font-size: 18px;
  margin: -7px 40px -7px -10px;
  padding: 15px 5px 16px 10px;
  position: relative;
  z-index: 1;
}

.footer .ftrScroll .ftrCont h3:after {
  content: "";
  position: absolute;
  left: 60%;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border: solid 40px var(--primaryColor);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  z-index: -1;
}

.footer .ftrScroll .tel {
  float: left;
  margin-right: 10px;
  line-height: 1.3;
  font-size: 12px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  position: relative;
}

.footer .ftrScroll .tel span {
  font-size: 50px;
  font-weight: 900;
  line-height: 0.9;
  display: block;
  padding-left: 40px !important;
  letter-spacing: -0.06rem;
  float: left;
  color: var(--attentionColor);
  margin: 12px 10px 0 0;
  background: url(./img/common/ico_fd03.png) no-repeat left bottom;
  background-size: 40px auto;
}

.footer .ftrScroll .tel small {
  position: absolute;
  top: -4px;
  left: 0px;
  margin: auto;
  display: block;
  font-size: 14px;
}

.footer .ftrScroll .tel .note {
  color: var(--blackColor);
  font-size: 13px;
  background: none;
  font-weight: normal;
  margin: 3px 0 0 0;
  padding: 0 !important;
  float: none;
  letter-spacing: 0.06em;
}

.footer .ftrScroll .ftrCont ul {
  position: relative;
  overflow: hidden;
}

.footer .ftrScroll .ftrCont ul li {
  float: left;
  margin-left: 5px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  width: 190px;
}

.footer .ftrScroll .ftrCont ul li a {
  display: block;
  color: var(--blackColor) !important;
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding: 10px 5px;
  text-decoration: none !important;
  border: var(--blackColor) solid 1px;
  background: var(--whiteColor);
}

.footer .ftrScroll .ftrCont ul li:hover {
  background: rgba(255, 255, 255, 0.3);
  transition: 0.7s;
}

.footer .ftrScroll .ftrCont ul li span {
  font-size: 12px;
  display: block;
}

.footer .ftrScroll .ftrCont ul li:first-child {
  margin-left: 0;
}

.footer .ftrScroll .ftrCont ul li.ftrTel {
  display: none;
}

.footer .ftrScroll .ftrCont ul li.isLogin01 {
  margin-right: 2px;
}

.footer .ftrScroll .ftrCont ul li.isLogin01 a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 5px;
  border-radius: 6px;
  border: 1px solid rgb(255 255 255 / 70%);
  background-color: var(--primaryColor);
}

.footer .ftrScroll .ftrCont ul li.isLogin02 {
  margin-left: 2px;
}

.footer .ftrScroll .ftrCont ul li.isLogin02 a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 5px;
  border-radius: 6px;
  border: 1px solid rgb(255 255 255 / 70%);
  background-color: var(--attentionColor);
}


.footer .ftrScroll .ftrCont ul li.isLogin01 a img,
.footer .ftrScroll .ftrCont ul li.isLogin02 a img {
  position: relative;
  z-index: 2;
}

.footer .ftrScroll .ftrCont ul li.isLogin01 a::before,
.footer .ftrScroll .ftrCont ul li.isLogin02 a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(250 233 72 / 50%);
  animation: blink 3s linear infinite;
}

@keyframes blink {

  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }
}

.footer .ftrScroll .pageTop {
  display: block;
  float: right;
}

.footer .ftrScroll .pageTop a,
span.pageTop {
  width: 74px;
  height: 74px;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  background: var(--blackColor);
}

.footer .ftrScroll .pageTop a:hover img {
  opacity: 0.8;
}

/* -----------------------------------------------------------
    nav
----------------------------------------------------------- */

.nav {
  background: var(--whiteColor);
  position: relative;
}

.nav ul.gNav {
  height: auto;
  margin: 0 auto 10px;
  width: 1160px;
  padding: 0;
  position: relative;
  display: flex;
}

.nav ul.gNav>li {
  border-left: #ccc solid 1px;
  display: block;
  float: left;
  position: relative;
  width: 156px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  -webkit-transform: skewX(160deg);
  -moz-transform: skewX(160deg);
  transform: skewX(160deg);
  -ms-transform: skewX(160deg);
  -o-transform: skewX(160deg);
  margin: 20px 0;
}

.nav ul.gNav>li:last-child {
  margin-right: 0;
  border-right: #ccc solid 1px;
}

.nav ul.gNav>li>a {
  position: relative;
  color: var(--blackColor);
  text-decoration: none;
  text-align: center;
  font-size: 13px;
  line-height: 1.3;
  box-sizing: border-box;
  height: 100%;
  width: 100%;
  text-align: center;
  display: block;
  box-sizing: border-box;
  -webkit-transform: skewX(-160deg);
  -moz-transform: skewX(-160deg);
  transform: skewX(-160deg);
  -ms-transform: skewX(-160deg);
  -o-transform: skewX(-160deg);
  margin: -10px 0;
  padding: 0 10px 0 0;
}

.nav ul.gNav>li img {
  display: block;
  margin: 0 auto 5px;
  max-height: 22px;
}

.nav ul.gNav>li>a span {
  color: var(--primaryColor);
  font-size: 10px;
  display: block;
  font-weight: bold;
}

.nav ul.gNav>li>a:hover {
  opacity: 0.7;
  transition: 0.7s;
}

.header .nav ul>li>a:after {
  display: block;
  position: absolute;
  margin: 0 auto;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 36px;
  height: 36px;
  content: "";
}

.nav ul.gNav li li a:before,
.nav ul.gNav li li a:after {
  content: none;
}

.nav .gNav>li>ul {
  position: absolute;
  top: 64px;
  left: 0;
  z-index: 1;
  min-width: 100%;
  height: 0;
  width: auto;
}

.nav .gNav>li>ul>li {
  visibility: hidden;
  overflow: hidden;
  width: auto;
  /*サブメニューの幅*/
  height: 0;
  background: rgba(45, 41, 32, 0.8);
  border-bottom: solid 1px;
  border-bottom-color: rgba(255, 255, 255, 0.8);
  font-size: 13px;
  transition: 0.7s;
  float: none;
  font-weight: normal;
  text-shadow: none;
}

.nav .gNav li ul li a {
  height: auto;
  border-bottom: none;
  height: 39px;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
}

.nav .gNav li ul li a:before,
.nav .gNav li ul li a:after {
  display: none;
}

.nav .gNav li ul li a:link,
.nav .gNav li ul li a:visited {
  color: var(--whiteColor)fff;
  text-decoration: none;
}

.nav .gNav li ul li:hover,
.nav .gNav li ul>li a:hover {
  color: #f1d200;
  transition: 0.7s;
}

.nav .gNav li:hover ul li,
.nav .gNav li a:hover ul li {
  visibility: visible;
  overflow: visible;
  height: 39px;
  /*サブメニューの高さ*/
}

#menu .nav .gNav>li.gnav03 ul li a,
#menu .nav .gNav>li.gnav04 ul li a {
  color: var(--whiteColor);
}

#menu .nav .gNav>li.gnav03 ul li a:hover,
#menu .nav .gNav>li.gnav04 ul li a:hover {
  color: #f1d200;
  transition: 0.7s;
}

/*--基本の記事スタイル設定--*/

.main p {
  font-size: 16px;
  margin-bottom: 15px;
}

.main a {
  color: var(--primaryColor);
  text-decoration: underline;
}

.main p+h2,
.main p+h3,
.main p+h4,
.main p+h5,
.main p+h6,
.main ul+h2,
.main ul+h3,
.main ul+h4,
.main ul+h5,
.main ul+h6,
.main ol+h2,
.main ol+h3,
.main ol+h4,
.main ol+h5,
.main ol+h6 {
  margin-top: 30px;
}

.main .inner+p+h2,
.main .inner+p+h3,
.main .inner+p+h4,
.main .inner+p+h5,
.main .inner+p+h6 {
  margin-top: 0;
}

.main h1,
.main h2,
.main h3,
.main h4,
.main h5,
.main h6 {
  line-height: 1.5;
  clear: both;
}

.main h2 {
  font-size: 40px;
  color: var(--blackColor);
  position: relative;
  padding: 0 0 15px;
  box-sizing: border-box;
  font-weight: 900;
  line-height: 1.4;
  margin-bottom: 35px;
}

.main h2:after {
  content: "";
  display: block;
  width: 50px;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
  margin: auto;
  background: var(--primaryColor);
}

.main h2 span {
  font-size: 18px;
  font-weight: 700;
  margin-left: 20px;
}

.main #packOther span {
  font-size: 16px;
}

.main h2.fullWidth {
  display: block;
  text-align: center;
  position: relative;
  width: 100%;
  padding: 50px 0 20px;
  margin: 0 0;
  line-height: 1.3;
  border-top: 10px solid var(--primaryColor);
}

.main h2.fullWidth:before {
  content: "";
  height: 0;
  position: absolute;
  width: 0;
  border: solid transparent;
  border-top-color: var(--primaryColor);
  border-width: 32px 100px 0 100px;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 99;
}

.main h2.fullWidth:after {
  content: none;
}

.main h2.fullWidth span {
  color: var(--primaryColor);
  font-size: 22px;
  display: block;
  margin-left: 0;
}

.main h3 {
  font-size: 26px;
  padding: 0;
  margin-bottom: 30px;
  color: var(--blackColor);
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  padding: 5px 0;
  border-bottom: var(--blackColor) solid 1px;
}

.main h3 a {
  color: var(--blackColor);
  text-decoration: underline;
}

.main h4,
.main h4.normal {
  font-size: 18px;
  padding: 0;
  margin-bottom: 15px;
  position: relative;
  line-height: 1.4;
  display: flex;
  align-items: center;
}

.main h4:before,
.main h4.normal:before {
  border-top: var(--primaryColor) 2px solid;
  content: "";
  width: 4.5em;
  /* 線の長さ */
  margin-right: 10px;
}

.main h4 a {
  color: var(--blackColor);
  text-decoration: underline;
}

.main h5 {
  background: var(--primaryColor);
  color: var(--whiteColor);
  font-size: 18px;
  display: inline-block;
  padding: 2px 10px;
  margin-bottom: 20px;
  font-weight: 500;
}

.main h5 a {
  color: var(--whiteColor);
  text-decoration: underline;
}

.main h6 {
  position: relative;
  font-size: 18px;
  padding-left: 20px;
  margin-bottom: 20px;
}

.main h6:before,
.main h6:after {
  position: absolute;
  top: 5px;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main h6:before {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--primaryColor);
}

.main h6:after {
  top: 10px;
  left: 4px;
  width: 4px;
  height: 4px;
  border-top: 2px solid var(--whiteColor);
  border-right: 2px solid var(--whiteColor);
  transform: rotate(45deg);
}

.main h6 a {
  color: var(--blackColor);
  text-decoration: underline;
}

.main blockquote {
  border: solid 1px #ccc;
  background: var(--whiteColor)eee;
  padding: 15px;
  margin-bottom: 15px;
}

.main blockquote p {
  margin: 0;
}

.main ul {
  margin-bottom: 15px;
}

.main ul li {
  font-size: 16px;
  line-height: 1.5;
  margin: 7px 0 0 0;
  position: relative;
  padding-left: 13px;
}

.main ul li:before,
.main ul li:after {
  position: absolute;
  top: 8px;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main ul li:before {
  width: 7px;
  height: 7px;
  background: var(--primaryColor);
}

.main ul li:after {
  left: 1.5px;
  top: 10px;
  width: 2px;
  height: 2px;
  border-top: 1px solid var(--whiteColor);
  border-right: 1px solid var(--whiteColor);
  transform: rotate(45deg);
}

.main ul.txtL li {
  font-size: 24px;
  padding-left: 30px;
}

.main ul.txtL li:after {
  content: none;
}

.main ul.txtL li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f14a";
  font-weight: 900;
  color: var(--whiteColor);
  height: auto;
  background: none;
  width: auto;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 0;
  color: var(--primaryColor);
}

.main ol {
  margin-bottom: 15px;
  padding-left: 40px;
}

.main ol li {
  list-style-type: decimal;
  font-size: 16px;
  line-height: 1.5;
  margin: 7px 0 0 0;
}

.main table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 1px;
  margin-bottom: 20px;
}

.main table th,
.main table td {
  padding: 15px 20px;
  font-size: 15px;
  line-height: 1.7;
  text-align: left;
  vertical-align: top;
  background: var(--whiteColor);
  position: relative;
}

.main table th {
  width: 20%;
  background: var(--primaryColor);
  font-weight: normal;
  color: var(--whiteColor);
}

.main table td a {
  position: absolute;
  right: 20px;
  top: 15px;
  background: var(--secondaryColor);
  border: var(--secondaryColor) solid 2px;
  border-radius: 0;
  color: var(--whiteColor);
  text-decoration: none;
  padding: 0 15px;
  border-radius: 0;
  font-weight: bold;
  transition: ease 0.4s;
}

.main table td a:hover {
  color: var(--primaryColor);
  background: var(--whiteColor);
  transition: ease 0.4s;
}

/*--共通パーツ--*/

.main .catchB {
  border-radius: 6px;
  background: var(--primaryColor);
  color: var(--whiteColor);
  font-weight: bold;
  margin-bottom: 0;
  padding: 10px 20px;
  font-size: 18px;
}

.main .catchTxtP {
  font-weight: bold;
  font-size: 36px;
  line-height: 1.3;
}

.main .catchTxtP strong {
  color: var(--attentionColor);
}

.main .catchTxtP p {
  font-size: 36px;
  line-height: 1.3;
}

.main .photoUL {
  margin: 0 0 0 0;
  padding: 0;
  overflow: hidden;
  display: flex;
}

.main .photoUL li {
  margin: 0 30px 20px 0;
  padding: 0;
  background: none;
  font-size: 17px;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.main .photoUL li:last-child {
  margin: 0 0 20px;
}

.main .photoUL.photoColumn3 {
  flex-flow: row wrap;
}

.main .photoUL.photoColumn3 li {
  width: 32%;
  flex-grow: initial;
  margin: 0 2% 30px 0;
}

.main .photoUL.photoColumn3 li:nth-of-type(3n) {
  margin-right: 0;
}

#works .main .photoUL.photoColumn3 {
  justify-content: flex-start;
}

#works .main .photoUL.photoColumn3 li {
  width: 32%;
  margin-right: 2%;
}

#works .main .photoUL.photoColumn3 li:nth-of-type(3n) {
  margin-right: 0;
}



.main .photoUL li span {
  width: 100%;
  position: relative;
  overflow: hidden;
  display: block;
  background: #f5f5f5;
}

.main .photoUL li span:before {
  content: "";
  display: block;
  padding-top: 60%;
}

.main .photoUL .otherPhoto {
  width: 100%;
  position: relative;
  overflow: hidden;
  display: block;
}

.main .photoUL li span img {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: auto;
}

.main .photoUL li img {
  max-width: 100%;
  height: auto;
}

.main .photoUL li h5 {
  font-size: 15px;
  display: block;
  margin: 0;
}

.main .photoUL li:before,
.main .photoUL li:after {
  content: none;
}

.main .photoUL.photoColumn4 {
  flex-flow: row wrap;
  justify-content: space-between;
}

.main .photoUL.photoColumn4 li {
  width: 25%;
  width: calc(25% - 20px);
  flex-grow: initial;
  margin: 0 0 20px;
  text-align: center;
  font-size: 14px;
}

.main .warryBox,
.main .meritBox {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  padding: 20px;
  box-sizing: border-box;
}

.main .meritBox {
  border: #e2e2e2 solid 5px;
}

.main .merit h2 {
  background: #ff6600;
  font-size: 25px;
  color: var(--whiteColor);
  line-height: 1.3;
  padding: 10px;
  margin: 0;
}

.main .warryBox p,
.main .meritBox p {
  line-height: 1.4;
  font-size: 15px;
  margin-bottom: 0;
}

.main .warryBox img {
  float: left;
  margin-right: 30px;
}

.main .meritBox img {
  margin-bottom: 0;
}

.main .meritBox .meritTxt {
  margin-left: 320px;
}

.main .warryList,
.main .meritList {
  border-top: #d5d5d5 solid 1px;
  padding-top: 10px;
  overflow: hidden;
}

.main .warryList {
  border-top: var(--blackColor) dotted 1px;
}

.main .warryList li,
.main .meritList li {
  background: none;
  border-bottom: #d5d5d5 solid 1px;
  position: relative;
  font-size: 20px;
  font-weight: bold;
  padding: 0 0 7px 25px;
  margin: 0 0 8px;
}

.main .warryList li {
  font-size: 24px;
  padding: 0 0 7px 40px;
  border-bottom: var(--blackColor) dotted 1px;
}

.main .meritList li span {
  background: var(--attentionColor);
  border-radius: 5px;
  color: var(--whiteColor);
  display: inline-block;
  padding: 0 10px;
  margin-right: 15px;
}

.main .meritList li:before,
.main .meritList li:after {
  position: absolute;
  top: 4px;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main .meritList li:before {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--attentionColor);
}

.main .meritList li:after {
  left: 5px;
  top: 9px;
  width: 6px;
  height: 6px;
  border-top: 2px solid var(--whiteColor);
  border-right: 2px solid var(--whiteColor);
  transform: rotate(45deg);
}

.main .warryList li:last-child,
.main .meritList li:last-child {
  margin-bottom: 0;
}

.main .warryList>li:before,
.main .warryList>li:after {
  position: absolute;
  top: 5px;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main .warryList>li:before {
  background: #22287f;
  border-radius: 4px;
  width: 25px;
  height: 25px;
}

.main .warryList>li:after {
  left: 6px;
  top: 12px;
  width: 10px;
  height: 5px;
  border-left: 4px solid var(--whiteColor);
  border-bottom: 4px solid var(--whiteColor);
  border-right: none;
  border-top: none;
  transform: rotate(-45deg);
}

.main .warryList li strong {
  background: #fcff00;
  display: inline-block;
  line-height: 0.5;
}

.main .meritList li strong {
  color: var(--attentionColor);
}

.main .meritBox .diagnosisList {
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0;
}

.main .meritBox .diagnosisList li {
  border-radius: 4px;
  background: #22287f;
  color: var(--whiteColor);
  font-size: 25px;
  font-weight: bold;
  text-align: center;
  width: 24%;
  width: calc(25% - 10px);
  padding: 3px 0;
  margin-top: 0;
}

.main .meritBox .diagnosisList li:before,
.main .meritBox .diagnosisList li:after {
  content: none;
}

.main .meritBox .diagnosisP {
  color: var(--whiteColor);
  border-radius: 4px;
  background: #4dbe53;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
  padding: 10px 0;
}

.main .diagnosisCtcP {
  color: var(--whiteColor);
  border-radius: 4px;
  background: #3e984f;
  font-size: 30px;
  font-weight: bold;
  text-align: center;
  padding: 10px 0;
  margin: 10px 0;
}

/*---メダル付キャッチコピー---*/
.main .medalCatch {
  position: relative;
  z-index: 10;
  margin: 0 auto;
  font-weight: bold;
  font-size: 27px;
  display: block;
  line-height: 1.2;
}

.main .medalCatch img {
  float: left;
  margin: -10px 15px 0 0;
}

.main .medalCatch strong {
  color: var(--attentionColor);
}

.main .medalCatch span {
  display: block;
}

.main .medalCatch span.txtL {
  font-size: 42px;
  font-weight: normal;
}

.main .medalCatch span.txtL strong {
  color: var(--primaryColor);
}

.main .medalCatch span.txtEn {
  color: #22287f;
  font-size: 15px;
}

/*---外壁塗装のプロに相談しよう！見積りを取られている方へ！--*/

.main .bnrBoxT .consultationBox {
  margin-bottom: 20px;
}

.consultationBox {
  width: 480px;
  position: relative;
}

.consultationBox a {
  text-decoration: none;
}

.consultationBox h3 {
  background: var(--primaryColor);
  color: var(--whiteColor);
  font-size: 20px;
  border-top: none;
  margin: 0;
  padding: 5px 15px;
  text-align: center;
}

.consultationBox .inBox {
  border: #ccc solid 1px;
  background: var(--whiteColor);
  box-sizing: border-box;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.consultationBox h4 {
  font-size: 18px;
  padding: 0 0 5px 50px;
  position: relative;
  margin: 0 0 15px;
  line-height: 1.5;
  text-decoration: none;
  color: var(--blackColor);
  border-bottom: #ccc solid 1px;
}

.consultationBox h4:before,
.consultationBox h4:after {
  border-radius: 50%;
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  font-size: 30px;
  line-height: 1;
  background: #22287f;
  width: 20px;
  height: 20px;
}

.consultationBox h4:before {
  left: -5px;
  opacity: 0.5;
}

.consultationBox h4:after {
  left: 18px;
}

.consultationBox .inBox a {
  background: url(./img/common/bg_consultationbox.jpg) no-repeat top left/cover;
  display: block;
  padding: 15px 15px 0 15px;
}

.consultationBox .inBox a:hover {
  opacity: 0.7;
  transition: 0.7s;
}

.consultationBox .inBox .consultationImg {
  margin: 0;
}

.consultationBox .btn {
  margin-bottom: 0;
  padding: 6px 20px 6px 40px;
  width: auto;
  position: absolute;
  right: 10px;
  bottom: 12px;
  font-size: 16px;
  display: inline-block;
  border-radius: 5px;
  border: 2px #22287f solid;
  color: var(--whiteColor);
  font-weight: bold;
  background: #22287f;
  box-shadow: 0px 3px 0px 0px rgba(255, 255, 255, 0.3) inset;
}

.consultationBox .btn:before,
.consultationBox .btn:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.consultationBox .btn:before {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--whiteColor);
}

.consultationBox .btn:after {
  left: 15px;
  width: 5px;
  height: 5px;
  border-top: 2px solid #22287f;
  border-right: 2px solid #22287f;
  transform: rotate(45deg);
  z-index: 10;
}

.consultationBox p.consultationTxt {
  font-size: 12px;
  color: var(--blackColor);
  padding: 60px 0 0 240px;
  margin: 0;
  position: relative;
}

.consultationBox .imgLayer {
  top: -80px;
  right: -3px;
  z-index: 10;
}

.consultationBox .catchTxt {
  position: absolute;
  right: 0;
  bottom: 0;
  margin-bottom: 5px;
}

.consultationBox .catchTxt span {
  color: var(--attentionColor);
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
  margin-bottom: 0;
  float: right;
  line-height: 1.2;
}

.consultationBox .catchTxt span strong {
  color: var(--blackColor);
  font-size: 33px;
  background: linear-gradient(transparent 60%, #fcff00 40%);
  display: block;
  line-height: 1;
}

.consultationBox .catchTxt span.txtHp {
  color: var(--blackColor);
  font-size: 11px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
  margin-bottom: 0;
  float: right;
}

.consultationBox ul {
  position: relative;
  overflow: hidden;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0;
}

.consultationBox ul li {
  position: relative;
  font-size: 20px;
  font-weight: bold;
  background: var(--attentionColor);
  box-shadow: 0 -3px 0 #930839 inset;
  padding: 0;
  transition: 0.7s;
  text-align: center;
  color: var(--whiteColor);
  margin: 0;
}

.consultationBox ul li:hover {
  opacity: 0.7;
  transition: 0.7s;
}

.consultationBox ul li a {
  display: block;
  padding: 3px 10px;
  color: var(--whiteColor);
  text-decoration: none;
  text-align: center;
  transition: 0.7s;
}

.consultationBox ul li:before,
.consultationBox ul li:after {
  content: none;
}

.estimatesBox {
  width: 480px;
  position: relative;
}

.estimatesBox a {
  text-decoration: none;
  color: var(--blackColor);
}

.estimatesBox .imgLayer {
  top: -30px;
  right: 0;
  z-index: 0;
}

.estimatesBox h3 {
  background: var(--primaryColor);
  color: var(--whiteColor);
  font-size: 20px;
  padding: 5px 15px;
  border: none;
  margin: 0;
  position: relative;
}

.estimatesBox h3 .imgLayer {
  position: absolute;
  right: 3px;
  top: -10px;
  z-index: 10;
}

.estimatesBox .inBox {
  border: #ccc solid 1px;
  background: var(--whiteColor);
  box-sizing: border-box;
  padding: 15px;
  position: relative;
}

.estimatesBox h4 {
  font-size: 18px;
  padding: 0 0 0 50px;
  position: relative;
  margin: 0 0 5px;
}

.estimatesBox h4:before,
.estimatesBox h4:after {
  border-radius: 50%;
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  font-size: 30px;
  line-height: 1;
  background: #22287f;
  width: 20px;
  height: 20px;
}

.estimatesBox h4:before {
  left: -5px;
  opacity: 0.5;
}

.estimatesBox h4:after {
  left: 18px;
}

.estimatesBox .inBox p {
  font-size: 39px;
  line-height: 1;
  font-weight: bold;
  z-index: 10;
  position: relative;
  margin-bottom: 10px;
  margin-top: 10px;
}

.estimatesBox .inBox p strong {
  color: var(--attentionColor);
}

.estimatesBox .inBox p.spLady span {
  border-radius: 4px;
  background: var(--attentionColor);
  color: var(--whiteColor);
  font-size: 20px;
  padding: 9px 7px;
  margin-right: 4px;
  display: inline-block;
  vertical-align: 5px;
}

.estimatesBox .inBox .telBox {
  background: var(--blackColor);
  padding: 10px;
  margin-top: 5px;
  position: relative;
}

.estimatesBox .inBox .telBox h5 {
  background: none;
  color: var(--whiteColor);
  font-size: 14px;
  line-height: 1;
  margin: 0;
  padding: 0;
  display: block;
}

.estimatesBox .inBox .telBox .number {
  background: var(--whiteColor);
  margin-top: 5px;
  padding: 5px 10px;
}

.estimatesBox .inBox .telBox .tel {
  font-size: 12px;
  font-weight: bold;
  display: inline-block;
  text-align: left;
  margin: 0;
  line-height: 1.4;
  padding-left: 5px;
  text-align: center;
}

.estimatesBox .inBox .telBox .tel span {
  background-size: 54px auto;
  font-size: 60px;
  line-height: 0.9;
  padding: 0 0 0 54px;
  margin: 0;
  display: block;
  letter-spacing: inherit;
}

.estimatesBox .inBox .telBox .tel .telClose {
  background: none;
  font-size: 12px;
  padding: 0;
  margin: 5px 0 0 20px;
  display: block;
  font-family: inherit;
}

/*---バナーエリア--*/

.main .bnrArea {
  position: relative;
  overflow: hidden;
  margin-bottom: 40px;
}

.main .bnrArea li {
  float: left;
  margin-top: 50px;
  padding: 0;
}

.main .bnrArea li:first-child {
  margin-top: 0;
}

.main .bnrArea li:before,
.main .bnrArea li:after {
  content: none;
}

/*--コンタクトエリア--*/

.contactBox,
.main .contactBox {
  background: #f5f5f5;
  border: var(--blackColor) dashed 1px;
  padding: 30px;
  position: relative;
  margin: 0 auto;
  box-sizing: border-box;
  width: 1100px;
  overflow: hidden;
}

.contactBox h2,
.main .contactBox h2 {
  text-align: center;
  line-height: 1.2;
}

.contactBox h2:after,
.main .contactBox h2:after {
  right: 0;
}

.contactBox h2 span,
.main .contactBox h2 span {
  display: block;
  line-height: 1;
  margin: 0;
}

.contactBox .inBox,
.main .contactBox .inBox {
  background: var(--primaryColor);
  padding: 15px 50px;
  text-align: center;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

.contactBox .inBoxWrap,
.main .contactBox .inBoxWrap {
  display: flex;
  justify-content: space-between;
}

.main .contactBox .inBox {
  width: 48%;
  width: calc(50% - 20px);
  margin: 0 40px 0 0;
  float: left;
}

.contactBox .inBoxWrap .inBox,
.main .contactBox .inBoxWrap .inBox {
  float: none;
}

.main .contactBox .inBox:nth-of-type(2n) {
  margin-right: 0;
}

.contactBox .inBox p,
.main .contactBox .inBox p {
  color: var(--whiteColor);
}

.contactBox h3,
.main .contactBox h3 {
  background: none;
  border: none;
  padding: 0;
  margin-bottom: 0;
  font-size: 22px;
  font-weight: bold;
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", Sans-Serif;
  color: var(--whiteColor);
}

.main .contactBox small {
  font-size: 12px;
  font-weight: bold;
}

.contactBox .tel,
.main .contactBox .tel {
  margin: 0;
  display: block;
  position: relative;
  overflow: hidden;
  background: var(--whiteColor);
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  padding: 3px;
  box-sizing: border-box;
  min-height: 50px;
}

.contactBox .note,
.main .contactBox .note {
  margin-bottom: 0;
}

.contactBox .inBox .btn,
.main .contactBox .inBox .btn {
  display: block;
  position: relative;
  overflow: hidden;
  background: var(--secondaryColor);
  box-sizing: border-box;
  color: var(--whiteColor);
  margin-bottom: 0;
}

.contactBox .inBox .btn:hover,
.main .contactBox .inBox .btn:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.contactBox .inBox .btn a,
.main .contactBox .inBox .btn a {
  padding: 3px 3px 3px 35px;
  font-size: 22px;
  font-weight: 500;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(./img/common/ico_mail.png) no-repeat 15px center;
  background-size: 30px auto;
  height: 100%;
  display: block;
  min-height: 50px;
  color: var(--whiteColor) !important;
  border: none;
}

.main .contactBox ul {
  position: relative;
  overflow: hidden;
  margin: 0 0 10px;
}

.main .contactBox ul li {
  padding: 0;
}

.main .contactBox ul li::before,
.main .contactBox ul li::after {
  content: none;
}

.main .contactBox ul li:last-child {
  margin-right: 0;
}

#menu .main .contactBox,
.nocolumn .main .contactBox {}

.nocolumn .main .contactBox {
  background: var(--whiteColor);
  border: var(--primaryColor) solid 10px;
  padding: 10px;
  width: 1100px;
  margin: 25px auto;
}

.main .contactBox .floatL img {
  position: absolute;
  top: -34px;
  left: -5px;
}

/*---comContactL---*/

.main .comContactLBox {
  position: relative;
  overflow: hidden;
  border-bottom: #ccc solid 1px;
}

.main .comContactLBox a {
  text-decoration: none;
  color: var(--blackColor);
}

.main .comContactLBox .imgLayer {
  top: 0;
  left: 375px;
  z-index: 1;
}

.main .comContactLBox h3 {
  background: #12a73b;
  color: var(--whiteColor);
  font-size: 20px;
  padding: 0 15px;
  border-top: none;
  margin-bottom: 0;
  line-height: 1.8;
}

.main .comContactLBox .inBox {
  border: #ccc solid;
  border-width: 1px 1px 0 1px;
  background: var(--whiteColor);
  box-sizing: border-box;
  padding: 10px;
  position: relative;
  overflow: hidden;
}

.main .comContactLBox h4 {
  padding-bottom: 10px;
  margin: 0 0 15px;
  border-bottom: #ccc solid 1px;
  display: inline-block;
}

.main .comContactLBox .inBox p {
  font-size: 27px;
  font-weight: bold;
  z-index: 10;
  position: relative;
  margin-bottom: 0;
}

.main .comContactLBox .inBox p strong {
  color: var(--attentionColor);
}

.main .comContactLBox .inBox p span {
  border-radius: 4px;
  background: var(--attentionColor);
  color: var(--whiteColor);
  font-size: 20px;
  padding: 7px;
  margin-right: 5px;
}

.main .comContactLBox .inBox .telBox {
  background: var(--whiteColor);
  padding: 10px 25px;
  float: right;
  width: 420px;
  position: relative;
  text-align: center;
  box-sizing: border-box;
  margin-bottom: 10px;
  z-index: 1;
}

.main .comContactLBox .inBox .telBox .imgLayer {
  bottom: 100%;
  right: 0;
  top: inherit;
  z-index: 0;
}

.main .comContactLBox .inBox .telBox h5 {
  color: var(--blackColor);
  background: none;
  font-size: 15px;
  padding: 0;
  display: block;
  margin-bottom: 0;
}

.main .comContactLBox .inBox .telBox .number {
  text-align: center;
}

.main .comContactLBox .inBox .telBox .tel {
  font-size: 13px;
  font-weight: normal;
  display: inline-block;
  text-align: left;
  margin-bottom: 0;
  line-height: 1.2;
}

.main .comContactLBox .inBox .telBox .tel span {
  background: url(./img/common/ico_freedial02.png) no-repeat left 90%;
  color: var(--attentionColor);
  font-size: 59px;
  line-height: 1;
  padding: 0 0 0 65px;
  margin: 0 0;
  display: block;
  white-space: nowrap;
}

.main .comContactLBox .inBox .catchTxt {
  background: var(--primaryColor);
  clear: both;
  color: var(--whiteColor);
  text-align: center;
  display: block;
  font-size: 20px;
  font-weight: bold;
}

/*---contactScroll---*/

.main .ContactScrollBox {
  border: var(--attentionColor) solid 3px;
  position: relative;
  padding: 10px 275px 10px 170px;
  margin: 30px auto 40px;
  width: 1000px;
  box-sizing: border-box;
}

.main .ContactScrollBox .freeDiagnosis {
  width: 92px;
  color: var(--whiteColor);
  font-weight: bold;
  line-height: 1.1;
  font-size: 45px;
  background: var(--attentionColor);
  padding: 10px 30px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: 0;
}

.main .ContactScrollBox .tel {
  display: table;
  margin-bottom: 10px;
}

.main .ContactScrollBox .tel span {
  font-size: 54px;
  display: table-cell;
  vertical-align: bottom;
  background: url(./img/common/ico_freedial04.png) no-repeat left center;
  background-position: bottom left;
  background-position: bottom 3px left;
  padding-left: 60px;
  line-height: 1;
}

.main .ContactScrollBox .tel span.timeS {
  font-size: 14px;
  display: table-cell;
  vertical-align: bottom;
  width: 11em;
  background: none;
  color: var(--blackColor);
  font-weight: normal;
  padding-left: 10px;
  line-height: 1.3;
  font-family: "Noto Sans JP", sans-serif;
}

.main .ContactScrollBox .telPlease {
  clear: both;
  margin-bottom: 0;
  background: var(--primaryColor);
  border-radius: 5px;
  color: var(--whiteColor);
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
  padding: 4px 0;
}

.main .ContactScrollBox .toForm {
  background: #46ae00;
  display: block;
  border-radius: 5px;
  color: var(--whiteColor);
  font-size: 34px;
  font-weight: bold;
  text-decoration: none;
  background: linear-gradient(top,
      #12bfaa 0%,
      #12bfaa 50%,
      #22287f 51%,
      #22287f 100%);
  background: -webkit-linear-gradient(top,
      #12bfaa 0%,
      #12bfaa 50%,
      #22287f 51%,
      #22287f 100%);
  background: -moz-linear-gradient(top,
      #12bfaa 0%,
      #12bfaa 50%,
      #22287f 51%,
      #22287f 100%);
  background: -o-linear-gradient(top,
      #12bfaa 0%,
      #12bfaa 50%,
      #22287f 51%,
      #22287f 100%);
  background: -ms-linear-gradient(top,
      #12bfaa 0%,
      #12bfaa 50%,
      #22287f 51%,
      #22287f 100%);
  position: absolute;
  top: 10px;
  bottom: 10px;
  right: 10px;
  width: 140px;
  padding: 10px 30px 10px 80px;
  line-height: 1;
}

.main .ContactScrollBox .toForm::before {
  content: "";
  width: 43px;
  height: 47px;
  background-image: url(./img/common/ico_mail.png);
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 20px;
  margin: auto;
}

.main .ContactScrollBox .toForm span {
  display: block;
  font-size: 25px;
}

.main .ContactScrollBox .toForm:hover {
  opacity: 0.8;
  transition: 0.7s;
}

/*---店舗案内--*/

.shopInfo,
.main .shopInfo {
  position: relative;
  overflow: hidden;
}

.shopInfo ul {
  position: relative;
  overflow: hidden;
}

.main .shopInfo ul {
  margin-top: 0;
}

.shopInfo ul li,
.main .shopInfo ul li {
  float: left;
  margin: 0 20px 0 0;
  background: var(--blackColor);
  padding: 0;
  margin: 0 17px 0 0;
  width: 320px;
  position: relative;
}

.shopInfo ul li:nth-child(3),
.main .shopInfo ul li:nth-child(3) {
  margin-right: 0;
}

.shopInfo ul li:last-child,
.main .shopInfo ul li:last-child {
  margin-right: 0;
}

.shopInfo ul li a,
.main .shopInfo ul li a {
  text-decoration: none;
}

.shopInfo ul li h4,
.main .shopInfo ul li h4 {
  position: relative;
  overflow: hidden;
  margin: 0;
  color: var(--whiteColor);
  font-size: 23px;
  writing-mode: vertical-lr;
  -ms-writing-mode: tb-lr;
  box-sizing: border-box;
  line-height: 1.3;
  height: 170px;
  text-align: left;
  padding: 10px 10px;
  float: left;
}

.main .shopInfo ul li h4:before,
.main .shopInfo ul li h4:after {
  content: none;
  display: none;
}

.shopInfo ul li .shopPict {
  height: 170px;
  width: 268px;
  overflow: hidden;
  display: block;
  float: right;
  position: relative;
}

.shopInfo ul li .shopPict img {
  position: absolute;
  width: 100%;
  height: auto;
}

.shopInfo ul li .tel,
.main .shopInfo ul li .tel {
  font-size: 11px;
  color: var(--whiteColor);
  padding: 10px;
  line-height: 1.5;
  background-color: #4fa800;
  margin-top: 0;
  clear: both;
}

.shopInfo ul li .tel span,
.main .shopInfo ul li .tel span {
  background: url(./img/common/ico_freedial03a.png) no-repeat left center;
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 35px;
  padding-left: 40px;
  line-height: 1;
  display: block;
}

/*---店舗案内マップ付--*/
.shopAccess>ul>li {
  background: none;
  margin: 0 0 40px;
  padding: 0;
  text-align: left;
}

.shopAccess ul li:before,
.shopAccess ul li:after {
  display: none;
}

.shopAccess ul li .shopMain {
  background: var(--attentionColor);
  float: left;
  width: 282px;
  margin-right: 30px;
}

.shopAccess ul li .shopMain .tel {
  font-size: 11px;
  color: var(--whiteColor);
  padding: 10px;
  line-height: 1.5;
  margin: 0;
}

.shopAccess ul li .shopMain .tel span {
  background: url(./img/common/ico_freedial03.png) no-repeat left center;
  font-size: 29px;
  font-family: "Arial Black", Gadget, sans-serif;
  padding-left: 40px;
  line-height: 1;
}

.shopAccess ul li .shopSummery h5 {
  margin: 0;
  border-radius: 0;
  padding: 5px 40px;
  text-align: center;
  font-size: 20px;
}

.shopAccess ul li .shopSummery {
  overflow: hidden;
  position: relative;
}

.shopAccess ul li .shopSummery .catchTxt {
  font-size: 28px;
  font-weight: bold;
}

.shopAccess ul li .shopSummery .btn {
  position: absolute;
  right: 0;
  bottom: 15px;
  margin-bottom: 0;
}

/*---外壁診断 雨漏り診断--*/

.main .combnrList {
  position: relative;
  overflow: hidden;
}

.main .combnrList li {
  color: var(--whiteColor);
  font-size: 18px;
  font-weight: bold;
  padding: 0;
  width: 530px;
  float: left;
  text-align: center;
}

.main .combnrList li.sizL {
  width: auto;
  float: none;
  margin: 0;
  text-align: left;
}

.main .combnrList li:nth-child(2n) {
  float: right;
}

.main .combnrList li:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.main .combnrList li a {
  color: var(--whiteColor);
  text-decoration: none;
  display: block;
}

.main .combnrList li a span {
  position: relative;
  display: block;
  padding: 5px 10px 5px 40px;
}

.main .combnrList li a span:before,
.main .combnrList li a span:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 15px;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main .combnrList li a span:before {
  width: 18px;
  height: 18px;

  border-radius: 50%;
  background: var(--whiteColor);
}

.main .combnrList li a span:after {
  left: 18px;
  width: 5px;
  height: 5px;
  border-top: 2px solid #940000;
  border-right: 2px solid #940000;
  transform: rotate(45deg);
}

.main .combnrList li:nth-child(2n) a span:after {
  border-top-color: #5e2b06;
  border-right-color: #5e2b06;
}

.main .combnrList li:before,
.main .combnrList li:after {
  content: none;
}

.main .bnrBoxT article {
  padding: 0;
}

.main .combnrListOtr {
  position: relative;
  overflow: hidden;
}

.main .combnrListOtr li {
  border-radius: 8px;
  color: var(--whiteColor);
  font-size: 18px;
  font-weight: bold;
  padding: 0;
  width: 480px;
  float: left;
  text-align: center;
  margin: 0;
  margin-top: 40px;
}

.main .combnrListOtr li:nth-child(-n + 2) {
  margin-top: 0;
}

.main .combnrListOtr li:nth-child(2n) {
  float: right;
}

.main .combnrListOtr li:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.main .combnrListOtr li a {
  color: var(--whiteColor);
  text-decoration: none;
}

.main .combnrListOtr li:before,
.main .combnrListOtr li:after {
  content: none;
}

/*---理由 メニューバナー--*/
.main .reaBnrList {
  position: relative;
  overflow: hidden;
  margin: 10px 0;
}

.main .reaBnrList li {
  background: #22287f;
  color: var(--whiteColor);
  font-size: 24px;
  font-weight: bold;
  padding: 0;
  width: 480px;
  float: left;
  text-align: left;
  margin: 0;
}

.main .reaBnrList li:nth-child(2n) {
  float: right;
  background: var(--primaryColor);
}

.main .reaBnrList li:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.main .reaBnrList li a {
  color: var(--whiteColor);
  text-decoration: none;
  padding: 10px;
  display: block;
}

.main .reaBnrList li a img {
  margin-bottom: 15px;
}

.main .reaBnrList li a span {
  position: relative;
  display: block;
  line-height: 1.3;
  height: 60px;
}

.main .reaBnrList li a span small {
  display: block;
  font-size: 16px;
  color: #fcff00;
  margin-bottom: 5px;
}

.main .reaBnrList li a span:before,
.main .reaBnrList li a span:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 8px;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main .reaBnrList li a span:before {
  width: 26px;
  height: 26px;

  border-radius: 50%;
  background: var(--whiteColor);
}

.main .reaBnrList li a span:after {
  right: 16px;
  width: 8px;
  height: 8px;
  border-top: 4px solid #22287f;
  border-right: 4px solid #22287f;
  transform: rotate(45deg);
}

.main .reaBnrList li:nth-child(2n) a span:after {
  border-top-color: var(--primaryColor);
  border-right-color: var(--primaryColor);
}

.main .reaBnrList li:before,
.main .reaBnrList li:after {
  content: none;
}

/*---外壁塗装工事パック商品--*/
.main .serviceContents .inner {
  padding: 40px 0;
}

.main .packList h2.normal {
  background: none;
  padding: 0;
  text-align: center;
  font-size: 35px;
  color: var(--blackColor);
  line-height: 1.4;
  padding: 0;
  margin: 0 auto 30px;
  position: relative;
  text-align: center;
  text-shadow: none;
}

.main .packList h2.normal span {
  background: none;
  padding: 0;
}

.main .serviceContents h3 {
  font-size: 20px;
  color: var(--whiteColor);
  line-height: 1.2;
  padding: 10px;
  margin: 0 0 20px 0;
  position: relative;
  border: none;
}

.main .serviceContents .whiteBox {
  border-radius: 5px;
  background-color: rgba(255, 255, 255, 0.9);
  padding: 25px;
  margin-top: 40px;
}

.main .serviceContents ul.otherMenuU {
  display: flex;
  justify-content: space-between;
}

.main .serviceContents ul.otherMenuU li {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  padding: 0;
}

.main .serviceContents ul.otherMenuU li a {
  color: var(--blackColor);
  text-decoration: none;
}

.main .serviceContents ul.otherMenuU li img {
  display: block;
  margin-bottom: 5px;
}

.main .serviceContents ul.otherMenuU li:before,
.main .serviceContents ul.otherMenuU li:after {
  display: none;
}

.main .serviceContents .whiteBox p {
  font-size: 15px;
  margin-top: 0;
}

.main .serviceContents .imgLayer {
  right: 0;
  top: 0;
  z-index: 22;
}

.main .serviceContents .catchTtl {
  width: 1000px;
  margin: 0 auto;
  display: flex;
  -ms-align-items: center;
  align-items: center;
}

.main .serviceContents .catchTtl p {
  font-size: 80px;
  font-weight: bold;
  position: relative;
  display: inline;
  margin: 0 100px 0 0;
}

.main .serviceContents .catchTtl span {
  background: #ff6600;
  color: var(--whiteColor);
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  float: left;
  margin-right: -10px;
  padding-top: 5px;
  box-sizing: border-box;
}

.main .serviceContents .catchTtl .imgLayer {
  left: 100%;
}

.main .servicePackOther .servicePackOtherInner {
  margin-bottom: 15px;
}

.main .servicePackOther .servicePackOtherInner article {
  margin-bottom: 0;
}

.main .servicePackOther .servicePackOtherInner article a {
  display: block;
}

.main .servicePackOther .servicePackOtherInner article img {
  max-width: 100%;
  height: auto;
}

.main .serviceMenu {
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}

.main .serviceMenu article a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  text-decoration: none;
  color: var(--blackColor);
  opacity: 1;
  transition: 0.7s;
}

.main .serviceMenu article a:hover {
  text-decoration: none;
  color: var(--blackColor);
  opacity: 0.7;
  transition: 0.7s;
}

.main .serviceMenu article {
  border: var(--whiteColor) solid 2px;
  box-shadow: 10px 10px 0px -3px rgba(0, 0, 0, 0.2);
  margin: 0 10px 30px 0;
  color: var(--whiteColor);
  padding: 0;
  background: var(--whiteColor);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;

  opacity: 0;
  transform: translateY(30px);
  transition: all 0.9s;
  -webkit-transition: all 0.9s;
  -moz-transition: all 0.9s;
  -ms-transition: all 0.9s;
  -o-transition: all 0.9s;
  -webkit-transform: translateY(30px);
  -moz-transform: translateY(30px);
  -ms-transform: translateY(30px);
  -o-transform: translateY(30px);
}

.main .packOther {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: stretch;
}

.main .packOther article {
  width: 48%;
  width: calc(50% - 30px);
  margin: 0 10px 30px 0;
  display: block;
}

.main .packTtl {
  position: relative;
  float: left;
}

.main .packTtl h3 {
  font-size: 30px;
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", Sans-Serif;
  box-shadow: none;
  background: var(--attentionColor);
  width: 160px;
  height: 185px;
  float: left;
  border-top: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  position: relative;
  margin: 0 0 0;
  box-sizing: border-box;
  text-align: center;
}

.main .packRoof .packTtl h3 {
  background: var(--primaryColor);
}

.main .waterProof .packTtl h3 {
  background: var(--secondaryColor);
}

.main .packOther .packTtl h3 {
  background: #15490b;
}

.main .packWpack .packTtl h3,
.main .packWplan .packTtl h3 {
  background: var(--secondaryColor);
}

.main .packTtl h3 span {
  display: inline-block;
  text-align: center;
  font-size: 20px;
}

.main .packTtl h3 span.typeTtl {
  background: var(--whiteColor);
  font-size: 15px;
  text-align: center;
  padding: 5px 5px;
  display: block;
  margin: 10px 0 0;
  width: 100%;
  color: var(--attentionColor);
  font-weight: 700;
}

.main .packRoof .packTtl h3 span.typeTtl {
  color: var(--primaryColor);
}

.main .waterProof .packTtl h3 span.typeTtl {
  color: var(--blackColor);
}

.main .packOther .packTtl h3 span.typeTtl {
  color: var(--secondaryColor);
}

.main .packWpack .packTtl h3 span.typeTtl,
.main .packWplan .packTtl h3 span.typeTtl {
  color: #378192;
}

.main .packImg {
  width: 300px;
  height: 185px;
  overflow: hidden;
  margin: 0;
  float: left;
  position: relative;
}

.main .packOther .packImg {
  width: 360px;
}

.main .packImg img {
  width: 100%;
  object-fit: cover;
}

.main .packImg span {
  background: var(--attentionColor);
  color: var(--whiteColor);
  font-size: 18px;
  font-weight: bold;
  padding: 5px 10px;
  transform: rotate(-45deg);
  display: block;
  position: absolute;
  right: -90px;
  bottom: 40px;
  width: 280px;
  text-align: center;
  box-sizing: border-box;
}

.main .packsummary {
  position: relative;
  overflow: hidden;
  padding: 0 7px;
  width: 625px;
  max-width: 100%;
  box-sizing: border-box;
}

.main .packList h4 {
  font-size: 34px;
  color: var(--blackColor);
  position: relative;
  padding-left: 0;
  margin: 0 0 8px;
  line-height: 1;
}

.main .packList h4 span {
  font-size: 21px;
  margin-right: 5px;
}

.main .packList h4:before,
.main .packList h4:after {
  display: none;
}

.main .packList .packCatch {
  position: relative;
  overflow: hidden;
  margin: 0 0 5px;
  text-align: center;
}

.main .packList .packCatch li {
  width: 110px;
  float: left;
  margin: 0 5px 0 0;
  text-align: center;
  text-align: center;
  font-size: 18px;
  line-height: 1.1;
  border-radius: 4px;
  background: #ff6600;
  color: var(--whiteColor);
  display: inline-block;
  padding: 8px 0;
  font-weight: bold;
  border: none;
}

.main .packList .packCatch li span {
  font-size: 14px;
}

.main .packList ul li:before,
.main .packList ul li:after {
  display: none;
}

.main .packCatch ul li:last-child {
  margin-bottom: 0;
}

.main .basicC {
  font-size: 20px;
  background: var(--blackColor);
  color: var(--whiteColor);
  font-weight: bold;
  padding: 5px;
  line-height: 1;
  clear: both;
}

.main .basicC.basicTxt span {
  background: var(--whiteColor);
  color: var(--blackColor);
  border-radius: 5px;
  padding: 0 5px;
  position: relative;
  margin: 0 5px;
}

.main .basicC.basicTxt span:before {
  font-family: "Font Awesome 5 Free";
  content: "\f055";
  font-weight: 900;
  color: var(--blackColor);
  font-size: 18px;
  position: absolute;
  right: 100%;
  background: var(--whiteColor);
  border-radius: 50%;
  width: 15px;
  height: 15px;
  line-height: 1;
  top: 0;
  bottom: 0;
  margin: auto;
}

.main .basicC.basicTxt span:first-of-type {
  margin-left: 0;
}

.main .basicC.basicTxt span:first-of-type:before {
  content: none;
}

.main .basicC.basicTxt {
  line-height: 1.5;
}

.main .packList .imgIco {
  position: absolute;
  left: 210px;
  top: 0;
  z-index: 99;
}

.main .packList p {
  margin-bottom: 0;
}

.main .packList ul.optionalUl {
  margin: 0;
  line-height: 1;
  /* position: absolute; */
  bottom: 25px;
}

.main .packList ul.optionalUl li {
  display: block;
  float: none;
  border: none;
  width: 160px;
  padding: 2px 5px;
  background: var(--attentionColor);
  margin: 5px 10px 0 0;
  color: var(--whiteColor);
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  overflow: hidden;
}

.main .packList ul.optionalUl li:last-child {
  margin-right: 0;
}

.main .packList ul.optionalUl li span {
  display: inline-block;
  float: right;
  border-radius: 5px;
  background: var(--whiteColor);
  color: var(--blackColor);
  min-width: 4em;
  text-align: center;
}

/* .main .packList .packRoof ul.optionalUl li {
  background: var(--primaryColor);
}

.main .packList .waterProof ul.optionalUl li {
  background: var(--primaryColor);
}

.main .packList .packOther ul.optionalUl li {
  background: var(--secondaryColor);
}

.main .packList .packWpack ul.optionalUl li,
.main .packList .packWplan ul.optionalUl li {
  background: var(--secondaryColor);
} */

.main .priceBlock {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.main .priceTxt {
  font-family: "Bahnschrift", sans-serif;
  font-weight: 700;
  font-variation-settings: "wght" 500, "wdth" 90;
  font-size: 70px;
  color: var(--whiteColor);
  letter-spacing: -0.02em;
  line-height: 0.9;
  display: flex;
  -ms-align-items: flex-end;
  align-items: flex-end;
  position: relative;
}

#menu .main .packsummary .priceTxt {
  color: var(--attentionColor);
  font-size: 100px;
}

.main .priceTxt span {
  font-size: 80px;
}

.main .priceTxt span.unitTxt {
  font-size: 23px;
  line-height: 0.9;
  font-weight: bold;
  padding-bottom: 7px;
  display: inline;
  margin-left: 5px;
}

#menu .main .packsummary .priceTxt span.unitTxt {
  font-size: 42px;
  margin-left: 10px;
}

.main .priceTxt small {
  color: var(--blackColor);
  font-size: 15px;
  display: block;
  position: absolute;
  font-weight: normal;
  right: 5px;
  top: 25px;
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", Sans-Serif;
  letter-spacing: 0;
}

.main .priceTaxin {
  margin-bottom: 0;
  color: var(--blackColor);
  font-size: 15px;
}
.main .menuMain .priceTaxin {
  text-align: right;
}

.main .packList .txts {
  font-size: 10px;
  margin-bottom: 5px;
  word-wrap: break-word;
}

.main .packList .optionTxt {
  color: var(--attentionColor);
  font-size: 23px;
  font-weight: bold;
}

.main .packList h5 {
  font-size: 16px;
  position: relative;
  padding-left: 0;
  margin: 0 0 10px;
  background: #40668c;
  border-radius: 0;
  display: block;
}

.main .packList ul li p {
  letter-spacing: -0.1em;
  margin-bottom: 10px;
}

.main .packList .catchTxt {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.2;
}

.main .packList .catchTxt br {
  display: none;
}

.main .packOther article.layout03 {
  overflow: hidden;
  width: 100%;
}

.main .packOther article.layout02 img {
  width: 100%;
  height: auto;
}

.main .packWall .noteTxt {
  font-size: 35px;
  font-weight: bold;
  text-align: center;
  color: #8f8f8f;
}

.main .packWall .packItems {
  padding: 25px 30px;
  border: 1px solid #ccc;
}

.main .packWall .packItems .packTi {
  background: none;
  box-shadow: none;
  padding: 0;
  font-size: 50px;
  color: #877608;
}

.main .packWall .packRow {
  display: flex;
  align-items: flex-end;
}

.main .packWall .packItems .packList {
  display: flex;
  margin: 0;
}

.main .packWall .packItems .packItem {
  position: relative;
  width: 320px;
  height: 190px;
  border: 4px solid #8f8f8f;
  background-color: var(--whiteColor);
  margin: 0 20px 0 0;
  padding: 0;
}

.main .packWall .packItems .packDetalis {
  position: relative;
  background-color: #8f8f8f;
  padding: 10px 10px 0 10px;
  font-size: 32px;
  color: var(--whiteColor);
  text-align: center;
}

.main .packWall .packItems .packDetalis::before {
  position: absolute;
  left: 0;
  bottom: -35px;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 35px 160px 0 160px;
  border-color: #8f8f8f transparent transparent transparent;
}

.main .packWall .packItems .packPrice {
  margin-top: 5px;
  font-size: 100px;
  font-family: "Bahnschrift", sans-serif;
  font-weight: bold;
  color: var(--attentionColor);
  letter-spacing: -0.5px;
  text-align: center;
}

.main .packWall .packItems .smallTxt {
  font-size: 80px;
}

.main .packWall .packItems .packYen {
  font-size: 42px;
  font-family: "Noto Sans JP", sans-serif;
}

.main .packWall .packItems .btn .btnWrap {
  padding: 11px 63px;
  display: inline-block;
  background: #22287f;
  border-radius: 50px;
  color: var(--whiteColor);
}

.main .packWall .packItems .btn .btnWrap::before {
  position: absolute;
  top: 12px;
  left: 40px;
  margin: auto;
  content: "＞";
  vertical-align: middle;
}

.main .packWall .attentionTxt {
  font-size: 45px;
  font-weight: bold;
  text-align: center;
  line-height: 1.1;
}

.main .packWall .attentionTxt span {
  display: inline-block;
  background: var(--primaryColor);
  color: var(--whiteColor);
  border-radius: 10px;
  line-height: 1;
  padding: 5px 10px;
  margin-right: 10px;
}

.main .packWall .attentionTxt strong {
  font-size: 65px;
  font-weight: bold;
  color: var(--attentionColor);
}

.main .packWall .packItems .note {
  padding-top: 5px;
  font-size: 12px;
  font-family: "Noto Sans JP", sans-serif;
  text-align: right;
  margin: 0;
  text-shadow: 0 0 2px var(--whiteColor), 0 0 2px var(--whiteColor), 0 0 2px var(--whiteColor), 0 0 2px var(--whiteColor),
    0 0 2px var(--whiteColor), 0 0 2px var(--whiteColor), 0 0 2px var(--whiteColor), 0 0 2px var(--whiteColor), 0 0 2px var(--whiteColor);
}

#top .main .serviceMenu {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: stretch;
  margin-bottom: 50px;
}

#top .main .serviceMenu article {
  width: 48%;
  width: calc(50% - 30px);
  margin: 0 10px 10px 0;
}

#top .main .serviceMenu article a {
  color: var(--whiteColor);
  display: block;
}

#top .main .serviceMenu .packsummary {
  width: 180px;
  padding: 30px 15px;
  box-sizing: border-box;
  display: table-cell;
  vertical-align: middle;
  margin-bottom: 0;
}

#top .main .serviceContents h3 {
  background: none;
  box-shadow: none;
  padding: 0;
  font-size: 34px;
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", Sans-Serif;
  text-align: center;
  font-weight: bold;
}

#top .main .serviceContents h3 span {
  display: block;
  font-size: 16px;
  margin-bottom: 5px;
}

#top .main .serviceContents h3 .packPlan {
  font-size: 23px;
}

#top .main .packList h4 {
  background: var(--whiteColor);
  font-size: 15px;
  text-align: center;
  padding: 5px 5px;
  display: block;
  margin-bottom: 15px;
}

#top .main .packList .catchTxt {
  display: none;
  font-size: 13px;
  font-weight: normal;
}

#top .main .packImg {
  height: 300px;
  width: 340px;
}

#top .main .packImg img {
  height: 100%;
}

#top .main .serviceMenu.packWall article {
  background: var(--attentionColor);
}

#top .main .packList .packWall h4 {
  color: var(--attentionColor);
}

#top .main .serviceMenu.packRoof article {
  background: var(--primaryColor);
}

#top .main .packList .packRoof h4 {
  color: var(--primaryColor);
}

#top .main .serviceMenu.waterProof article {
  background: var(--secondaryColor);
}

#top .main .packList .waterProof h4 {
  color: var(--secondaryColor);
}

#top .main .serviceMenu.packOther article {
  background: var(--blackColor);
}

#top .main .packList .packOther h4 {
  color: var(--blackColor);
}

#top .main .packWall .packImg,
#top .main .waterProof .packImg {
  float: right;
}

.smallWorks ul {
  display: flex;
  flex-wrap: wrap;
  border: #ccc solid 1px;
}

.smallWorks ul li {
  width: 33%;
  width: 33.33333333%;
  padding: 5px;
  box-sizing: border-box;
  margin: 0;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  background: var(--whiteColor);
}

.smallWorks ul li:nth-child(2n + 1) {
  background: rgba(255, 144, 0, 0.2);
  background: #f5f5f5;
}

.smallWorks ul li .thumbImg {
  width: 33%;
  position: relative;
  overflow: hidden;
  display: block;
}

.smallWorks ul li .thumbImg:before {
  content: "" !important;
  display: block;
  padding-top: 75%;
}

.smallWorks ul li .thumbImg img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

.smallWorks ul li .overflowH {
  width: 65%;
}

.main .serviceContents .smallWorks ul li h3 {
  background: var(--primaryColor);
  padding: 5px;
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", Sans-Serif;
  font-size: 19px;
  margin-bottom: 10px;
}

.main .serviceContents .smallWorks .priceTxt {
  font-size: 45px;
  text-align: right;
  letter-spacing: 0;
  display: block;
  margin-bottom: 0;
  position: relative;
  color: var(--attentionColor);
}

.main .serviceContents .smallWorks .unitTxt {
  font-size: 16px;
  letter-spacing: 0;
}

.main .serviceContents .smallWorks .priceTxt small {
  position: absolute;
  right: 0;
  top: 0;
  color: var(--attentionColor);
}

.main .serviceContents .smallWorks small {
  text-align: right;
  display: block;
}

.main .pickupMenu article {
  width: calc(50% - 60px);
  margin: 0 50px 50px 0;
  overflow: visible;
}

.main .pickupMenu .packImg {
  height: 360px;
}

.main .pickupMenu .packImg img {
  width: auto;
  height: 100%;
}

.main .pickupMenu .packImg span {
  right: inherit;
  left: -80px;
  top: 30px;
  bottom: inherit;
  line-height: 1.4;
}

.main .pickupMenu .packsummary {
  background: rgb(69 168 58 / 90%);
  /* display: block; */
  position: absolute;
  top: 50px;
  right: -50px;
  width: 70%;
  padding: 10px;
  text-align: center;
}

.main .pickupMenu h3 {
  background: var(--whiteColor);
  color: var(--primaryColor);
  font-size: 24px;
  padding: 5px;
  text-align: center;
  margin-bottom: 5px;
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
}

#menu .main .pickupMenu .priceTxt {
  color: #a81c17;
  text-align: right;
  justify-content: center;
}

#menu .main .pickupMenu .priceTxt span.unitTxt {
  font-size: 40px;
  margin-left: 5px;
}

.main .pickupMenu .priceTaxin {
  color: var(--whiteColor);
  margin-bottom: 10px;
}

.main .pickupMenu .catchTxt {
  background: #a81c17;
  text-align: left;
  padding: 5px;
  line-height: 1.4;
  font-weight: 500;
  font-size: 16px;
}

/*----attention-----*/
.main .bgAt {
  background: var(--blackColor) 333;
}

.main .bgAt h3 {
  font-size: 36px;
  text-align: center;

  background: none;

  border-top: none;
  padding: 0;
  margin: 0 0 20px 0;
  font-weight: normal;
  color: var(--whiteColor);
  border-image: none;
}

.main .bgAt h3 strong {
  font-weight: bold;
}

.main .bgAt h3 strong.remarkY {
  color: var(--whiteColor)c00;
}

.main .bgAt p.imgBAt {
  margin-bottom: 20px;
}

.main .bgAt p.imgBAt img {
  float: left;
  margin-right: 26px;
}

.main .bgAt p.imgBAt img:last-child {
  float: none;
  margin-right: 0;
}

.main .bgAt p.catchPAt {
  font-size: 48px;
  line-height: 1.3;
  color: var(--whiteColor);
  margin-bottom: 0;
}

.main .bgAt p.ltl {
  font-size: 26px;
  font-weight: bold;
  line-height: 1.7;
  padding-top: 20px;
}

.main .bgAt p.ltl img {
  margin-top: -20px;
}

.main .bgAt p.catchPAt strong {
  color: var(--whiteColor)c00;
}

.main .bgAt p.ltl strong {
  color: var(--whiteColor);
  text-decoration: underline;
}

.main .bgAt p.catchPAt span {
  font-size: 26px;
  display: block;
}

.main .bgAt p.catchPAt img {
  float: left;
  margin-right: 20px;
}

/*----劣化度チェック-----*/

.main .deteriorationChk {
  display: block;
  position: relative;

  /* overflow: hidden; */
  .staffImg {
    position: absolute;
    right: 0;
    bottom: 100%;
  }
}

.main .deteriorationChk h3 {
  font-size: 30px;
  padding: 0;
  border-bottom: none;
}

.main .deteriorationChk .inner {
  padding: 15px 0 0;
}

.main .deteriorationChk .checkLegend {
  float: right;
}

.main .deteriorationChk .checkLegend li {
  background: var(--secondaryColor);
  padding: 25px 20px;
  text-align: center;
  color: var(--whiteColor);
  margin: 0 0 20px;
  box-sizing: border-box;
  width: 250px;
}

.main .deteriorationChk .checkLegend li:before,
.main .deteriorationChk .checkLegend li::after {
  content: none;
}

.main .deteriorationChk .checkLegend li h4 {
  display: block;
}

.main .deteriorationChk .checkLegend li h4:before {
  content: none;
}

.main .deteriorationChk .checkLegend p {
  font-size: 13px;
  margin-bottom: 0;
}

.main .deteriorationChk .checkLegend .legendText {
  background: var(--whiteColor);
  border-radius: 5px;
  color: var(--attentionColor);
  font-size: 16px;
  margin: 5px 0 10px;
  line-height: 1.2;
}

.main .deteriorationChk .checkLegend span {
  display: block;
  position: relative;
  text-align: center;
}

.main .deteriorationChk .checkLegend span img {
  margin-top: 10px;
}

.main .deteriorationChk .checkLegend img {
  margin-top: 20px;
}

.main .deteriorationChk .checkPoint {
  width: 780px;
  float: left;
  margin-right: 30px;
  padding-right: 30px;
  border-right: var(--blackColor) solid 1px;
}

.main .deteriorationChk .checkPoint h3 {
  margin: 0;
  background: var(--blackColor);
  border: none;
  color: var(--whiteColor);
  font-size: 20px;
  padding: 5px 7px;
}

.main .deteriorationChk .checkPoint ul {
  position: relative;
  overflow: hidden;
  margin: 0;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .deteriorationChk .checkPoint ul li {
  width: 33%;
  width: calc(33% - 10px);
  background: none;
  padding: 0;
  margin-top: 30px;
}

.main .deteriorationChk .checkPoint ul li:nth-child(-n + 3) {
  margin-top: 0;
}

.main .deteriorationChk .checkPoint ul li:before,
.main .deteriorationChk .checkPoint ul li:after {
  display: none;
}

.main .deteriorationChk .checkPoint ul li:nth-child(3n) {
  margin-right: 0;
}

.main .deteriorationChk .checkPoint ul li .checkpointThumb {
  position: relative;
  font-size: 13px;
  overflow: hidden;
}

.main .deteriorationChk .checkPoint ul li .checkpointThumb span {
  width: 100%;
  position: relative;
  overflow: hidden;
  display: block;
}

.main .deteriorationChk .checkPoint ul li .checkpointThumb span:before {
  content: "" !important;
  display: block;
  padding-top: 75%;
}

.main .deteriorationChk .checkPoint ul li .checkpointThumb img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main .deteriorationChk .checkPoint ul li .checkTtl {
  position: absolute;
  bottom: 10px;
  padding: 0 30px;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}

.main .deteriorationChk .checkPoint ul li .checkTtl h4 {
  background: var(--primaryColor);
  color: var(--whiteColor);
  display: block;
  padding: 0;
  font-size: 13px;
  margin: 0;
}

.main .deteriorationChk .checkPoint ul li .checkTtl h4:before,
.main .deteriorationChk .checkPoint ul li .checkTtl h4:after {
  display: none;
}

.main .deteriorationChk .checkPoint ul li .checkTtl p {
  background: var(--whiteColor);
  border-radius: 5px;
  color: var(--attentionColor);
  font-size: 16px;
  margin-top: 5px;
  line-height: 1.2;
}

.main .deteriorationChk .checkPoint ul li p {
  font-size: 13px;
  margin-bottom: 0;
}

/* .main .checkCatch {
  margin: 0 0 -20px 0;
  text-align: center;
  font-size: 45px;
  color: #22287f;
  text-shadow: 3px 3px 0 var(--whiteColor);
  line-height: 1.3;
} */

/*----comMessage-----*/
.main .msgBox {
  position: relative;
  overflow: hidden;
}

.main .msgTxt {
  position: relative;
  overflow: hidden;
  text-align: left;
}

.main .msgTxt h3 {
  padding: 0;
  border-bottom: none;
}

.main .msgTxt h4 {
  font-size: 17px;
  border-top: none;
  background: none;
  margin: 0 0 15px;
}

.main .msgPhoto {
  width: 260px;
  float: right;
  margin: 0 0 0 30px;
  text-align: left;
}

.main .msgPhoto .ceoPict {
  width: 260px;
  height: 300px;
  overflow: hidden;
  position: relative;
  margin-bottom: 10px;
}

#contact .main .msgPhoto {
  margin: 0;
}

.main .msgPhoto .ceoPict img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  height: 100%;
}

.main .msgPhoto h5 {
  font-size: 12px;
  margin: 0 0 5px;
}

.main .msgPhoto p {
  font-size: 25px;
  font-weight: 600;
  margin-top: 0;
  line-height: 1.2;
}

.main .msgPhoto p span {
  font-size: 16px;
  margin-right: 10px;
}

.main .msgPhoto p span.en {
  font-size: 10px;
  color: var(--blackColor);
  margin-left: 5px;
}

.main .msgPhoto p.btn a {
  padding: 10px 35px 10px 20px;
}

/*----comWait-----*/

.main .comWaitBox {
  padding: 0;
  margin-bottom: 30px;
}

.main .comWaitBox a {
  text-decoration: none;
}

.main .comWaitBox h3 {
  background: #ffa800;
  text-align: center;
  font-size: 28px;
  border: none;
  color: var(--whiteColor);
  padding: 10px 0;
  margin: 0;
}

.main .comWaitBox p {
  position: relative;
  overflow: hidden;
}

.main .comWaitBox img {
  float: left;
  display: block;
}

/*----comArea-----*/

.main .comAreaBox {
  padding: 10px;
  box-sizing: border-box;
  background: var(--whiteColor);
  margin-bottom: 30px;
}

.main .comAreaBox img {
  float: left;
  margin-right: 30px;
}

.main .comAreaBox h3 {
  font-size: 23px;
  margin: 0 0 20px;
}

.main .comAreaBox h4 {
  margin: 0 0 5px;
}

.main .comAreaBox p {
  font-size: 18px;
  margin-bottom: 10px;
}

.main .comAreaBox p strong {
  color: var(--attentionColor);
}

.main .comAreaBox p.catchAra {
  font-size: 20px;
  font-weight: bold;
}

.main .comAreaBox .catchTtl {
  background: none;
  border-top: none;
  font-size: 22px;
  font-weight: bold;
  line-height: 1.5;
  margin-top: 0;
}

.main .comAreaBox .catchAra strong {
  color: var(--attentionColor);
}

.main .comAreaBox .catchAra span {
  text-decoration: underline;
}

/*----comFamily-----*/

.main .comFamilyBox {
  background: #4582e8;
  border-style: solid;
  border-width: 10px;
  border-image: url(./img/common/brown_bg.png) 10 repeat;
  position: relative;
  margin-top: 20px;
}

.main .comFamilyBox .imgLayer {
  right: 0;
  top: -20px;
}

.main .comFamilyBox p {
  color: var(--whiteColor);
  font-size: 40px;
  font-weight: bold;
  margin: 20px 20px 10px;
  line-height: 1.4;
}

.main .comFamilyBox p span.txtM {
  font-size: 30px;
}

.main .comFamilyBox p strong {
  color: #ffc501;
}

.main .comFamilyBox p span strong {
  border-radius: 4px;
  background: var(--attentionColor);
  padding: 5px;
  display: inline-block;
  color: var(--whiteColor);
  line-height: 1;
  margin-right: 5px;
}

.main .comFamilyBox p.catchTtl {
  background: #1342d3;
  display: block;
  position: relative;
  margin: 0 -10px 20px;
  font-size: 35px;
  text-align: center;
}

.main .comFamilyBox p.catchTtl:before,
.main .comFamilyBox p.catchTtl:after {
  content: "";
  position: absolute;
  top: 100%;
  border-style: solid;
  border-color: transparent;
}

.main .comFamilyBox p.catchTtl:before {
  left: 0;
  border-width: 0 10px 10px 0;
  border-right-color: #001453;
}

.main .comFamilyBox p.catchTtl:after {
  right: 0;
  border-style: solid;
  border-width: 10px 10px 0 0;
  border-top-color: #001453;
}

/*--吹き出し大テキスト--*/

.main .balloonBox {
  background: rgba(16, 95, 172,0.8);
  color: var(--whiteColor);
  position: relative;
  padding: 20px;
  box-sizing: border-box;
}

.main .balloonBox p {
  margin: 0;
  font-size: 26px;
  font-weight: bold;
  line-height: 1.3;
}

.main .balloonBox p strong {
  color: #f0d100;
}

.main .catchCBox {
  background: var(--primaryColor);
  border-radius: 10px;
  color: var(--whiteColor);
  padding: 10px;
  text-align: center;
  font-size: 45px;
  font-weight: bold;
  line-height: 1.5;
}

/*--comMember--*/
.main .comMember {
  background: -webkit-gradient(linear,
      left top,
      left bottom,
      color-stop(1, #8eafd9),
      color-stop(0.2, #6696cf));
  background: linear-gradient(to bottom, #6696cf 20%, #8eafd9 100%);
  margin-bottom: 0;
}

.main .comMember .inner {
  background: url(./img/common/comMember_bg.png) no-repeat center bottom -120px;
  min-height: 250px;
  padding: 0;
}

.main .comMember p {
  color: var(--whiteColor);
  font-size: 30px;
  font-weight: bold;
  line-height: 1.4;
  margin: 20px 0 262px 20px;
  display: block;
}

/*----comLawpriceWhy-----*/
.main .lawpriceWhy .catchTtl {
  font-size: 30px;
  line-height: 1.2;
  font-weight: bold;
  text-align: center;
}

.main .lawpriceWhy .catchTtl strong {
  color: var(--attentionColor);
}

.main .lawpriceWhy .highCost {
  background: var(--primaryColor);
  padding: 25px;
  margin-top: 25px;
}

.main .lawpriceWhy .highCost h3 {
  color: var(--whiteColor);
  font-size: 50px;
  font-weight: normal;
  padding: 0;
  background: none;
  border-top: none;
  text-align: center;
  line-height: 1.3;
  margin-top: 0;
  box-shadow: none;
  border-bottom: var(--whiteColor) solid 1px;
}

.main .lawpriceWhy .highCost h3 strong {
  font-weight: normal;
}

.main .lawpriceWhy .highCost ul {
  position: relative;
  margin-bottom: 0;
  display: flex;
  justify-content: space-between;
}

.main .lawpriceWhy .highCost ul li {
  background: #ccc;
  padding: 10px;
  width: 33%;
  width: calc(33% - 20px);
  box-sizing: border-box;
  position: relative;
}

.main .lawpriceWhy .highCost ul li:last-child {
  margin-right: 0;
}

.main .lawpriceWhy .highCost ul li:before,
.main .lawpriceWhy .highCost ul li:after {
  content: none;
}

.main .lawpriceWhy .highCost ul li img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.main .lawpriceWhy .highCost ul li h4 {
  border-radius: 50%;
  background: var(--attentionColor);
  width: 57px;
  height: 57px;
  color: var(--whiteColor);
  font-size: 13px;
  position: absolute;
  top: -10px;
  left: 3px;
  padding: 0;
  margin: 0;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

.main .lawpriceWhy .highCost ul li h4:before,
.main .lawpriceWhy .highCost ul li h4:after {
  display: none;
}

.main .lawpriceWhy .highCost ul li p {
  display: block;
  background: var(--whiteColor);
  font-weight: bold;
  font-size: 18px;
  padding: 10px;
  line-height: 1.2;
  margin-bottom: 0;
}

/*----comLawpriceReason-----*/
.main .lowpriceReason .lowcost ul {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .lowpriceReason .lowcost ul li {
  background: var(--primaryColor);
  padding: 25px;
  width: 48%;
  width: calc(50% - 20px);
  box-sizing: border-box;
  float: left;
  margin: 0 20px 20px 0;
  position: relative;
}

.main .lowpriceReason .lowcost ul li:nth-child(2n) {
  margin-right: 0;
}

.main .lowpriceReason .lowcost ul li:before,
.main .lowpriceReason .lowcost ul li:after {
  content: none;
}

.main .lowpriceReason .lowcost ul li.fullW {
  margin-right: 0;
  width: 100%;
}

.main .lowpriceReason .lowcost ul li h4 {
  background: var(--secondaryColor);
  color: var(--whiteColor);
  padding: 10px;
  font-size: 30px;
  margin: 0 0 30px;
  display: block;
}

.main .lowpriceReason .lowcost ul li.fullW h4 {
  padding: 0 25px;
}

.main .lowpriceReason .lowcost ul li h4:before {
  display: none;
}

.main .lowpriceReason .lowcost ul li h4:after {
  content: " ";
  height: 0;
  position: absolute;
  width: 0;
  border: 25px solid transparent;
  border-top: var(--secondaryColor) solid 25px;
  top: 100%;
  left: 50%;
  margin-left: -25px;
  border-radius: 0;
  background: none;
  clear: both;
  display: block;
}

.main .lowpriceReason .lowcost ul li h4 span {
  display: inline-block;
  line-height: 1.3;
  padding-top: 5px;
}

.main .lowpriceReason .lowcost ul li.fullW span {
  display: flex;
  -ms-align-items: center;
  align-items: center;
  padding: 0;
}

#reason .main .lowpriceReason .lowcost ul li.fullW span {
  padding: 0;
  display: block;
  text-align: center;
  padding: 20px 0;
}

.main .lowpriceReason .lowcost ul li h4 img {
  display: block;
  margin: 0 auto;
}

.main .lowpriceReason .lowcost ul li h4 span.reasonIco {
  background: url(./img/common/comLowprice_ico.png) no-repeat center center;
  color: var(--whiteColor);
  width: 112px;
  height: 112px;
  font-size: 23px;
  padding: 0;
  margin: -10px 10px 5px 0;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  float: left;
}

.main .lowpriceReason .lowcost ul li.fullW span.reasonIco {
  margin: 0;
}

.main .lowpriceReason .lowcost ul li h4 span strong {
  font-size: 12px;
  line-height: 1.2;
  margin-top: 5px;
  padding: 0 5px;
}

.main .lowpriceReason .lowcost ul li p {
  font-size: 30px;
  color: var(--whiteColor);
  line-height: 1.2;
  font-weight: bold;
  margin-bottom: 0;
}

.main .lowpriceReason .lowcost ul li .compareBox {
  background: var(--whiteColor);
  padding: 30px 25px;
}

.main .lowpriceReason .lowcost ul li .compareBox h6:first-child {
  margin-top: 0;
}

.main .lowpriceReason .lowcost ul li .compareBox hr {
  border-top: var(--blackColor) dotted 1px;
  display: block;
  margin-top: 25px;
}

.main .lowpriceReason .lowcost ul li .compareBox img {
  display: block;
  margin: 0 auto;
}

/*----comQuality-----*/

.main .qualityBox .catchTtl {
  position: relative;
  font-size: 45px;
  font-weight: bold;
  text-align: left;
  line-height: 1.1;

  margin-top: 0;
  margin-bottom: 30px;
}

.main .qualityBox .inner {
  padding-top: 40px;
}

.main .qualityBox .catchTtl img.catchIco {
  float: left;
  margin-top: -35px;
}

.main .qualityBox .catchTtl .txtL {
  font-size: 120px;
  line-height: 1.2;
  clear: both;
  color: var(--primaryColor);
  letter-spacing: -0.05em;
}

.main .qualityBox .catchTtl .imgLayer {
  right: 0;
  top: -80px;
}

.main .qualityBox .catchTtl small {
  display: block;
  font-size: 24px;
  background: var(--primaryColor);
  padding: 5px;
  text-align: center;
  color: var(--whiteColor);
}

.main .qualityBox h3 strong {
  color: var(--attentionColor);
}

.main .qualityBox .catchTxt {
  font-size: 23px;
}

.main .qualityBox .photoUL li strong {
  display: block;
  text-align: center;
}

.main .qualityBoxWrap {
  position: relative;
  overflow: hidden;
}

.main .qualityBoxWrap p,
.main .qualityBoxWrap li {
  font-size: 18px;
}

.main .qualityBoxText h3 {
  margin-top: 0;
}

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

.main .commitFlow {
  position: relative;
  overflow: hidden;
}

.main .commitFlow li {
  background: none;
  width: 369px;
  margin: 0;
  float: left;
  padding: 0;
}

.main .commitFlow li:before,
.main .commitFlow li:after {
  content: none;
}

.main .commitFlow li h4 {
  border-radius: 5px;
  background: var(--blackColor);
  text-align: center;
  color: var(--whiteColor);
  padding: 0;
  margin-bottom: 10px;
}

.main .commitFlow li h4:before,
.main .commitFlow li h4:after {
  display: none;
}

.main .commitFlow li:nth-child(2) {
  width: 229px;
  margin: 0 84px 0 12px;
  position: relative;
}

.main .commitFlow li:nth-child(3) {
  width: 305px;
}

.main .commitFlow li:nth-child(2):before,
.main .commitFlow li:nth-child(2):after,
.main .commitFlow li:nth-child(3):before {
  position: absolute;
  z-index: 10;
}

.main .commitFlow li:nth-child(2):before,
.main .commitFlow li:nth-child(3):before {
  content: " ";
  height: 0;
  width: 0;
  border: 55px solid transparent;
  border-left: #bb0000 solid 48px;
  left: 125%;
  top: 50%;
  margin-top: -25px;
  background: none;
}

.main .commitFlow li:nth-child(3):before {
  border-left: var(--whiteColor) solid 48px;
  left: -8%;
  z-index: 8;
}

.main .commitFlow li:nth-child(2):after {
  background: var(--attentionColor);
  content: "クリア";
  color: var(--whiteColor);
  font-size: 20px;
  font-weight: bold;
  left: 95%;
  top: 50%;
  width: 80px;
  padding: 15px 0;
  text-align: right;
  transform: none;
  height: auto;
  border: none;
  border-left: var(--whiteColor) solid 2px;
}

.main .commitPoint {
  position: relative;
  margin-bottom: 30px;
}

.main .commitPoint .imgLayer {
  top: 63px;
  left: 56%;
}

/*--comFlowWall--*/

.main .flowListP {
  position: relative;
  clear: both;
}

.main .flowListP .pointB {
  position: absolute;
  color: var(--whiteColor);
  box-sizing: border-box;
  font-weight: bold;
  background: #ff6600;
  right: 18px;
  top: -115px;
  border-radius: 50%;
  height: 110px;
  width: 110px;
  text-align: center;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

.main .flowListP .pointB::after {
  content: "";
  position: absolute;
  margin: 0;
  bottom: -25px;
  right: 20px;
  width: 0;
  height: 0;
  border-top: 40px solid #ff6600;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  transform: rotate(-30deg);
}

.main .flowList {
  background: var(--primaryColor);
  padding: 10px;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: space-between;
  clear: both;
}

.main .flowList h3 {
  color: var(--whiteColor);
  font-size: 28px;
  float: left;
  background: none;
  border: none;
  padding: 0 12px;
  line-height: 1.2;
  margin: 0;
  box-shadow: none;
  min-width: 200px;
}

.main .flowList ul {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: space-between;
}

.main .flowList ul li {
  border-radius: 10px;
  background: var(--whiteColor);
  font-size: 21px;
  color: var(--primaryColor);
  font-weight: bold;
  padding: 0;
  text-align: center;
  margin: 0 5px 0 0;
  width: 77px;
  height: 74px;
  line-height: 1.2;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.main .flowList ul.wpurethan li,
.main .flowList ul.wpvinylchloride li {
  width: 87px;
}

.main .flowList ul li:before,
.main .flowList ul li:after {
  content: none;
}

.main .commitPoint ul .flowCatch {
  background: var(--attentionColor);
  color: var(--whiteColor);
}

.main .flowList ul li.stxt {
  font-size: 16px;
}

.main .flowList ul li:last-child {
  margin-right: 0;
}

.main .flowList.flowRoof ul li {
  width: 110px;
}

.main .textComS {
  font-size: 13px;
}

/*--comCorpSelect--*/

.main .selectPoint li {
  padding: 0;
  position: relative;
  overflow: hidden;
  background: none;
}

.main .selectPoint li .pointIco {
  margin-right: 10px;
}

.main .selectPoint li .pointSummery {
  position: relative;
  overflow: hidden;
}

.main .selectPoint li .pointSummery h3 {
  margin-top: 0;
  background: none;
  border: none;
  font-size: 30px;
}

.main .selectPoint li .pointSummery ul {
  margin: 0;
}

.main .selectPoint li .pointSummery li {
  font-size: 25px;
  padding: 0 0 0 25px;
  position: relative;
  background: url(./img/common/arrow01.png) no-repeat 0 5px;
  margin-top: 0;
}

.main .selectPoint li .pointSummery li strong {
  font-weight: normal;
  background: #ffc501;
  line-height: 0.6;
  display: inline-block;
}

/*--comComparePaint--*/

.main .comparePaint {
  padding: 0;
}

.main .compareTable {
  width: 100%;
  table-layout: fixed;
}

.main .compareTable th,
.main .compareTable td {
  vertical-align: top;
  text-align: center;
  width: auto;
  padding: 10px;
}

.main .compareTable th {
  font-weight: bold;
  padding: 10px;
  vertical-align: middle;
  background: var(--primaryColor);
  color: var(--whiteColor);
}

.main .compareTable th:first-of-type {
  width: 12%;
}

.main .compareTable th:last-of-type {
  width: 37%;
}

.main .compareTable tr.thinking td {
  text-align: left;
  font-weight: normal;
  font-size: 15px;
}

.main .compareTable td {
  font-weight: normal;
  font-size: 13px;
  text-align: left;
}

.main .compareTable td span {
  font-size: 30px;
  float: left;
  width: 35px;
  display: block;
  border-right: #ccc solid 1px;
  margin-right: 15px;
  padding-right: 15px;
  text-align: center;
  box-shadow: 2px 0px 0px 0px var(--whiteColor);
  font-weight: bold;
  line-height: 1.3;
}

.main .compareTable td span.goodS {
  color: #e01c1c;
  font-size: 35px;
}

/*----comScore-----*/
/*現在使用していない？ */
.main .scoreBox .catchTtl {
  font-size: 40px;
  text-align: left;
  position: relative;
  font-weight: bold;
  line-height: 1.3;
  margin-bottom: 30px;
}

.main .scoreBox .catchTtl span {
  display: block;
  font-size: 78px;
}

.main .scoreBox .catchTtl strong {
  color: var(--attentionColor);
}

.main .scoreBox .catchTtl img {
  float: right;
  margin-top: -30px;
}

.main .scoreBox .scoreList {
  position: relative;
  overflow: hidden;
}

.main .scoreBox .scoreList li {
  background: var(--blackColor);
  color: var(--whiteColor);
  position: relative;
  width: 487px;
  float: left;
  padding: 0;
}

.main .scoreBox .scoreList li {
  margin-right: 25px;
}

.main .scoreBox .scoreList li:nth-child(2n) {
  margin-right: 0;
}

.main .scoreBox .scoreList li p {
  padding: 10px 20px;
  height: 60px;
  font-weight: bold;
  font-size: 24px;
  margin: 0;
  line-height: 1.2;
}

/*--comEnquete--*/
.main .enqueteBox .catchTtl {
  position: relative;
  font-size: 38px;
  font-weight: bold;
  margin-top: 0;
  text-align: left;
  line-height: 1.4;
}

.main .enqueteBox .catchTtl .txtL {
  font-size: 70px;
  line-height: 1.2;
}

.main .enqueteBox .catchTtl strong {
  color: var(--attentionColor);
}

.main .enqueteBox p {
  font-size: 20px;
}

.main .enqueteBox ul li a {
  text-decoration: none;
  color: var(--blackColor);
}

.main .enqueteBox ul li img {
  box-sizing: border-box;
  border: #ccc solid 1px;
  height: 100%;
  width: auto;
}

.main .enqueteBox ul li h3 {
  background: none;
  border: 0;
  margin: 5px 0 0;
  padding: 0;
  color: #036936;
  font-size: 15px;
  line-height: 1.4;
}

.main .enqueteBox ul li .contTxt {
  font-weight: bold;
  display: block;
}

.main .enqueteBox .balloonBox p {
  font-size: 30px;
  text-align: center;
}

/*--comIdeal--*/
.main .iDeal .inner {
  padding-bottom: 0;
}

.main .iDeal article {
  padding-bottom: 0;
}

.main .iDeal .catchTtl {
  font-size: 50px;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 30px;
}

.main .iDeal .catchTtl strong {
  color: var(--attentionColor);
}

/*---comIdea---*/

.main .comIdea {
  margin-bottom: 29px;
}

.main .comIdea .ttl {
  margin-bottom: 3px;
}

.main .comIdea ul {
  display: flex;
  justify-content: space-between;
}

#harikae .main .comIdea ul,
#menu .main .comIdea ul,
#apartment .main .comIdea ul {
  justify-content: space-around;
  padding: 0 90px;
}

.main .comIdea ul:after {
  content: none;
}

.main .comIdea li {
  padding-left: 0;
  float: none;
  width: 182px;
  box-sizing: border-box;
}

.main .comIdea li:before,
.main .comIdea li:after {
  content: none;
}

.main .comIdea li img {
  display: block;
  margin: 0 auto;
}

.main .comIdea li span {
  font-size: 18px;
  padding: 10px 10px;
  position: relative;
  color: var(--whiteColor);
  font-weight: bold;
  line-height: 1.4;
  text-align: left;
  /* border-radius: 6px; */
  background: var(--primaryColor);
  display: block;
  margin-bottom: 30px;
}

.main .comIdea li span:after {
  content: "";
  height: 0;
  position: absolute;
  width: 0;
  border: 10px solid transparent;
  border-top-color: var(--primaryColor);
  top: 100%;
  left: 0;
  right: 0;
  margin: auto;
}

.main .comIdea li:first-child {
  padding-left: 0;
}

/*--ショールーム特徴--*/

.main .showroomFeature p {
  margin-bottom: 0;
}

.main .featureBox {
  position: relative;
  overflow: hidden;
  background: var(--blackColor);
  margin: 30px 0;
}

.main .featureBox p {
  margin-top: 0;
}

.main .featureBox ul {
  padding: 10px;
  float: right;
  width: 400px;
  box-sizing: border-box;
  margin-bottom: 0;
  display: block;
}

.main .featureBox ul li {
  background: var(--whiteColor);
  font-size: 16px;
  padding: 10px;
  position: relative;
  overflow: hidden;
  margin-top: 10px;
  line-height: 1.6;
}

.main .featureBox ul li:before,
.main .featureBox ul li:after {
  content: none;
}

.main .featureBox ul li:first-child {
  margin-top: 0;
}

.main .featureBox ul li p {
  font-size: 16px;
  line-height: 1.8;
}

.main .featureBox ul li h4 {
  color: var(--whiteColor);
  font-size: 25px;
  display: table-cell;
  padding: 26px 0;
  height: 100%;
  width: 3em;
  text-align: center;
  vertical-align: middle;
  float: left;
  margin: 0 20px 0 0;
  line-height: 1;
  z-index: 1;
  text-shadow: 1px 3px 0px var(--primaryColor);
}

.main .featureBox ul li h4:before,
.main .featureBox ul li h4:after {
  content: none;
}

.main .featureBox ul li h4:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 100px 100px 0 0;
  border-color: var(--primaryColor) transparent transparent transparent;
  transform: none;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  top: -10px;
  left: -10px;
  position: absolute;
  z-index: -1;
}

.main ul.featureImg li {
  float: left;
  margin-bottom: 30px;
  padding: 0;
  width: 480px;
  height: 303px;
  position: relative;
  overflow: hidden;
}

.main ul.featureImg li:last-child {
  float: right;
}

.main ul.featureImg li:before,
.main ul.featureImg li:after {
  display: none;
}

.main ul.featureImg li img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

.main .featureContents ol {
  counter-reset: feature;
  padding: 0;
  margin: 0;
}

.main .featureContents ol>li {
  counter-increment: feature;
  position: relative;
  margin-bottom: 20px;
}

.main .featureContents ol>li .imgLayer {
  bottom: 0;
  right: 0;
}

.main .featureContents li {
  list-style: none;
  padding: 0;
}

.main .featureContents h3 {
  display: flex;
  align-items: center;
  color: var(--blackColor);
  font-size: 52px;
  line-height: 1.2;
  background: none;
  position: relative;
  overflow: hidden;
  padding: 0;
  padding: 15px 0;
  border: none;
  margin-bottom: 0;
}

.main .featureContents h3 span {
  display: inline-block;
  width: calc(100% - 155px);
  margin-left: 20px;
}

#contact .main .featureContents h3 {
  position: relative;
  margin-bottom: 30px;
  font-size: 48px;
  background: none;
  border: none;
  padding: 0;
  line-height: 1.2;
}

#contact .main .featureContents ol>li {
  margin-bottom: 30px;
}

.main .featureContents ol>li:last-of-type {
  margin-bottom: 0;
}

#contact .main .featureContents .photoUL li {
  margin: 0 10px 0 0;
}

#contact .main .featureContents .photoUL img {
  margin-bottom: 0;
}

.main .featureContents h3:before {
  background: var(--primaryColor);
  border: rgba(255, 255, 255, 0.5) solid 7px;
  border-radius: 50%;
  color: var(--whiteColor);
  content: "ココが違う\A" counter(feature, decimal-leading-zero);
  white-space: pre;
  width: 135px;
  height: 135px;
  font-size: 20px;
  text-align: center;
  line-height: 1.2;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.main .featureContents h3 img {
  position: absolute;
  top: 0;
  right: 0;
}

.main .featureContents .photoUL {
  justify-content: flex-start;
}

.main .featureContents .photoUL li {
  margin: 0 20px 0 0;
  flex-grow: inherit;
}

#contact .main .featureContents .featureAnser {
  position: relative;
  margin: 0;
  z-index: 1;
  padding-top: 90px;
  font-size: 48px;
}

#contact .main .featureContents .featureAnser::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 60px 130px 0 130px;
  border-color: #bb0000 transparent transparent transparent;
  transform: translateX(-50%);
}

.main .featureContents .photoUL li:nth-child(3n) {
  margin-right: 0;
}

/*--トップスライド--*/

a.leftNav,
a.rightNav {
  background: url(./img/common/bg2.png);
  outline: none;
  transition: none;
}

.leftNav:before,
.rightNav:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  transition: none;
}

.leftNav:hover {
  background: url(./img/common/leftNav.png) right center no-repeat;
  transition: none;
  opacity: 1;
}

.rightNav:hover {
  background: url(./img/common/rightNav.png) left center no-repeat;
  transition: none;
  opacity: 1;
}

.leftNav:hover:before,
.rightNav:hover:before {
  background: url(./img/common/bg2.png);
  transition: none;
}

/*--下層ページメインビジュアル--*/

.pageTitle {
  position: relative;
  overflow: hidden;
  background: #ccc;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 260px;
  background-size: cover !important;
}

.pageTitle .inner {
  width: 100%;
  height: 100%;
  padding: 120px 0 0 0;
}

.pageTitle h1 {
  color: var(--whiteColor);
  line-height: 1;
  box-shadow: none;
  border: none;
  margin: 0 auto;
  font-size: 60px;
  text-shadow: 2px 2px 2px var(--blackColor);
  width: 1100px;
  position: relative;
  text-align: center;
}

.pageTitle h1 span,
.pageTitle h1 small {
  display: block;
  margin: 0 auto;
  position: relative;
  z-index: 10;
}

.pageTitle h1 small {
  font-size: 30px;
}

.pageTitle h1 span {
  background: var(--primaryColor);
  margin-top: 10px;
  padding: 5px 20px;
  font-size: 18px;
  display: table;
  line-height: 1.2;
  text-shadow: none;
  font-weight: normal;
}

.pageTitle h1 img {
  position: absolute;
  bottom: 0;
  right: calc(50% - 570px);
}

/*--ぱんくず--*/

#pagePath {
  background: var(--primaryColor);
  padding: 5px 0;
}

#pagePath p {
  width: 1000px;
  margin: 0 auto;
  color: var(--whiteColor);
  font-size: 11px;
}

#pagePath p a {
  color: var(--whiteColor);
}

/*--フォーム--*/

.main .formD h3 {
  background: #22287f;
  border-top: none;
  color: var(--whiteColor);
  margin: 0;
}

.main .formD ul li:before,
.main .formD ul li:after {
  content: none;
}

.main #form {
  padding: 30px 0 30px;
}

.main #form h3 {
  background: none;
  font-size: 40px;
  color: #22287f;
  border: none;
  padding: 0;
  margin: 0 0 20px 0;
  text-align: center;
  box-shadow: none;
}

.main #form ul li {
  background: none;
  padding: 0;
}

.main #form ul li:before,
.main #form ul li:after {
  content: none;
}

.main #form ul.formStep {
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}

.main #form ul.formStep li {
  background: #b3a481;
  color: var(--whiteColor);
  font-size: 17px;
  font-weight: bold;
  margin: 5px 0;
  position: relative;
  width: 243px;
  float: left;
  height: 50px;
  padding: 0 10px 0 80px;
  display: flex;
  align-items: center;
}

.main #form ul.formStep li:before,
.main #form ul.formStep li:after {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 25px 0 25px 10px;
  border-color: transparent transparent transparent #b3a481;
  content: "";
  display: block;
  position: absolute;
}

.main #form ul.formStep li:before {
  left: 100%;
  top: 0;
  z-index: 10;
  background: none;
}

.main #form ul.formStep li:after {
  border-width: 26px 0 26px 12px;
  border-color: transparent transparent transparent var(--whiteColor);
  left: 100.5%;
  top: 0;
  z-index: 9;
  transform: none;
}

.main #form ul.formStep li:last-child:before,
.main #form ul.formStep li:last-child:after {
  display: none;
}

.main #form ul.formStep li.on {
  background: #ff6600;
  color: var(--whiteColor);
}

.main #form ul.formStep li.on:before {
  border-color: transparent transparent transparent #ff6600;
}

.main #form ul.formStep li span {
  border-radius: 50%;
  background: var(--primaryColor);
  width: 57px;
  height: 57px;
  color: var(--whiteColor);
  font-size: 13px;
  line-height: 1.2;
  position: absolute;
  top: -3px;
  left: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.main #form ul.formStep li:first-child span {
  left: 2px;
}

.main .formBox table {
  margin-bottom: 20px;
}

.main .formBox th {
  padding: 20px 15px;
  font-weight: bold;
  vertical-align: middle;
  width: 30%;
  font-size: 16px;
  color: var(--whiteColor);
  box-sizing: border-box;
}

.main .formBox th span {
  background: var(--attentionColor);
  color: var(--whiteColor);
  font-size: 14px;
  float: right;
  padding: 2px 15px;
}

.main .formBox th span.any {
  background: #b0b0b0;
}

.main .formBox td {
  padding: 10px;
  font-weight: bold;
  vertical-align: middle;
  font-size: 13px;
  background: var(--whiteColor);
  box-sizing: border-box;
}

.main .formBox td .wpcf7c-elm-step1 {
  font-size: 13px;
}

.main .formBox td span {
  display: inline-block;
  font-size: 16px;
  width: 100%;
  box-sizing: border-box;
}

.main .formBox td span label {
  display: flex;
  align-items: center;
  padding-right: 25px;
}

.main .formBox td a {
  background: url(./img/common/arrow01.png) no-repeat 0 5px;
  color: var(--blackColor);
  font-size: 16px;
  padding-left: 25px;
  float: none;
  position: inherit;
  top: inherit;
  right: inherit;
}

.main .formBox td input[type="text"],
.main .formBox td input[type="tel"],
.main .formBox td input[type="email"] {
  border: 1px solid #ccc;
  width: 100%;
  background: #f5f5f5;
  padding: 5px 5px;
  height: auto;
  font-size: 16px;
  box-sizing: border-box;
}

.main .formBox td textarea {
  padding: 5px;
  width: 100%;
  height: 100px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  overflow: auto;
  background: #f5f5f5;
  font-size: 15px;
}

.main .formBox td select,
.main .formBox td input[type="date"],
.main .formBox td input#yourDate {
  width: auto;
  font-size: 15px;
  padding: 2px;
  height: 36px;
  line-height: 30px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  margin-right: 10px;
  background: #f5f5f5;
}

.main .formBox td>.event-time+span {
  display: block;
}

.main .formBox td input[type="date"],
.main .formBox td input#yourDate {
  width: 360px;
}

.main .formBox td input[type="checkbox"] {
  width: 20px;
  height: 20px;
}

.main .formBox td span.wpcf7-list-item-label {
  margin-left: 5px;
}

.main .formBox td span.your-date,
.main .formBox td span.your-time {
  width: auto;
}

.main .formBox .submit {
  text-align: center;
}

.main .formBox .submit li {
  margin: 0 5px;
  display: inline;
}

.main .formBox .submit input {
  font-size: 20px;
  background: var(--whiteColor);
  border: var(--blackColor) solid 1px;
  margin: 0 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: auto;
  padding: 15px 100px;
  font-weight: bold;
}

.main .formBox .submit input:hover {
  opacity: 0.8;
}

.main .formBox .submit input[type="button"] {
  margin-right: 10px;
}

.main .formBox td input.wpcf7c-conf,
.main .formBox td select.wpcf7c-conf,
.main .formBox td textarea.wpcf7c-conf {
  border: none;
  background: #efefef;
}

.main .formBox td select.wpcf7c-conf {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  text-indent: 0.01px;
  text-overflow: "";
}

.main .formBox td select.wpcf7c-conf::-ms-expand {
  display: none;
}

.main .formBox td input.wpcf7c-conf:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #efefef inset;
}

.main .wpcf7-form li {
  padding-left: 0;
}

.main .wpcf7-form li::before,
.main .wpcf7-form li::after {
  display: none;
}

/*--メインカラム--*/

.contents {
  padding: 0 auto 0;
}

.contents section {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

/*--ブログ形式ページ--*/

.main .taxList li,
.main .areaList li {
  display: inline-block;
  padding: 0;
  background: none;
  margin: 0;
}

.main .taxList li:before,
.main .areaList li:before,
.main .taxList li:after,
.main .areaList li:after {
  content: none;
}

.main .cat a,
.main .taxList li a,
.main .areaList li a {
  display: inline-block;
  background: var(--attentionColor);
  border: var(--attentionColor) solid 1px;
  color: var(--whiteColor);
  font-weight: bold;
  margin: 0 4px 4px 0;
  text-decoration: none;
  padding: 0 5px;
  border-radius: 3px;
  position: inherit;
}

.main table .cat a:hover {
  color: var(--attentionColor);
  background: var(--whiteColor);
  transition: ease 0.4s;
}

.main .areaList li a {
  background-color: var(--primaryColor);
  border: solid 1px var(--primaryColor);
}

.main .taxList li.current-cat a {
  background-color: var(--whiteColor);
  color: var(--attentionColor);
  border: solid 1px var(--attentionColor);
}

.main .areaList li.current-cat a {
  background-color: var(--whiteColor);
  color: var(--primaryColor);
  border: solid 1px var(--primaryColor);
}

.main .infoBox {
  padding: 8px 0;
  border-bottom: dotted 1px var(--blackColor);
  overflow: hidden;
  margin-bottom: 30px;
}

.main .infoBox .time {
  float: right;
  font-weight: bold;
}

.main .cnrBtn {
  position: absolute;
  right: 0;
  top: 50px;
}

.main .archiveList {
  overflow: hidden;
  position: relative;
  display: flex;
  /* justify-content: space-between; */
  flex-wrap: wrap;
}

.main .archiveList article {
  width: 33%;
  width: calc(33% - 30px);
  margin: 0 30px 40px 0;
  position: relative;
  padding: 0;
}

.main .archiveList article:nth-child(3n) {
  margin-right: 0;
}

/* #top .main .archiveList article{
  margin: 0;
} */

#top .cvTop {}

#top .cvTopInner {
  display: flex;
  justify-content: space-between;
  width: 1100px;
  margin: 0 auto;
  padding-top: 40px;
}

#top .cvTopL {
  width: 660px;
}

#top .cvTopL h3 {
  margin-bottom: 20px;
  padding: 0;
  border-bottom: 0;
}

#top .cvTopR {
  width: 440px;
}

#top .topFormBox .formBox {
  border-radius: 6px;
  border: 1px solid var(--attentionColor);
}

#top .topFormBox h3 {
  margin-bottom: 15px;
  border-radius: 6px 6px 0 0;
  box-shadow: 0 3px 0 rgba(0, 0, 0, .1);
  background-color: var(--attentionColor);
  border-bottom: none;
  color: var(--whiteColor);
  text-align: center;
  font-size: 24px;
}

#top .topFormBox h3 span {
  font-size: 32px;
  font-weight: bold;
  color: #fae948;
}

#top .topFormBox table {
  margin-bottom: 15px;
}

#top .topFormBox tr {
  display: flex;
  justify-content: space-between;
}

#top .topFormBox th,
#top .topFormBox td {
  display: inline-block;
  background-color: transparent;
  width: inherit;
  box-sizing: border-box;
  border-left: none;
}

#top .topFormBox th {
  width: 130px;
  padding: 14px 5px 10px 10px;
  font-weight: bold;
  vertical-align: middle;
  font-size: 18px;
  text-align: right;
  color: var(--blackColor);
  letter-spacing: -0.05rem;
}

#top .topFormBox th.required {
  color: var(--attentionColor);
}

#top .topFormBox th span {
  border-radius: 6px;
  background: var(--attentionColor);
  color: var(--whiteColor);
  font-size: 12px;
  float: none;
  margin-left: 5px;
  padding: 2px 5px;
}

#top .topFormBox td {
  width: calc(100% - 130px);
  padding: 10px 10px 10px 5px;
  font-weight: bold;
  vertical-align: middle;
  font-size: 18px;
  letter-spacing: -0.05rem;
}

#top .topFormBox td input[type="text"],
#top .topFormBox td input[type="tel"],
#top .topFormBox td input[type="email"] {
  border-radius: 6px;
  padding: 10px;
}

#top .topFormBox td span {
  font-size: 14px;
}

#top .topFormBox .submit {
  padding: 0 10px;
}

#top .topFormBox .submit input {
  overflow: hidden;
  background: url(./img/common/form_btn.png) 0 0/420px auto no-repeat;
  width: 420px;
  height: 0;
  margin: 0;
  padding: 91px 0 0 0;
  border: none;
}

#top .topFormBox .topFormLead {
  margin: -20px 0 20px 0;
  padding: 0 10px;
  font-size: 13px;
  text-align: center;
}


#top .reasons {
  padding-bottom: 0;
}

#top .reasonTop {
  padding-bottom: 0;
}

#top .reasonTop .inner {
  padding: 0 0 40px;
}

.main .archiveList a {
  text-decoration: none;
}

.main .archiveList a:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.main .archiveList h3,
.main .archiveList .contTxt,
.main .archiveList .price {
  display: block;
  border: none;
  background: none;
  line-height: 1.4;
  padding: 0;
}

.main .archiveList h3 {
  margin: 10px 0 0 0;
  color: var(--blackColor);
  margin: 5px 0 10px;
  box-shadow: none;
  font-family: "Noto Sans JP", "メイリオ", "Meiryo", verdana,
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", Sans-Serif;
  font-size: 20px;
  height: 3em;
}

.main .archiveList .contTxt,
.main .archiveList .price {
  color: #aaa;
  font-size: 12px;
  margin: 0 0 5px 0;
}

.main .archiveList .contTxt {
  height: 3em;
}

.main .archiveList article>a {
  display: block;
  text-decoration: none;
}

#column .main .archiveList .cat {
  top: 10px;
  right: 10px;
  left: inherit;
}

#column .main .archiveList .cat a {
  color: var(--whiteColor);
  font-size: 12px;
}

.main .archiveList .archiveTumb {
  width: 100%;
  height: 226px;
  position: relative;
  overflow: hidden;
  display: block;
  background: var(--whiteColor);
  box-sizing: border-box;
}

.main .archiveList img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main .archiveList .contTxt img {
  display: none !important;
}

.main .archiveList .price {
  font-weight: bold;
  color: rgba(255, 144, 0, 0.8);
}

.main .archiveList .price li {
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.4;
}

.main .archiveList .price li span {
  display: inline-block;
  background: var(--attentionColor);
  color: var(--whiteColor);
  font-size: 12px;
  border-radius: 3px;
  padding: 1px 5px 0 5px;
  margin-right: 8px;
}

.main .archiveList .price li:before,
.main .archiveList .price li:after {
  content: none;
}

.main .archiveList .time {
  margin: 5px 0 0 0;
  line-height: 1.4;
  font-size: 14px;
  display: block;
  font-weight: 700;
  color: var(--primaryColor);
}


#voice .main .archiveList .time {
  color: var(--primaryColor);
}

.main .archiveList .detail {
  color: var(--whiteColor);
  font-size: 12px;
  font-weight: bold;
  background: #22287f;

  box-shadow: 0px -2px 0px 0px #65ad72;
  border-radius: 4px;
  padding: 0 6px;
  width: 110px;
  margin: 10px auto 0;
  display: block;
  text-align: center;
  transition: 0.7s;
}

.main .archiveList .cat {
  position: absolute;
  top: 233px;
  left: 10px;
  font-size: 13px;
  line-height: 1.4;
  height: 24px;
  overflow: hidden;
}

.main .archiveList .cat a {
  position: relative;
}

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

/*--施工事例・お客様の声--*/

.main .cstColorphoto li {
  position: relative;
}

.main .cstColorphoto .medal {
  position: absolute;
  right: 0;
  top: 95px;
}

.main .cstColorphoto .medal {
  position: absolute;
  right: 0;
  top: 95px;
}

.main .picBox {
  overflow: hidden;
  margin-bottom: 30px;
  position: relative;
}

.main .picBox .photo {
  float: right;
  width: 686px;
  height: 456px;
  position: relative;
  overflow: hidden;
}

.main .picBox .btmPhoto {
  float: left;
  width: 287px;
  height: 207px;
  position: relative;
  overflow: hidden;
  background-color: #f5f5f5;
}

.main .picBox .photo img,
.main .picBox .btmPhoto img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

.main .picBox .arrowImg {
  margin: 10px 0 0;
  float: right;
}

.main .picBox02 {
  margin-top: 40px;
}

.main .picBox02 .photo {
  float: right;
  width: 686px;
  position: relative;
}

.main .picBox02 .btmPhoto {
  float: left;
  width: 287px;
  position: relative;
}

.main .picBox02 .arrowImg {
  margin: 15px 0 0 100px;
}

.main .picBox span.after,
.main .picBox span.before {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--primaryColor);
  display: inline-block;
  z-index: 10;
  font-size: 15px;
  font-weight: bold;
  color: var(--whiteColor);
  border-radius: 4px;
  padding: 3px 10px 2px 10px;
}

.main .picBox span span {
  opacity: 0.5;
  margin-left: 5px;
}

.main .otherPhotoTtl {
  font-size: 26px;
  padding: 0;
  margin-bottom: 30px;
  color: var(--blackColor);
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  padding: 5px 0;
  border-bottom: var(--blackColor) solid 1px;
}

.main .otherPhotoTtl::before {
  content: none;
}

.main .voiceSummary {
  position: relative;
  overflow: hidden;
}

.main .voicephotList {
  float: left;
  width: 316px;
  margin-right: 30px;
}

.main .voicephotList li {
  background: none;
  padding: 0;
  position: relative;
  margin: 0 0 20px;
  border: #ccc solid 1px;
  box-sizing: border-box;
  width: 316px;
  height: 206px;
  overflow: hidden;
}

.main .voicephotList li:before,
.main .voicephotList li:after {
  content: none;
}

.main .voicephotList li img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

.main .voicephotList li .imgLayer,
.main .voiceSummary .enqImg .imgLayer {
  position: absolute;
  bottom: 5px;
  right: 5px;
  transform: none;
  top: inherit;
  left: inherit;
  width: auto;
  height: auto;
}

.main .voiceSummary .enqImg .imgLayer {
  right: inherit;
}

.main .voiceSummary .enqImg {
  width: auto;
  height: 500px;
  text-align: center;
}

.main .voiceSummary .enqImg a>img {
  height: 100%;
  width: auto;
}

.main .voiceData table {
  margin-bottom: 30px;
}


/* single-works.php私が担当しました！ */
#works .main .singleWorks {
  padding-bottom: 0;
}

#works .main .staffProf {
  margin-bottom: 30px;
  padding: 20px;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

#works .main .staffProf {
  border: solid 10px #eee;
}

#works .main .staffProf h3 {
  margin: 0 0 15px 0;
}

#works .main .profileWrap {
  overflow: hidden;
  margin-bottom: 20px;
}

#works .main .mainDetalis {
  float: left;
  width: calc(1040px - 257px);
}

#works .main .staffProf .profileDetail {
  overflow: hidden;
}

#works .main .staffProf .profileDetail .positionTxt {
  margin-bottom: 5px;
  font-size: 12px;
}

#works .main .staffProf .profileDetail .positionTxt span {
  font-size: 12px;
  font-weight: bold;
  display: inline-block;
  text-align: center;
  padding: 2px 5px;
  line-height: 1.2;
  margin-right: 5px;
  color: var(--whiteColor);
  background: var(--primaryColor);
}

#works .main .staffProf .profileDetail .staffName {
  color: var(--blackColor);
  font-size: 20px;
  line-height: 1.3;
  font-weight: bold;
  margin-bottom: 0;
}

#works .main .staffProf .profileDetail .staffName span {
  display: inline-block;
  margin-left: 10px;
  color: var(--primaryColor);
  font-size: 12px;
  font-family: "Bahnschrift", sans-serif;
  font-weight: bold;
}

#works .main .staffProf .profileDetail .mainpic {
  width: 227px;
  height: 268px;
  position: relative;
  overflow: hidden;
  float: left;
  margin-right: 30px;
}

#works .main .staffProf .profileDetail .mainpic img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

#works .main .staffProf .staffTxt {
  margin: 15px 0 0 0;
  font-size: 16px;
}

#works .main .staffProf .staffTxt br+br {
  display: none;
}

#works .main .staffProf .fbtn {
  text-align: center;
  margin-bottom: 0;
}

#works .main .staffProf .btn {
  padding: 3px 6px;
  background: var(--primaryColor);
  box-shadow: 0px 2px 0px 0px rgba(255, 255, 255, 0.4) inset;
  clear: both;
  position: relative;
  font-weight: bold;
  transition: 0.7s;
  text-align: center;
  color: var(--whiteColor);
  font-size: 12px;
  margin: 0 auto 0;
  text-decoration: none;
}

/* single-works.php関連施工事例 */
#works .main .relation-works {
  width: 1100px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  padding: 0 0 30px;
  box-sizing: border-box;
}

#works .main .relation-works h3 {
  margin: 0 0 15px 0;
}

#works .main .relation-works-list {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  margin: 0 0 20px;
}

#works .main .relation-works-item {
  margin: 0;
  padding-left: 0;
  width: 23%;
}

#works .main .relation-works-link {
  display: block;
  font-size: 13px;
  color: var(--blackColor);
  text-decoration: none;
  line-height: 1.4;
  text-align: justify;
}

#works .main .relation-works-wrap {
  margin-bottom: 5px;
}

#works .main .relation-works-wrap img {
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

#works .main .relation-works-item::before,
#works .main .relation-works-item::after {
  display: none;
}

#works .main .relation-works .btn {
  display: block;
  max-width: 420px;
  margin-inline: auto;
  margin-bottom: 0;
}

/*------------- セミナー情報 -------------*/
.main .seminarArchiveBox article {
  width: 100%;
  float: none;
  margin: 0 0 50px;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  background: var(--whiteColor);
  border: #ccc solid 1px;
}

.main .seminarArchiveBox a {
  border: none;
  padding: 0 20px 20px;
}

.main .seminarArchiveBox .mainThumb {
  float: left;
  width: 320px;
  margin-right: 20px;
}

.main .seminarArchiveBox .btn {
  display: block;
  color: var(--whiteColor) !important;
  font-size: 16px;
  font-weight: bold;
  position: relative;
  padding: 10px 50px;
  text-decoration: none !important;
  border: var(--primaryColor) solid 2px;
  background: var(--primaryColor);
  transition: ease 0.4s;
  margin-bottom: 0;
}

.main .seminarArchiveBox a:hover .btn {
  color: var(--primaryColor) !important;
  background: var(--whiteColor);
  transition: ease 0.4s;
}

.main .seminarArchiveBox h3 {
  background: var(--primaryColor);
  font-size: 22px;
  color: var(--whiteColor);
  width: auto;
  padding: 5px 10px;
  margin: 0 -20px 20px;
  text-align: left;
  position: relative;
  overflow: hidden;
  height: auto;
  overflow-wrap: normal;
}

.main .seminarArchiveBox h3 span {
  border-radius: 3px;
  padding: 2px 10px;
  font-size: 16px;
}

.main .seminarArchiveBox h3 span.color {
  float: right;
}

.main .seminarArchiveBox .overflowH {
  background: none;
  padding: 0;
  color: var(--blackColor);
}

.main .seminarArchiveBox dl {
  border-top: var(--blackColor) dotted 1px;
  padding-top: 20px;
  margin-bottom: 20px;
}

.main .seminarArchiveBox dl dt {
  font-weight: bold;
  float: left;
  clear: both;
}

.main .seminarArchiveBox dl dd {
  padding: 0 0 0 120px;
  border-bottom: var(--blackColor) dotted 1px;
  padding-bottom: 20px;
  margin-bottom: 20px;
}

.main .seminarArchiveBox dl dd:last-of-type {
  margin-bottom: 0;
}

.main .infoBox .status {
  float: left;
  font-size: 16px;
  font-weight: bold;
  color: var(--whiteColor);
  margin-bottom: 0;
}

.main .infoBox .status span {
  border-radius: 3px;
  padding: 2px 10px;
}

.main .formBox td input[type="text"].readonly {
  background: #eee;
  color: #888;
}

.main .seminarImg {
  text-align: center;
}

.main .seminarImg li {
  width: 48%;
  width: calc(50% - 10px);
  display: inline-block;
  padding: 0;
}

.main .seminarImg li:after,
.main .seminarImg li:before {
  content: none;
}

.main .seminarImg img {
  width: 100%;
}

.main .seminarSingle h2 span {
  display: inline-block;
}

.main .seminarSingle table td {
  background: #f5f5f5;
}

/*------------- tmp -------------*/

.wp-pagenavi {
  clear: both;
  text-align: center;
  padding-top: 35px;
  margin-bottom: 35px;
}

.wp-pagenavi span,
.wp-pagenavi a {
  background: var(--whiteColor);
  display: inline-block;
  border-radius: 3px;
  line-height: 1.2;
}

.wp-pagenavi a {
  background: var(--primaryColor);
  color: var(--whiteColor);
  border: none;
}

/*投稿画像の回り込み処理*/

img.centered {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

img.alignright {
  padding: 0;
  margin: 0 0 2px 7px;
  display: inline;
}

img.alignleft {
  padding: 0;
  margin: 0 30px 10px 0;
  display: inline;
}

img.aligncenter {
  display: block;
  margin: 0 auto;
}

.alignright {
  float: right;
  margin-left: 10px;
  margin-bottom: 2px;
}

.alignleft {
  float: left;
  margin-right: 10px;
  margin-bottom: 2px;
}

img {
  border-style: none;
}

.main .nobr br {
  display: none;
}

.main p.wp-caption {
  font-size: 0.8em;
  line-height: 1.2em;
}

.main p.wp-caption img {
  margin-bottom: 5px;
}

.main p.wp-caption .caption-text {
  text-align: left;
}

/*pagenavi*/

.main .naviUl {
  margin: 0 0 20px;
  height: 34px;
  position: relative;
}

.main .pagenavi {
  padding: 20px 0 0 0;
  text-align: center;
  position: relative;
}

.main .pagenavi a {
  display: inline-block;
  border-radius: 5px;
  background: var(--primaryColor);
  padding: 5px 5px;
  width: 130px;
  text-align: center;
  transition: 0.7s;
  font-size: 18px;
  font-weight: bold;
  box-sizing: border-box;
}

.main .pagenavi a:link,
.main .pagenavi a:hover,
.main .pagenavi a:visited {
  color: var(--whiteColor);
  text-decoration: none;
}

.main .pagenavi a:hover {
  opacity: 0.75;
  transition: 0.7s;
}

.main .pagenavi li {
  padding: 0;
  margin: 0;
  background: none;
  display: block;
  width: 140px;
}

.main .pagenavi li:before,
.main .pagenavi li:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  left: inherit;
  margin: auto;
  content: "";
  vertical-align: middle;
  z-index: 2;
}

.main .pagenavi li:before {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--whiteColor);
}

.main .pagenavi li:after {
  right: 26px;
  width: 4px;
  height: 4px;
  border-top: 2px solid var(--primaryColor);
  border-right: 2px solid var(--primaryColor);
  transform: rotate(45deg);
}

.main .pagenavi .prev {
  position: absolute;
  right: 0;
}

.main .pagenavi .prev a {
  padding: 5px 20px 5px 5px;
}

.main .pagenavi li.list {
  position: absolute;
  left: 50%;
  margin-left: -70px;
}

.main .pagenavi li.list:before,
.main .pagenavi li.list:after {
  content: none;
}

.main .pagenavi .next {
  position: absolute;
  left: 0;
}

.main .pagenavi li.next:before,
.main .pagenavi li.next:after {
  left: 20px;
  right: inherit;
}

.main .pagenavi li.next:after {
  left: 26px;
  transform: rotate(-135deg);
}

.main .pagenavi .next a {
  padding: 5px 5px 5px 20px;
}

/*-------------------#top-----------------*/

.mainv {
  margin-top: 1px;
  margin-bottom: 0;
  height: 550px;
  z-index: 0;
  overflow: hidden;
}

.mainv .stage {
  width: 100%;
  margin: 0 auto;
  z-index: 0;
}

.mainv .stage span {
  width: 1000px;
  z-index: 10;
}

.slick-slide {
  opacity: 0.5;
  transition: 0.5s;
}

.slick-current {
  opacity: 1;
}

.mainv .stage button {
  position: absolute;
  z-index: 2000;
}

.arrows {
  width: 1110px;
  margin: 0 auto;
  position: relative;
}

.arrows button {
  position: absolute;
  border: none;
}

.arrows button.slick-prev,
.arrows button.slick-next {
  background: none;
  outline: none;
  cursor: pointer;
  width: 2000px;
  height: 550px;
}

.arrows button.slick-prev {
  right: 1150px;
  top: -550px;
}

.arrows button.slick-next {
  left: 1150px;
  top: -550px;
}

.arrows button.slick-prev:before,
.arrows button.slick-next:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
}

.arrows .slick-prev:hover {
  background: url(./img/common/leftNav.png) right center no-repeat;
  opacity: 1;
}

.arrows .slick-next:hover {
  background: url(./img/common/rightNav.png) left center no-repeat;
  opacity: 1;
}

.slick-dots {
  position: absolute;
  bottom: -50px;
  width: 100%;
  padding: 0;
  list-style: none;
  text-align: center;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 0 10px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 12px;
  height: 12px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
  position: relative;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  font-size: 6px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 12px;
  height: 12px;
  content: "";
  text-align: center;
  display: block;
  background: #ccc;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
  background: #fed900;
}

.main .bnrSsec ul {
  padding: 0;
  margin: 0;
}

.main .bnrSsec li {
  float: left;
  padding: 0;
  margin: 0;
}

.main .bnrSsec li:first-child {
  margin-right: 20px;
}

.main .bnrSsec li:before,
.main .bnrSsec li:after {
  content: none;
}

#top .main iframe {
  box-sizing: border-box;
}

#top .mainCatch {
  position: relative;
  z-index: 10;
  margin: 0 auto;
}

#top .mainCatch h2 {
  color: #8f8f8f;
  width: 1000px;
  font-size: 28px;
  line-height: 1.2;
  position: relative;
  margin: 0 auto;
  padding: 30px 0 5px;
  text-align: center;
}

#top .mainCatch h2 span {
  font-size: 63px;
  font-weight: bold;
  display: block;
  position: relative;
  color: var(--blackColor);
}

#top .mainCatch h2 span::before {
  content: "[";
  position: absolute;
  left: 70px;
  top: 50%;
  transform: translateY(-50%);
}

#top .mainCatch h2 span::after {
  content: "]";
  position: absolute;
  right: 70px;
  top: 50%;
  transform: translateY(-50%);
}

#top .mainCatch .txtLight {
  display: inline;
  font-weight: normal;
}

.main .newsBox {
  width: 730px;
  position: relative;
  float: left;
  background: var(--whiteColor);
  border-top: none;
  box-sizing: border-box;
  display: block;
}

.main .newsBox h3 {
  position: relative;
  background: none;
  font-size: 23px;
  font-weight: normal;
  padding: 0 0 12px 0;
  border-top: none;
  margin: 0 0 5px;
  line-height: 1;
  border-image: none;
  font-weight: bold;
  text-align: center;
}

.main .newsBox h3:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  background: #22287f;
  width: 150px;
  height: 5px;
}

.main .newsBox h4 {
  font-size: 12px;
  padding: 0;
  position: relative;
  margin: 0 0 5px;
  font-weight: normal;
}

.main .newsBox h4:before,
.main .newsBox h4:after {
  content: none;
}

.main .newsBox .contbtn {
  margin: 0 0 10px;
  font-size: 16px;
  position: relative;
}

.main .newsBox .contbtn li {
  display: inline-block;
  padding: 0;
  margin: 0;
}

.main .newsBox .contbtn a {
  padding: 5px 13px;
  width: auto;
  font-size: 14px;
  display: block;
  border: 1px var(--primaryColor) solid;
  color: var(--primaryColor);
  font-weight: bold;
  position: relative;
  background: var(--whiteColor);
  text-decoration: none;
}

.main .newsBox .contbtn li:before,
.main .newsBox .contbtn li:after {
  content: none;
}

.main .newsBox .inBox {
  box-sizing: border-box;
  position: relative;
  margin-bottom: 0;
  display: flex;
  /* justify-content: space-between; */
}

.main .newsBox .inBox li {
  position: relative;
  overflow: hidden;
  padding: 0;
  width: 23.5%;
  margin: 0 2% 0 0;
}

.main .newsBox .inBox li:last-of-type {
  margin-right: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.main .newsBox .inBox li:before,
.main .newsBox .inBox li:after {
  content: none;
}

.main .newsBox .inBox li a {
  color: var(--blackColor);
  text-decoration: none;
  display: block;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.main .newsBox .inBox li h5 {
  background: none;
  font-size: 12px;
  font-weight: bold;
  padding: 0;
  margin: 0 0 5px 0;
  max-height: 3em;
}

.main .newsBox .inBox li .price {
  color: var(--attentionColor);
}

.main .newsBox .inBox p {
  font-size: 12px;
  margin-bottom: 0;
}

.main .newsBox .inBox p.time {
  margin-bottom: 0;
}

.main .newsBox .inBox .contTxt {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
  color: inherit;
}

.main .newsBox .inBox p strong {
  color: var(--attentionColor);
}

.main .newsBox .inBox .cat {
  color: var(--whiteColor);
  position: absolute;
  right: 0;
  top: 0;
  background: var(--primaryColor);
  font-size: 12px;
  font-weight: bold;
  padding: 0 10px;
}

.main .newsBox .inBox li .cat a {
  color: var(--whiteColor);
  position: relative;
  overflow: visible;
}

.main .newsBox .inBox li .newsTumb {
  width: 100%;
  background: #f5f5f5;
  position: relative;
  overflow: hidden;
  display: block;
}

.main .newsBox .inBox li .newsTumb:before {
  content: "" !important;
  display: block;
  padding-top: 80%;
}

.main .newsBox .inBox li .newsTumb img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  height: 100%;
}

.main .informationBox .imgR {
  margin: 20px 0 0 0;
}

.main .bnrCondominium .inner {
  padding: 0 0 50px;
}

.main .worksBox {
  width: 1200px;
  padding: 0;
  margin: 0 auto;
  position: relative;
}

.main .voiceBox .inner {
  padding: 40px 0;
}

.main .voiceBox .voiceSummary {
  margin-bottom: 0;
}

.main .worksList article,
.main .voiceList article {
  padding-bottom: 10px;
}

.main .aboutBox {
  overflow: initial;
  position: relative;
  margin-top: 7px;
  padding: 50px 0 60px;
}

.main .aboutBox .inner:first-of-type {
  padding: 0;
}

.main .aboutBox .inner:nth-of-type(2) {
  padding-bottom: 0;
}

.main .aboutBox .btn {
  margin-bottom: 0;
}

.worksBox .swiper-button-prev,
.worksBox .swiper-container-rtl .swiper-button-next {
  left: -10px;
}

.worksBox .swiper-button-prev:after,
.worksBox .swiper-container-rtl .swiper-button-next:after {
  font-family: "Font Awesome 5 Free";
  content: "\f137";
  font-weight: 900;
  color: var(--whiteColor);
}

.worksBox .swiper-button-next,
.worksBox .swiper-container-rtl .swiper-button-prev {
  right: -20px;
}

.worksBox .swiper-button-next:after,
.worksBox .swiper-container-rtl .swiper-button-prev:after {
  font-family: "Font Awesome 5 Free";
  content: "\f138";
  font-weight: 900;
  color: var(--whiteColor);
}

.main .worksList,
.main .voiceList {
  overflow: hidden;
  clear: both;
  height: auto;
  display: flex;
  /* justify-content: space-between; */
}

.main .worksList article {
  position: relative;
  min-height: 285px;
  height: auto;
}

.main .worksList article:nth-child(-n + 3),
.main .voiceList article:nth-child(-n + 3) {
  margin-top: 0;
}

.main .voiceList article:nth-child(3n) {
  margin-right: 0;
}

.main .mainThumb {
  width: 100%;
  position: relative;
  overflow: hidden;
  display: block;
  background: #f5f5f5;
}

.main .mainThumb:before {
  content: "" !important;
  display: block;
  padding-top: 60%;
}

.main .mainThumb img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

.main .voiceList .voiceSummary,
.main .archiveList .archiveSummary {
  color: var(--blackColor);
  background: var(--whiteColor);
  padding: 10px;
}

.main .columnArchiveBox .mainThumb img {
  width: auto;
  height: 100%;
}

#top .main .archiveList .overflowH {
  background-color: transparent;
  color: inherit;
  padding: 0;
}

#top .main .newsBox .inBox .cat {
  left: inherit;
  height: auto;
  line-height: inherit;
}

#top .main .newsBox .inBox p.time {
  color: var(--primaryColor);
  font-size: 11px;
}

#top .main .newsBox .inBox li h5 {
  color: var(--blackColor);
}

#top .main .newsBox .inBox .contTxt {
  color: #aaaaaa;
}

.main .archiveList .overflowH .price,
.main .worksList .worksExp .price {
  color: var(--whiteColor);
  display: table-cell;
  background: var(--attentionColor);
  border-radius: 3px;
  margin: 3px 8px 0 0;
  padding: 1px 5px 0 5px;
  color: var(--whiteColor);
}

.main .worksList .worksExp p {
  margin-bottom: 0;
}

.main .worksListLtl {
  overflow: hidden;
  padding-bottom: 20px;
}

.main .worksListLtl article {
  width: 236px;
  float: left;
  margin: 10px 18px 0 0;
  position: relative;
}

.main .worksListLtl article:nth-child(-n + 4) {
  margin-top: 0;
}

.main .worksListLtl article:nth-child(4n) {
  margin-right: 0;
}

.main .worksListLtl a {
  display: block;
  text-decoration: none;
}

.main .worksListLtl h3,
.main .worksListLtl .contTxt,
.main .worksListLtl .price {
  display: block;
  border: none;
  background: none;
  line-height: 1.4;
  font-size: 12px;
  padding: 0;
  margin: 0;
  color: var(--blackColor);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main .worksListLtl h3 {
  margin: 10px 0 0 0;
  color: #fe9814;
}

.main .worksListLtl .trim {
  width: 236px;
  height: 166px;
  position: relative;
  overflow: hidden;
  display: block;
  background: #ededed;
}

.main .worksListLtl .trim img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}

.main .worksListLtl .price {
  color: var(--attentionColor);
}

.main .worksListLtl .price span {
  display: inline-block;
  background: var(--attentionColor);
  color: var(--whiteColor);
  border-radius: 3px;
  padding: 1px 5px 0 5px;
  margin-right: 8px;
}

.main .resonList {
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}

.main .resonList li {
  color: var(--whiteColor);
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  float: left;
  margin: 0 11px 0 0;
  box-sizing: border-box;
  background: none;
  padding: 0;
}

.main .resonList li:last-child {
  margin-right: 0;
}

.main .resonList li a {
  color: var(--blackColor);
  text-decoration: none;
  display: block;
  padding: 8px;
  border-bottom: 4px solid #e5e5e5;
  background: var(--whiteColor);
  width: 175px;
}

.main .resonList li:before,
.main .resonList li:after {
  content: none;
}

.main .resonList li:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.main .resonList li h4 {
  background: none;
  padding: 0;
  font-size: 35px;
  line-height: 1.2;
  margin: 10px 0 0;
  color: var(--primaryColor);
}

.main .resonList li h4:before,
.main .resonList li h4:after {
  display: none;
}

.main .resonList li h4 small {
  font-size: 18px;
  display: block;
}

.main .resonList li p {
  display: block;
  margin: 15px 0 0;
  border-top: 1px dotted var(--blackColor);
  font-size: 12px;
  text-align: left;
  padding: 12px 5px 5px 5px;
  color: var(--blackColor);
}

#reason .main .resonList,
#docrequest .main .resonList {
  margin-bottom: 0;
}

#reason .main .resonList li a,
#docrequest .main .resonList li a {
  color: var(--whiteColor);
  background: var(--primaryColor);
}

#reason .main .resonList li h4,
#docrequest .main .resonList li h4 {
  color: var(--whiteColor);
}

#reason .main .resonList li p,
#docrequest .main .resonList li p {
  border-top: 1px dotted var(--whiteColor);
  color: var(--whiteColor);
}

#docrequest .resonTextBlock {
  width: 1000px;
  margin: 60px auto 30px;
  position: relative;
  box-sizing: border-box;
  border-radius: 10px;
  border: 10px solid var(--primaryColor);
  padding: 20px;
}

#docrequest .resonTextBlock::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -90px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 60px 130px 0 130px;
  border-color: var(--attentionColor) transparent transparent transparent;
  transform: translateX(-50%);
}

#docrequest .resonText {
  font-size: 34px;
  line-height: 1.3;
  background: none;
  color: var(--blackColor);
  position: relative;
  margin: 0;
  padding: 0;
}

#docrequest .resonText .resonTexts {
  display: block;
  font-size: 51px;
}

.main .contentBnrList {
  position: relative;
  overflow: hidden;
}

.main .contentBnrList li {
  float: left;
  margin: 40px 40px 0 0;
  background: none;
  padding: 0;
}

.main .contentBnrList li:nth-child(-n + 2) {
  margin-top: 0;
}

.main .contentBnrList li:nth-child(2n) {
  float: right;
  margin-right: 0;
}

.main .contentBnrList li:before,
.main .contentBnrList li:after {
  display: none;
}

.main .basicKnow {
  margin-top: 1px;
}

.main .basicKnow h3 {
  background: var(--primaryColor);
  border: none;
  color: var(--whiteColor);
  font-size: 22px;
  margin: 20px 0 0;
  text-align: center;
}

.main .basicKnow .catchTtl {
  font-size: 50px;
  line-height: 1.2;
  font-weight: bold;
  text-align: center;
}

.main .basicKnow .catchTtl strong {
  font-size: 50px;
  background: none;
  color: var(--attentionColor);
}

.main .basicKnow .catchTtl span {
  color: #ff6600;
}

.main .basicKnow .pointList {
  counter-reset: point;
}

.main .basicKnow .pointList li {
  position: relative;
  margin-bottom: 0;
  overflow: hidden;
  counter-increment: point;
  text-align: left;
}

.main .basicKnow .pointList li h4 {
  font-size: 16px;
  font-weight: bold;
  margin: 10px 0 0 0;
  padding: 0;
}

.main .basicKnow .pointList li h4:before,
.main .basicKnow .pointList li h4:after {
  content: none;
}

.main .basicKnow .pointList li p {
  margin: 10px 0 10px 0;
  font-size: 15px;
}

.main .basicKnow .pointList li:before,
.main .basicKnow .pointList li:after {
  content: none;
}

.main .basicKnow .pointList li .pointImg {
  position: relative;
}

.main .basicKnow .pointList li img {
  display: block;
}

.main .basicKnow .pointList li .imgLayer {
  right: 2px;
  bottom: 3px;
}

.main .basicKnow .pointList li h6 {
  background: none;
  font-size: 18px;
  padding: 0;
  margin-top: 10px;
}

.main .basicKnow .pointList li h6 strong {
  color: var(--attentionColor);
  display: block;
}

.main .basicKnow .pointList li ul li {
  width: auto;
  padding: 0;
  margin: 0;
  font-size: 14px;
}

.main .basicKnow .pointList li ul li strong {
  font-weight: normal;
  background: #fcff00;
  line-height: 0.6;
  display: inline-block;
}

.main .basicKnow .pointTxt .imgL20 {
  margin-top: 20px;
}

.main .profileBox h2 {
  padding: 20px 0 0;
}

.main .profileBox .groupPhoto {
  background: url(./img/common/group_photo01.png) no-repeat center bottom;
  width: 550px;
  float: left;
  margin-right: 10px;
  text-align: center;
}

.main .profileBox .groupPhoto p {
  font-size: 35px;
  color: #ff6600;
  font-weight: bold;
  line-height: 1.5;
  margin-top: 65px;
}

.main .profileBox .overflowH p {
  font-size: 15px;
}

.main .profileBox ul {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .profileBox ul li {
  display: inline-block;
  border-radius: 3px;
  background: #22287f;
  position: relative;
  width: 48%;
  width: calc(50% - 5px);
  padding: 0;
  margin: 10px 0 0 0;
}

.main .profileBox ul li:hover {
  opacity: 0.8;
  transition: 0.7s;
}

.main .profileBox ul li a {
  display: block;
  color: var(--whiteColor);
  font-size: 17px;
  font-weight: bold;
  position: relative;
  padding: 20px 40px 20px 50px;
  text-decoration: none;
}

.main .profileBox ul li:before,
.main .profileBox ul li:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 30px;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main .profileBox ul li:before {
  width: 18px;
  height: 18px;

  border-radius: 50%;
  background: var(--whiteColor);
}

.main .profileBox ul li:after {
  left: 35px;
  width: 5px;
  height: 5px;
  border-top: 2px solid #22287f;
  border-right: 2px solid #22287f;
  transform: rotate(45deg);
}

/*-------------------#first-----------------*/

.main .firstPoint ol {
  counter-reset: fistpoint;
  position: relative;
  overflow: hidden;
  padding: 0;
}

.main .firstPoint ol li {
  list-style: none;
  position: relative;
  overflow: hidden;
}

.main .firstPoint ol>li {
  padding: 30px 0 0;
  counter-increment: fistpoint;
}

.main .firstPoint ol>li h4 {
  margin-bottom: 0;
}

.main .firstPoint h3:before {
  content: "ポイント" counter(fistpoint, decimal-leading-zero);
  background: #22287f;
  border-radius: 5px;
  color: var(--whiteColor);
  padding: 5px 20px;
  display: inline-block;
  position: absolute;
  bottom: 100%;
  left: 0;
  font-size: 20px;
}

.main .firstPoint h3.catchTtl {
  font-size: 50px;
  line-height: 1.3;
  background: none;
  color: var(--blackColor);
  position: relative;
  padding: 0;
}

.main .corpType {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .corpType li {
  padding: 0;
  border: #ccc solid 7px;
  padding: 10px 20px;
  margin-bottom: 20px;
  width: 48%;
  width: calc(50% - 10px);
  box-sizing: border-box;
}

.main .corpType li:before,
.main .corpType li:after {
  content: none;
}

.main .firstPoint ol li li p:last-child {
  margin-bottom: 0;
}

.main .firstPoint table {
  width: 480px;
  height: 250px;
  float: right;
  clear: none;
}

.main .firstPoint table th,
.main .firstPoint table td {
  padding: 10px 10px;
  background: #eeeeee;
  position: relative;
  text-align: center;
}

.main .firstPoint table thead th:first-of-type {
  width: 20%;
}

.main .firstPoint table th {
  width: auto;
  background-color: #0e57aa;
  color: var(--whiteColor);
  text-align: center;
  vertical-align: middle;
}

.main .firstPoint p {
  font-size: 16px;
}

.main .firstPoint p.pointCom {
  border-top: dotted 1px var(--blackColor);
  margin-top: 30px;
  padding-top: 30px;
}

.main .firstPoint h5 {
  font-size: 20px;
  margin: 0 0 10px;
}

.main .firstPoint table th {
  width: auto;
}

.main .firstPoint table strong {
  font-weight: bold;
  color: var(--attentionColor);
}

.main .firstPoint table caption {
  caption-side: bottom;
  text-align: right;
}

.main .firstPoint .btn {
  margin-bottom: 40px;
  float: right;
}

#first .main table strong {
  color: var(--attentionColor);
}

/*-------------------#corporate-----------------*/

#corporate .main table a {
  padding: 5px;
  border-radius: 0;
  font-weight: bold;
}

#corporate .main table iframe {
  border: #ccc solid 1px;
}

/*-------------------#showroom-----------------*/

#showroom .main .mainPhoto li {
  margin-bottom: 5px;
}

#showroom .main h2.photoBt {
  background: #ff6600;
  text-align: center;
  margin-top: 0;
}

#showroom .main ul.photoUL p {
  font-size: 18px;
  font-weight: bold;
}

#showroom .main h2.point3 {
  background: #ff6600;
  text-align: center;
  margin-top: 30px;
}

.main ul.showroomMenu {
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
  width: 473px;
  padding: 0 263px;
  position: relative;
}

.main ul.showroomMenu:before,
.main ul.showroomMenu:after {
  content: "";
  display: block;
  position: absolute;
  top: calc(50% - 13px);
  width: 106px;
  height: 26px;
  background: url(./img/common/bg_showroommenu.png) no-repeat center top;
}

.main ul.showroomMenu:before {
  left: 70px;
}

.main ul.showroomMenu:after {
  right: 70px;
}

.main ul.showroomMenu li {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}

.main ul.showroomMenu li a {
  color: var(--blackColor);
  text-decoration: none;
}

.main ul.showroomMenu li img {
  display: block;
  margin-bottom: 5px;
}

.main ul.showroomMenu li:before,
.main ul.showroomMenu li:after {
  display: none;
}

.main .mainPhoto,
.main .mainPhoto li {
  margin: 0;
  padding: 0;
}

.main .mainPhoto {
  margin: 0;
}

.main .mainPhoto li {
  width: 707px;
  height: 564px;
  overflow: hidden;
  float: left;
  margin-bottom: 30px;
}

.main .mainPhoto li.item2,
.main .mainPhoto li.item3 {
  display: none;
}

.main .mainPhoto li:hover img {
  opacity: 0.8;
}

.main .thumb {
  margin: 0;
  width: 278px;
  float: right;
}

.main .thumb li {
  display: inline-block;
  width: 278px;
  height: 178px;
  overflow: hidden;
  cursor: pointer;
  vertical-align: top;
  padding: 0;
  margin: 0 0 15px 0;
}

.main .thumb li:hover img {
  opacity: 0.8;
}

.main .mainPhoto li:before,
.main .mainPhoto li:after,
.main .thumb li:before,
.main .thumb li:after {
  content: none;
}

.main .photoShowroom {
  margin: 0 0 0 0;
  padding: 0;
  overflow: hidden;
}

.main .photoShowroom li {
  margin-bottom: 15px;
}

.main .photoShowroom li:first-child {
  float: left;
  margin-left: 15px;
}

.main table.accessT {
  padding-top: 15px;
}

.main table.accessT th,
.main table.accessT td {
  background: #eeeeee;
}

.main table.accessT th {
  width: 20%;
  background-color: #22287f;
  font-weight: normal;
}

.main .showroomPict {
  position: relative;
  overflow: hidden;
}

.main .showroomPict .mainimglist {
  width: 750px;
  height: 480px;
  position: relative;
  overflow: hidden;
  float: left;
}

.main .showroomPict .mainimglist img {
  width: 750px;
  height: auto;
}

.main .showroomPict .thumbnaillist {
  width: 230px;
  float: right;
  margin-top: 0;
}

.main .showroomPict .thumbnaillist li {
  background: none;
  padding: 0;
  margin: 0 0 15px;
}

.main .showroomPict .thumbnaillist li:last-child {
  margin-bottom: 0;
}

.main .showroomPict .thumbnaillist li a {
  width: 230px;
  height: 150px;
  overflow: hidden;
  display: block;
}

.main .showroomDetail {
  padding-top: 0;
}

.main ul.showroomDetail {
  position: relative;
  overflow: hidden;
}

.main ul.showroomDetail li {
  width: 480px;
  float: left;
  padding: 0;
  margin: 0 26px 0 0;
  background: none;
}

.main ul.showroomDetail li:last-child {
  float: right;
  margin-right: 0;
}

.main ul.showroomDetail li:before,
.main ul.showroomDetail li:after {
  content: none;
}

.main ul.showroomDetail li img {
  margin-bottom: 10px;
}

.main .showroomDetail p {
  font-size: 18px;
  font-weight: bold;
}

.main .showroomDetail table {
  margin-bottom: 30px;
}

.main .showroomDetail .tel {
  margin-top: 0;
}

.main .showroomDetail .tel span {
  font-size: 35px;
  font-weight: bold;
  line-height: 1;
  padding-left: 40px;
  display: block;
}

.main .showroomMerit h2.catchTtl {
  background: url(./img/common/showroom_catchttlbg.png) no-repeat center center;
  font-size: 50px;
  text-align: center;
  border-bottom: none;
  color: var(--blackColor);
}

.main .showroomMerit ol {
  position: relative;
  overflow: hidden;
  padding: 0;
}

.main .showroomMerit ol li {
  padding: 0 15px;
  width: 322px;
  box-sizing: border-box;
  margin: 0 17px 0 0;
  position: relative;
  display: block;
  float: left;
  list-style-type: none;
  color: var(--whiteColor);
  padding: 5px 15px;
  background: var(--primaryColor);
}

.main .showroomMerit ol li:nth-child(3n) {
  margin-right: 0;
}

.main .showroomMerit ol li:before,
.main .showroomMerit ol li:after {
  display: none;
}

.main .showroomMerit ol li h5 {
  background: none;
  color: #fcff00;
  font-size: 22px;
  margin: 0;
  line-height: 1;
  padding: 0;
}

.main .showroomMerit ol li h5 span {
  font-size: 36px;
}

.main .showroomMerit ol li img {
  float: right;
  margin: -5px -15px -5px 15px;
}

.main .showroomMerit ol li br {
  display: none;
}

.main .showroomMerit ol li p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

.main ol.showroomStep {
  position: relative;
  overflow: hidden;
  padding: 0;
  margin: 0 0 30px;
}

.main ol.showroomStep li {
  list-style-type: none;
  float: left;
  width: 275px;
  margin: 15px 0 0 -50px;
  font-weight: bold;
}

.main ol.showroomStep li span {
  background: var(--primaryColor);
  border-radius: 50%;
  width: 67px;
  height: 67px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
}

.main ol.showroomStep li:first-child {
  width: 200px;
  margin-left: 0;
}

.main ol.showroomStep li h4 {
  background: linear-gradient(90deg, var(--whiteColor)000 0%, var(--primaryColor) 100%);
  margin: 0 50px 10px 0;
  color: var(--whiteColor);
  padding: 0 10px 0 50px;
}

.main ol.showroomStep li:first-child h4 {
  padding-left: 10px;
}

.main ol.showroomStep li:last-child h4 {
  background: var(--attentionColor);
}

.main ol.showroomStep li h4:before {
  display: none;
}

.main ol.showroomStep li h4:after {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 40px 0 0 40px;
  border-color: transparent transparent transparent var(--primaryColor);
  content: "";
  z-index: 10;
  position: absolute;
  left: 100%;
  bottom: 0;
  top: inherit;
  border-radius: 0;
  background: none;
}

.main ol.showroomStep li:last-child h4:after {
  border-color: transparent transparent transparent var(--attentionColor);
}

.main ol.showroomStep li p {
  padding-left: 40px;
  height: 68px;
  display: flex;
  align-items: center;
}

.main ol.showroomStep li:first-child p {
  padding-left: 0;
}

.main ol.showroomStep li:last-child img {
  width: 67px;
  height: auto;
}

/*-------------------#reason-----------------*/

.reasonBox {
  position: relative;
  overflow: hidden;
  padding: 0;
}

.reasonBox h3,
.main .reasonBox h3 {
  background: var(--primaryColor);
  color: var(--whiteColor);
  width: 360px;
  font-size: 20px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 900;
  outline: var(--whiteColor) solid 1px;
  outline-offset: -20px;
  padding: 50px 40px;
  box-sizing: border-box;
  float: left;
  margin: 0 10px 10px 0;
  line-height: 1.5;
  text-align: center;
}

.main .reasonBox h3 {
  border: none;
}

.reasonBox h3 span,
.main .reasonBox h3 span {
  font-size: 58px;
  display: block;
}

.reasonBox h3 small,
.main .reasonBox h3 small {
  font-size: 20px;
  display: block;
  font-weight: 500;
}

.reasonList {
  counter-reset: reasonlist;
}

.reasonList li,
.main .reasonList li {
  width: 360px;
  margin: 0 10px 10px 0;
  padding: 0;
  float: left;
  /* height: 265px; */
  background: var(--primaryColor);
  color: var(--blackColor);
  counter-increment: reasonlist;
}

.main .reasonList li:nth-child(2),
.main .reasonList li:nth-child(5) {
  margin-right: 0;
}

.main .reasonList li:nth-child(3) {
  clear: both;
}

.main .reasonList li:before,
.main .reasonList li:after {
  content: none;
}

.main .reasonList li:before {
  content: counter(reasonlist, decimal-leading-zero);
  background: none;
  z-index: 1;
  font-size: 35px;
  font-weight: bold;
  top: 10px;
  left: 10px;
  width: auto;
  height: auto;
  line-height: 1;
  color: var(--whiteColor);
}

.main .reasonList li:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 100px 100px 0 0;
  border-color: var(--blackColor) transparent transparent transparent;
  transform: none;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  top: 0;
  left: 0;
}

.main .reasonList li a {
  color: var(--whiteColor);
  text-decoration: none;
  display: block;
  height: 100%;
}

.main .reasonList .reasonSummary {
  padding: 10px;
  text-align: center;
  color: var(--whiteColor);
}

.main .reasonList a:hover .reasonSummary {
  box-shadow: 0px 0px 0px 10px var(--blackColor) inset, 0px 0px 0px 11px var(--whiteColor) inset;
  transition: 0.4s;
}

.main .reasonList .reasonSummary h4 {
  padding: 0;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 700;
  margin-bottom: 10px;
  display: block;
}

.main .reasonList .reasonSummary h4::before,
.main .reasonList .reasonSummary h4::after {
  content: none;
}

.main .reasonList .reasonSummary h4 span {
  /* font-size: 35px; */
  display: block;
}

.main .reasonList .reasonSummary p {
  margin-bottom: 0;
  font-size: 15px;
}

#reason .main .balloonBox {
  margin: 30px auto;
}

#reason .main .balloonBox p {
  font-size: 30px;
}

#reason .catchTtl,
#reason .catchTtls {
  font-size: 48px;
  font-weight: bold;
  line-height: 1.3;
  margin-bottom: 20px;
  text-align: left;
  position: relative;
  overflow: hidden;
}

#reason .catchTtls {
  color: #22287f;
}

#reason .catchTtl {
  display: flex;
  align-items: center;
}

#reason .catchTtl strong {
  color: var(--primaryColor);
}

#reason .catchTtl img {
  float: left;
}

#reason .catchTtl span.txtFree {
  background: var(--attentionColor);
  border-radius: 4px;
  font-size: 40px;
  display: table-cell;
  width: auto;
  height: auto;
  padding: 0 15px;
  margin: 0;
  line-height: 1.3;
  float: none;
}

.main .reasonDetail {
  position: relative;
  overflow: hidden;
  padding: 0;
  counter-reset: reason;
}

.main .reasonDetail>li {
  counter-increment: reason;
  padding: 0;
  margin: 0 0 40px 0;
  position: relative;
  overflow: hidden;
  list-style: none;
}

.main .reasonDetail>li:before,
.main .reasonDetail>li:after {
  content: none;
}

.main .reasonDetail>li:last-child {
  margin-bottom: 0;
}

.main .reasonDetail h3 {
  margin-bottom: 30px;
  font-size: 37px;
  position: relative;
  background: none;
  border: none;
  padding: 20px 0 0 90px;
  line-height: 1.1;
  min-height: 75px;
}

.main .reasonDetail h3:before {
  content: counter(reason, decimal-leading-zero);
  background: none;
  z-index: 1;
  font-size: 35px;
  font-weight: bold;
  top: 10px;
  left: 10px;
  width: auto;
  height: auto;
  line-height: 1;
  position: absolute;
  color: var(--whiteColor);
}

.main .reasonDetail h3:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 100px 100px 0 0;
  border-color: var(--primaryColor) transparent transparent transparent;
  transform: none;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  top: 0;
  left: 0;
  position: absolute;
}

.main .reasonDetail h3 img {
  position: absolute;
  left: 0;
}

.main .reasonDetail h3 span {
  color: var(--attentionColor);
}

.main .reasonDetail .alignleft {
  margin: 0 30px 15px 0;
}

.main .reasonDetail .alignright {
  margin: 0 0 15px 30px;
}

.main .reasonDetail p {
  margin-bottom: 15px;
  font-size: 15px;
  line-height: 1.8;
}

.main .reasonDetail img {
  margin-bottom: 20px;
}

.main .reasonDetail li p {
  font-size: 18px;
  text-align: justify;
}

.main .reasonDetail li p:last-child {
  margin-bottom: 0;
}

.main .reasonDetail .btn {
  float: right;
}

.main .showroomRecommended ul {
  margin-top: 20px;
  border-top: var(--blackColor) dotted 1px;
  padding-top: 10px;
  overflow: hidden;
  counter-reset: recommend;
}

.main .showroomRecommended li {
  background: none;
  border-bottom: var(--blackColor) dotted 1px;
  position: relative;
  font-size: 26px;
  font-weight: bold;
  padding: 0 0 8px 0;
  margin: 0 0 8px;
  counter-increment: recommend;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.main .showroomRecommended li:last-child {
  margin-bottom: 0;
}

.main .showroomRecommended li:before,
.main .showroomRecommended li:after {
  content: none;
}

.main .showroomRecommended li:before {
  content: "オススメ理由その" counter(recommend, decimal);
  background: var(--primaryColor);
  color: var(--whiteColor);
  padding: 2px 10px;
  box-sizing: border-box;
  margin: 0 10px 0 0;
  border-radius: 5px;
  width: auto;
  height: auto;
  position: relative;
  top: inherit;
  left: inherit;
}

.main .showroomRecommended li strong {
  background: var(--whiteColor)600;
  display: inline-block;
  line-height: 0.5;
}

#reason .main .showroomRecommended h3 .icoTtl {
  font-size: 40px;
  background-color: var(--attentionColor);
  border-radius: 50%;
  width: 130px;
  height: 130px;
  line-height: 1.2;
  color: var(--whiteColor);
  font-weight: bold;
  display: block;
  float: left;
  margin: -15px 20px 0 0;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
}

.main .showroomRecommended h3 {
  font-size: 48px;
  background: no-repeat;
  border: none;
  width: auto;
  margin: 0;
  padding: 15px 0 0;
  line-height: 1;
  color: var(--blackColor);
  position: relative;
  overflow: hidden;
}

#reason .main .showroomRecommended h3 span {
  padding: 0;
  color: var(--attentionColor);
  margin: 0;
}

#reason .main table thead th {
  text-align: center;
  font-weight: bold;
}

#reason .main table tbody th {
  background: #ccc;
  color: var(--blackColor);
  font-weight: bold;
}

#reason .main table tbody td {
  font-size: 20px;
  text-align: center;
  border-bottom: var(--blackColor) solid 1px;
}

.main .reasonPoint {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.main .reasonPoint ul {
  margin: 0 0 0 20px;
  border-top: var(--blackColor) dotted 1px;
  padding-top: 10px;
  overflow: hidden;
  counter-reset: recommend;
}

.main .reasonPoint li {
  background: none;
  border-bottom: var(--blackColor) dotted 1px;
  position: relative;
  font-size: 26px;
  font-weight: bold;
  padding: 0 0 8px 40px;
  margin: 0 0 8px;
  counter-increment: recommend;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.main .reasonPoint li:before {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  display: block;
  margin: auto;
  height: 30px;
  content: "\f14a";
  font-weight: 900;
  font-size: 30px;
  font-family: "Font Awesome 5 Free";
  line-height: 1;
  color: var(--primaryColor);
  width: auto;
  background: none;
}

.main .reasonPoint li:after {
  content: none;
}

.main .reasonPoint li h4 {
  font-size: 30px;
  margin: 0 10px 0 0;
}

.main .reasonPoint li h4:before {
  content: none;
}

.main .reasonPoint li p {
  font-size: 26px;
  margin-bottom: 0;
}

.main .reasonPoint li strong {
  color: var(--attentionColor);
}

#reason .main .catchTxt {
  line-height: 1.5;
  font-size: 30px;
  font-weight: bold;
}

#reason .main .catchTxt strong {
  color: var(--attentionColor);
}

/*-------------------#staff-----------------*/

#staff .main h2 {
  font-size: 30px;
}

#staff .main h2:first-of-type {
  margin-top: 0;
}

#staff .main #tabMenu {
  position: relative;
  overflow: hidden;
  margin-bottom: 25px;
}

#staff .main #tabMenu li {
  border-radius: 4px;
  background: linear-gradient(0deg, #7f7f7f 0%, #cfcfcf 100%);
  box-shadow: 0px 4px 7px 1px rgba(52, 52, 52, 0.35) inset;
  font-size: 25px;
  font-weight: bold;
  text-align: center;
  color: var(--whiteColor);
  text-decoration: none;
  display: block;
  float: left;
  line-height: 1.2;
  padding: 0;
  width: 485px;
}

#staff .main #tabMenu li a {
  color: var(--whiteColor);
  text-decoration: none;
  display: block;
  padding: 15px 0;
}

#staff .main #tabMenu li:hover {
  cursor: pointer;
  opacity: 0.8;
  transition: 0.7s;
}

#staff .main #tabMenu li:nth-child(2n) {
  float: right;
}

#staff .main #tabMenu li.select {
  background: linear-gradient(0deg, var(--attentionColor) 0%, #fd2571 100%);
}

#staff .main #tabMenu li.select:hover {
  opacity: inherit;
}

#staff .main .staffShop {
  position: relative;
  overflow: hidden;
  margin-bottom: 45px;
}

#staff .main .staffShop li {
  position: relative;
  font-size: 25px;
  background: none;
  display: inline-block;
  padding: 0 0 0 20px;
  margin: 0 35px 0 0;
}

#staff .main .staffShop li:before,
#staff .main .staffShop li:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

#staff .main .staffShop li:before {
  background: #12a73b;
  border-radius: 50%;
  width: 16px;
  height: 16px;
}

#staff .main .staffShop li:after {
  left: 4px;
  width: 5px;
  height: 5px;
  border-left: 2px solid var(--whiteColor);
  border-bottom: 2px solid var(--whiteColor);
  border-right: none;
  border-top: none;
  transform: rotate(-45deg);
}

#staff .main .staffShop li a {
  color: var(--blackColor);
  text-decoration: none;
}

#staff .main .staffList {
  position: relative;
  overflow: hidden;
  margin-bottom: 50px;
}

#staff .main .staffList li {
  background: none;
  float: left;
  margin: 35px 20px 0 0;
  width: 235px;
  padding: 0;
  font-weight: bold;
}

#staff .main .staffList li:nth-child(-n + 4) {
  margin-top: 0;
}

#staff .main .staffList li:nth-child(4n) {
  margin-right: 0;
}

#staff .main .staffList li a {
  text-decoration: none;
}

#staff .main .staffList li:before,
#staff .main .staffList li:after {
  content: none;
}

#staff .main .staffList li .staffPict {
  width: 235px;
  height: 280px;
  position: relative;
  overflow: hidden;
  margin-bottom: 10px;
}

#staff .main .staffList li .staffPict img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  height: 100%;
}

#staff .main .staffList li .positionTxt {
  display: block;
  margin: 0;
  text-align: center;
}

#staff .main .staffList li .positionTxt span {
  font-size: 12px;
  font-weight: bold;
  display: inline-block;
  text-align: center;
  padding: 2px 5px;
  line-height: 1.2;
  margin-right: 5px;
  color: var(--whiteColor);
  background: var(--primaryColor);
}

#staff .main .staffProf .profileDetail .positionTxt span {
  font-size: 12px;
  font-weight: bold;
  text-align: left;
  padding: 2px 5px;
  line-height: 1.2;
  margin-right: 5px;
  color: var(--whiteColor);
  background: var(--primaryColor);
  display: inline-block;
}

#staff .main .staffList li .staffName {
  color: var(--blackColor);
  font-size: 23px;
  line-height: 1.3;
  font-weight: bold;
  text-align: center;
  margin-bottom: 5px;
}

#staff .main .staffProf .profileDetail .staffName {
  color: var(--blackColor);
  font-size: 20px;
  line-height: 1.3;
  font-weight: bold;
  margin-bottom: 15px;
}

#staff .main .staffList li .staffName span,
#staff .main .staffProf .profileDetail .staffName span {
  color: var(--primaryColor);
  font-size: 12px;
  font-family: "Bahnschrift", sans-serif;
  font-weight: bold;
  display: block;
}

#staff .main #staffSection .inner {
  padding-top: 0;
}

#staff .main #staffSection .inner .combnrListOtr li {
  margin-bottom: 0;
  margin-top: 30px;
}

#staff .main .staffList li .btnDetail,
.staffProf a#btnClose {
  font-size: 12px;
  margin: 0 auto;
  width: 8em;
  padding: 3px 6px;
  background: var(--primaryColor);
  box-shadow: 0px 2px 0px 0px rgba(255, 255, 255, 0.4) inset;
  clear: both;
}

#btnClose {
  font-size: 14px;
  color: var(--whiteColor);
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  display: block;
  width: 6em;
  margin: 50px auto 0 auto;
  padding: 2px 20px;
}

body#staff {
  min-width: 0;
}

#staff .main .staffProf {
  padding: 20px;
  position: relative;
  overflow: hidden;
}

#staff .main .staffProf .staffPictBox {
  width: 235px;
  margin-right: 25px;
  float: left;
}

#staff .main .staffProf .staffPictBox>img {
  width: 235px;
  height: auto;
}

#staff .main .staffProf .staffPict {
  width: 235px;
  height: 314px;
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
}

#staff .main .staffProf .staffPict img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  height: 100%;
}

#staff .main .staffProf .profileDetail {
  overflow: hidden;
}

#staff .main .staffProf .profileDetail .positionTxt {
  margin-top: 0;
  font-size: 12px;
  margin-bottom: 5px;
}

#staff .main .staffProf .profileDetail .staffName span {
  display: inline-block;
  margin-left: 10px;
}

#staff .main .staffProf .profileDetail dl dt {
  background: var(--primaryColor);
  color: var(--whiteColor);
  font-size: 15px;
  font-weight: bold;
  display: block;
  padding: 3px 10px;
  margin: 15px 0 10px;
}

#staff .main .staffProf .profileDetail dl dd {
  font-size: 15px;
}

/*-------------------#colorsimulation-----------------*/
#colorsimulation .main h3 span {
  border-radius: 4px;
  background: #12a73b;
  color: var(--whiteColor);
  display: inline-block;
  padding: 0px 10px;
  margin: 10px 10px 10px 0;
}

#colorsimulation .main .inner h3:first-of-type {
  margin-top: 0;
}

#colorsimulation .main dl {
  position: relative;
  overflow: hidden;
}

#colorsimulation .main dl dt {
  width: 245px;
  float: left;
  margin-right: 30px;
  text-align: center;
}

#colorsimulation .main dl dt .balloonTxt {
  background: var(--primaryColor);
  border-radius: 5px;
  color: var(--whiteColor);
  text-align: left;
  padding: 10px 12px;
  position: relative;
  display: block;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4;
  margin-bottom: 20px;
}

#colorsimulation .main dl dt .balloonTxt:after {
  content: "";
  height: 0;
  position: absolute;
  width: 0;
  border: 8px solid transparent;
  border-top: var(--primaryColor) 10px solid;
  top: 100%;
  left: 50%;
  margin-left: -8px;
}

#colorsimulation .main dl dd {
  overflow: hidden;
  margin-bottom: 15px;
}

#colorsimulation .colorCtc {
  font-size: 50px;
  font-weight: bold;
  line-height: 1.3;
  margin-top: 10px;
  padding-top: 20px;
}

#colorsimulation .colorCtc strong {
  color: var(--primaryColor);
}

#colorsimulation .colorCtc span {
  float: left;
  background-color: var(--attentionColor);
  border: #d05e89 10px solid;
  border-radius: 50%;
  width: 150px;
  height: 150px;
  color: var(--whiteColor);
  font-size: 25px;
  line-height: 1.3;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin: 0 10px 30px 0;
  font-weight: bold;
  font-size: 60px;
}

.main ul.colorsimulationBa li {
  padding: 0;
  margin: 0;
  list-style-type: none;
  position: relative;
}

.main ul.colorsimulationBa li h3 {
  background: none;
  font-size: 50px;
  color: #22287f;
  border: none;
  padding: 0;
  margin: 0 0 20px 0;
  line-height: 1.2;
}

.main ul.colorsimulationBa li h3 img {
  float: left;
  margin-right: 30px;
}

.main ul.colorsimulationBa li ul {
  position: relative;
  overflow: hidden;
}

.main ul.colorsimulationBa li ul li {
  background: none;
  padding: 0;
  position: relative;
  margin-bottom: 20px;
}

.main ul.colorsimulationBa li ul li.before {
  margin-right: 30px;
  float: left;
}

.main ul.colorsimulationBa li:after,
.main ul.colorsimulationBa li:before,
.main ul.colorsimulationBa li ul li:after,
.main ul.colorsimulationBa li ul li:before {
  content: none;
  transform: none;
}

.main ul.colorsimulationBa li ul li.before:after {
  content: " ";
  height: 0;
  position: absolute;
  width: 0;
  border: 20px solid transparent;
  border-left: #22287f solid 20px;
  left: calc(100% + 5px);
  top: 0;
  bottom: 0;
  margin: auto;
}

.main ul.colorsimulationBa li ul li.after {
  float: right;
  width: 648px;
}

.main ul.colorsimulationBa li ul li.after p {
  font-size: 15px;
  margin-top: 20px;
}

.main ul.colorsimulationBa li img.imgCg {
  position: absolute;
  left: 0;
  bottom: 0;
}

.main ul.colorsimulationBa li ul li.after img {
  margin-left: 10px;
}

.main ul.colorsimulationBa li ul li.after img:first-child {
  margin-left: 0;
}

#colorsimulation .main ol.colorStep {
  padding: 0;
  position: relative;
  overflow: hidden;
  margin: 0;
}

#colorsimulation .main ol.colorStep li {
  background: none;
  border: #22287f solid 3px;
  border-radius: 5px;
  width: 182px;
  text-align: center;
  float: left;
  list-style: none;
  margin: 0 15px 0 0;
}

#colorsimulation .main ol.colorStep li:last-child {
  margin-right: 0;
}

#colorsimulation .main ol.colorStep li span {
  background: #22287f;
  color: var(--whiteColor);
  display: block;
  font-weight: bold;
  margin-bottom: 1px;
}

#colorsimulation .main ol.colorStep li h4 {
  font-size: 14px;
  padding: 0 5px;
  margin: 10px 0 5px;
  text-align: left;
}

#colorsimulation .main ol.colorStep li h4:before,
#colorsimulation .main ol.colorStep li h4:after {
  display: none;
}

#colorsimulation .main ol.colorStep li p {
  font-size: 12px;
  padding: 0 5px;
  text-align: left;
  margin: 5px 0;
}

#colorsimulation .main .campaignArw {
  background: #ff6600;
  color: var(--whiteColor);
  font-size: 20px;
  font-weight: bold;
  padding: 0 20px;
  margin: 20px 165px 10px 0;
  position: relative;
}

#colorsimulation .main .campaignArw:after {
  content: " ";
  height: 0;
  position: absolute;
  width: 0;
  border: 30px solid transparent;
  border-left: #ff6600 solid 48px;
  left: 100%;
  top: 50%;
  margin-top: -30px;
}

.main .sampleBox h3 {
  font-size: 50px;
  color: #22287f;
  line-height: 1.2;
  background: none;
  border-top: none;
  box-shadow: none;
  padding: 0;
}

.main .sampleBox .photoUL li {
  width: 320px;
  margin: 0 20px 20px 0;
}

.main .sampleBox .photoUL li:nth-child(3n) {
  margin-right: 0;
}

/*-------------------warningChk-----------------*/
.main .warningChk {
  padding: 0 20px 20px;
  background: var(--whiteColor)ddd;
  margin-bottom: 30px;
  box-sizing: border-box;
}

.main .warningChk h3 {
  background: #22287f;
  color: var(--whiteColor);
  text-align: center;
  font-size: 30px;
  margin: 0 -20px 30px;
  padding: 0;
  border: none;
}

.main .warningChk h5 {
  margin: 0 0 10px;
  background: var(--attentionColor);
  font-size: 18px;
}

.main .warningChk img {
  margin-right: 30px;
}

.main .warningChk ul {
  margin-bottom: 0;
}

.main .warningChk ul li {
  font-size: 22px;
  font-weight: bold;
  padding: 0 0 0 20px;
  margin: 0 0 0;
  position: relative;
}

.main .warningChk ul li:before,
.main .warningChk ul li:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main .warningChk ul li:before {
  width: 16px;
  height: 16px;

  border-radius: 50%;
  background: #22287f;
}

.main .warningChk ul li:after {
  left: 4px;
  width: 4px;
  height: 4px;
  border-top: 2px solid var(--whiteColor)eee;
  border-right: 2px solid var(--whiteColor)eee;
  transform: rotate(45deg);
}

/*-------------------#rainleaking#diagnosis-----------------*/
/*-------------------#rainleaking-----------------*/

.main .priceList {
  clear: both;
}

.main .priceList li {
  margin-bottom: 15px;
  padding: 7px 5px 0 15px;
  position: relative;
  color: var(--whiteColor);
  font-size: 50px;
  font-weight: bold;
  line-height: 1.2;
  overflow: hidden;
  border-radius: 5px;
  background-color: var(--attentionColor);
}

.main .priceList li span {
  padding: 3px 25px 0;
  float: right;
  display: block;
  position: relative;
  color: var(--attentionColor);
  line-height: 1;
  text-align: center;
  border-radius: 3px;
  background-color: var(--whiteColor);
}

.main .priceList li:before,
.main .priceList li:after {
  content: none;
}

#rainleaking .main .emergencyC {
  background: #eeeeee;
  padding: 0;
}

#rainleaking .main .emergencyC img {
  float: left;
  margin: 0 50px 0 0;
}

#rainleaking .main .emergencyC .tel {
  font-size: 13px;
  margin-top: 100px;
}

#rainleaking .main .emergencyC .tel span {
  overflow: hidden;
  font-size: 80px;
  line-height: 1;
  display: block;
  padding: 0 0 0 58px;
}

#rainleaking .main .emergencyC .tel span a {
  text-decoration: none;
}

#rainleaking .main .ranking {
  padding: 0;
  margin: 0 0 20px;
}

#rainleaking .main .ranking li {
  list-style: none;
  font-size: 25px;
  font-weight: bold;
  color: var(--attentionColor);
  margin: 0;
}

#rainleaking .main .catchTtl {
  font-size: 52px;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 30px;
}

.main .troubleBox h2 {
  position: relative;
  z-index: 10;
  padding: 15px 0 0;
  margin: 0 auto 15px;
  color: var(--blackColor);
  font-size: 32px;
  background: none;
  box-shadow: none;
  line-height: 1.2;
  position: relative;
  overflow: hidden;
  border: #00479d solid 7px;
  border-width: 7px 0 0 0;
}

.main .troubleBox h2 img {
  float: left;
  margin: 0 10px 0 0;
}

.main .troubleBox h2 span,
.main .diagnosisPoint h2 span {
  display: block;
}

.main .troubleBox h2 span.txtL,
.main .troubleBox h2 span.txtL span,
.main .diagnosisPoint h2 span.txtL {
  font-size: 48px;
}

.main .troubleBox h2 span.txtEn {
  color: #12a73b;
  font-size: 15px;
}

#diagnosis .main .troubleBox h2 {
  padding: 15px 0 0;
  margin: 0 auto 30px;
  color: var(--blackColor);
  font-size: 40px;
  line-height: 1.2;
  border-top: none;
  text-align: left;
  position: relative;
  overflow: hidden;
}

#diagnosis .main .troubleBox h2 span.icoTxt {
  border-radius: 50%;
  background: var(--attentionColor);
  color: var(--whiteColor);
  border: var(--attentionColor) solid 7px;
  font-size: 28px;
  width: 150px;
  height: 150px;
  text-align: center;
  line-height: 1.3;
  position: relative;
  float: left;
  padding: 0;
  box-sizing: border-box;
  margin: 0 15px 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

#diagnosis .main .troubleBox h2 span {
  display: inline-block;
  margin-left: 0;
}

#diagnosis .main .troubleBox h5 {
  margin: 0 0 10px;
}

.main .troubleBox h6:before {
  background: #22287f;
}

.main .troubleBox .attonP {
  font-size: 18px;
  font-weight: bold;
}

#diagnosis .main .troubleBox ol {
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
}

#diagnosis .main .troubleBox ol li {
  background: none;
  padding: 0;
  position: relative;
  overflow: hidden;
  padding-left: 35px;
  line-height: 1.8;
  font-size: 14px;
}

#diagnosis .main .troubleBox ol li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  background-color: #22287f;
  color: var(--whiteColor);
  display: block;
  float: left;
  line-height: 22px;
  margin-left: -30px;
  text-align: center;
  height: 22px;
  width: 22px;
  font-weight: bold;

  border-radius: 50%;
}

#diagnosis .main .troubleBox ol li h3 {
  font-size: 20px;
  clear: none;

  background: none;
  border-top: none;
  box-shadow: none;
  padding: 0;
  margin: 0 0 5px 0;
}

#diagnosis .main .troubleBox ul li {
  padding: 0;
}

#diagnosis .main .troubleBox ul li:before,
#diagnosis .main .troubleBox ul li:after {
  content: none;
}

#diagnosis .main .troubleBox ul li strong {
  font-size: 18px;
}

#diagnosis .main .troubleBox p.catchTxt {
  line-height: 1.5;
  font-size: 30px;
  font-weight: bold;
  color: var(--attentionColor);
  clear: both;
}

#diagnosis .main .troubleBox ul li h6 {
  margin: 10px 0 0 0;
}

#diagnosis .main .balloonBox {
  margin: 30px auto;
}

#diagnosis .main .balloonBox p {
  font-size: 30px;
  line-height: 1.8;
}

#rainleaking .main .troubleBox h5 {
  font-size: 30px;
  background: var(--primaryColor);
}

#diagnosis .main .cautionBox {
  background: var(--attentionColor);
  border-radius: 4px;
  color: var(--whiteColor);
  padding: 10px;
  position: relative;
  overflow: hidden;
}

#diagnosis .main .cautionBox h4 {
  color: var(--whiteColor);
  font-size: 31px;
  margin: 15px 0;
  padding-left: 0;
  display: inline-block;
}

#diagnosis .main .cautionBox p {
  color: var(--whiteColor);
  font-size: 18px;
}

#diagnosis .main .cautionBox ul {
  position: relative;
  overflow: hidden;
  float: right;
  margin: 0 0 0 25px;
}

#diagnosis .main .cautionBox ul li {
  float: left;
  margin: 0 0 0 10px;
  padding-left: 0;
}

#diagnosis .main .cautionBox h4:before,
#diagnosis .main .cautionBox h4:after,
#diagnosis .main .cautionBox ul li:before,
#diagnosis .main .cautionBox ul li:after {
  content: none;
}

.main .diagnosisAttention {
  margin: 50px 0;
}

.main .diagnosisAttention .formH {
  text-align: left;
  overflow: hidden;
  clear: none;
  margin-bottom: 2px;
  line-height: 1.3;
}

.main .diagnosisAttention p {
  color: #22287f;
  font-size: 20px;
}

.main .diagnosisAttention span {
  background: #22287f;
  border-radius: 50%;
  display: block;
  height: 200px;
  width: 200px;
  font-size: 40px;
  font-weight: bold;
  color: var(--whiteColor);
  text-align: center;
  padding-top: 50px;
  box-sizing: border-box;
  float: left;
  margin: -10px 30px 0 0;
}

.main .diagnosisAttention span strong {
  display: block;
  font-size: 100px;
  line-height: 0.6;
}

.main .diagnosisPoint {
  margin-bottom: 0;
  padding: 0;
}

.main .diagnosisPoint ol {
  counter-reset: diagnosispoint;
  padding-left: 0;
}

.main .diagnosisPoint li {
  counter-increment: diagnosispoint;
}

.main .diagnosisPoint li h3 {
  display: flex;
  align-items: center;
  color: var(--blackColor);
  font-size: 52px;
  line-height: 1.2;
  background: none;
  position: relative;
  overflow: hidden;
  padding: 0;
  padding: 15px 0;
  border: none;
  margin-bottom: 0;
}

.main .diagnosisPoint li h3 span {
  display: inline-block;
  width: calc(100% - 155px);
  margin-left: 20px;
}

.main .diagnosisPoint li h3:before {
  border-radius: 50%;
  background: var(--primaryColor);
  border: rgba(255, 255, 255, 0.5) solid 7px;
  content: "POINT\A" counter(diagnosispoint, decimal-leading-zero);
  color: var(--whiteColor);
  font-size: 34px;
  width: 135px;
  height: 135px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: pre;
  text-align: center;
  position: relative;
  font-family: "Bahnschrift", sans-serif;
  font-variation-settings: "wght" 500, "wdth" 90;
  line-height: 1;
}

.main .diagnosisPoint li h4 {
  overflow: hidden;
  font-size: 25px;
}

.main .diagnosisPoint li {
  margin-bottom: 50px;
  list-style-type: none;
  overflow: hidden;
}

.main .diagnosisPoint li img {
  float: left;
  margin: 0 20px 0 0;
}

.main .diagnosisPoint h2 {
  padding: 15px 0 0;
  margin: 0 auto 15px;
  color: var(--blackColor);
  font-size: 35px;
  background: none;
  box-shadow: none;
  line-height: 1.2;
}

.main .diagnosisPoint h4 {
  clear: none;
  margin-top: 0;
}

/*-------------------#apartment-----------------*/

#apartment .catchLrg {
  font-size: 50px;
  font-weight: bold;
  line-height: 1.3;
  margin-bottom: 20px;
}

#apartment .catchLrg img {
  float: left;
  margin: -15px 15px 15px 0;
}

#apartment .catchLtl {
  font-size: 30px;
  font-weight: bold;
  line-height: 1.5;
  margin-bottom: 20px;
}

#apartment .catchLtl strong {
  color: var(--attentionColor);
}

.main .priceUl {
  margin-bottom: 28px;
}

.main .priceUl li:before,
.main .priceUl li:after {
  display: none;
}

.main .priceUl li {
  padding-bottom: 5px;
  float: left;
  width: 486px;
  background-color: var(--whiteColor);
  border: 1px solid #e0d3bc;
  padding: 0;
}

.main .priceUl li .title03 {
  margin: 0 0 20px;
  padding: 5px 0;
  font-size: 23px;
  color: var(--whiteColor);
  font-weight: bold;
  text-align: center;
  background-color: #004088;
  border-bottom: 1px solid #e0d3bc;
}

.main .priceUl li .priceDl {
  margin: 0 8px 18px;
  border-bottom: var(--blackColor) dotted 1px;
}

.main .priceUl li .priceDl dt {
  padding: 7px 3px 5px;
  float: left;
  width: 54px;
  position: relative;
  color: var(--whiteColor);
  font-size: 20px;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  background-color: #4dbe53;
  border-radius: 5px;
}

.main .priceUl li .priceDl .dtStyle01 {
  padding: 17px 3px;
}

.main .priceUl li .priceDl .dtStyle02 {
  width: 250px;
  padding: 17px 3px;
}

.main .priceUl li .priceDl dd {
  padding: 0 15px 13px 68px;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: -1px;
}

.main .priceUl li .priceDl dd .txtTtl {
  font-size: 17px;
}

.main .priceUl li .priceDl dd .num {
  font-size: 1.9em;
}

.main .priceUl li .priceDl .ddStyle01 {
  padding: 15px 15px 20px 68px;
}

.main .priceUl li .priceDl .ddStyle01 .floatR {
  margin-top: -5px;
}

.main .priceUl li .priceDl .ddStyle02 {
  padding: 10px 15px 20px 260px;
}

.main .priceUl li .priceDl .red {
  padding-top: 2px;
  color: #e82c2c;
  font-size: 20px;
  text-align: right;
}

.main .priceUl li .none {
  margin-bottom: 0;
  border-bottom: none;
}

.main .priceUl li p {
  margin: 0 15px;
  font-size: 14px;
  line-height: 1.7;
}

/*-------------------#menu-----------------*/

.main .menuMain {
  position: relative;
}

.main .menuMain .imgLayer {
  bottom: 80px;
  left: 10px;
  z-index: 1;
}

.main .catchMenu {
  background: var(--primaryColor);
  font-weight: bold;
  font-size: 30px;
  color: var(--whiteColor);
  padding: 5px 15px;
}

.main .wallPartsBox {
  position: relative;
  overflow: hidden;
}

.main .wallPartsBox .floatL {
  width: 330px;
}

.main .wallPartsBox .floatR {
  width: 640px;
  text-align: center;
}

.main .wallPartsBox .catchTtl {
  text-align: center;
}

.main .wallPartsBox .catchTtl:after {
  content: none;
}

.main .wallPartsBox .catchTtl span {
  font-size: 45px;
}

.main .wallPartsBox .catchTtl .txtL {
  font-size: 130px;
  line-height: 1.2;
  margin: 0 0 10px;
  font-weight: bold;
  display: flex;
  justify-content: center;
}

.main .wallPartsBox .floatL .catchTtl {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .wallPartsBox .catchTtl .txtL span {
  /* border-radius: 50%; */
  background: var(--attentionColor);
  color: var(--whiteColor);
  width: 165px;
  height: 165px;
  font-size: 130px;
  font-weight: bold;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding-bottom: 10px;
}

.main .wallPartsBox p.txts {
  font-size: 14px;
  font-weight: bold;
}

.main .wallPartsBox h4 {
  background: #004ea2;
  color: var(--whiteColor);
  padding: 0;
  margin: 0 0 40px;
  margin: 0 0 10px;
  padding: 5px 0;
}

.main .wallPartsBox h4:before,
.main .wallPartsBox h4:after {
  display: none;
}

.main h2.menuCatch {
  background: none;
  font-size: 45px;
  box-shadow: none;
  color: var(--blackColor);
  text-align: center;
  line-height: 1.3;
  padding: 0 0 30px;
  margin-bottom: 30px;
}

.main h2.menuCatch:after {
  background: var(--blackColor);
  content: "";
  display: block;
  height: 15px;
  position: absolute;
  width: 490px;
  margin: 0 auto;
  bottom: 0;
  top: inherit;
  left: 50%;
  margin-left: -245px;
  border-radius: 0;
  border: none;
}

.main .itemBox h3 {
  background: none;
  border: none;
  display: inline-block;
  float: left;
  width: 740px;
  margin: 0;
  font-size: 30px;
  color: var(--blackColor);
  display: flex;
  align-items: center;
}

.main .itemBox h3 img {
  margin-right: 15px;
}

.main .itemPhoto {
  width: 217px;
  position: relative;
  overflow: hidden;
  float: right;
  color: #999;
  display: block;
}

.main .itemPhoto img {
  width: 100%;
  height: auto;
}

.main .itemPhoto p {
  color: var(--whiteColor);
  font-size: 40px;
  font-weight: bold;
}

.main .itemSummery {
  width: 740px;
  float: left;
}

.main .itemSummery p {
  font-size: 22px;
}

.main .itemSummery .leadTxt {
  position: relative;
  padding-right: 55px;
}

.main .itemSummery .leadTxt .imgIco {
  right: -140px;
  top: 140px;
  z-index: 5;
}

.main .itemSummery .leadTxt p {
  font-size: 25px;
  line-height: 1.5;
}

.main .itemSummery ul.menuAge {
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .itemSummery ul.menuAge li {
  background: none;
  padding: 0;
  text-align: center;
  font-weight: bold;
  display: flex;
  align-items: stretch;
  overflow: hidden;
  border: var(--blackColor) solid 1px;
  box-sizing: border-box;
  display: flex;
  align-items: stretch;
  width: 48%;
  width: calc(50% - 10px);
}

.main .itemSummery ul.menuAge li:before,
.main .itemSummery ul.menuAge li:after {
  content: none;
}

.main .itemSummery ul.menuAge li h5 {
  font-size: 20px;
  line-height: 2;
  margin: 0;
  background: var(--primaryColor);
  width: auto;
  padding: 15px 15px;
  border-radius: 0;
  box-sizing: border-box;
  width: 45%;
}

.main .itemSummery ul li.itemFeature {
  -webkit-flex-basis: 370px;
  flex-basis: 370px;
  margin-right: 0;
}

.main .itemSummery ul.menuAge li p {
  font-size: 20px;
  margin: 0;
  padding: 10px;
  background: var(--whiteColor);
  color: var(--blackColor);
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 55%;
}

.main .itemSummery ul li.itemFeature p {
  text-align: left;
  font-size: 18px;
}

.main .itemData {
  clear: both;
  margin-top: 20px;
  background: var(--primaryColor);
  padding: 30px;
}

.main .itemData h4 {
  color: var(--whiteColor);
  font-size: 35px;
  text-align: center;
  margin: 0 0 20px;
  padding: 0;
}

.main .itemData h4:before,
.main .itemData h4:after {
  display: none;
}

.main .itemData ul {
  position: relative;
  overflow: hidden;
  margin: 0;
}

.main .itemData ul li {
  border-radius: 5px;
  background: var(--whiteColor);
  padding: 25px 25px 70px;
  margin: 0 15px 0 0;
  position: relative;
  width: 303px;
  float: left;
  box-sizing: border-box;
}

.main .itemData ul li:nth-child(3n) {
  margin-right: 0;
}

.main .itemData ul li:before,
.main .itemData ul li:after {
  content: none;
}

.main .itemData ul li h5 {
  position: absolute;
  bottom: 0;
  left: 50%;
  background: #22287f;
  display: block;
  width: 200px;
  text-align: center;
  margin-left: -100px;
  padding: 3px;
  box-sizing: border-box;
}

.main .tileCotent {
  padding-bottom: 30px;
}

.main .tileCotent .btnWrap {
  text-align: center;
}

.main .tileCotent .btnWrap .btn {
  margin-bottom: 0;
}

/*-------------------#contact-----------------*/

#contact .main .msgTxt {
  font-size: 15px;
}

.main p.catchTxt+h4 {
  margin: 0;
}

#contact .main .msgTxt strong,
#contact .main .msgTxtOvr strong {
  display: inline-block;
  font-weight: bold;
}

.main .contactTelBox .catchTxt {
  font-size: 32px;
  font-weight: bold;
}

.main .contactTelBox .catchTxt strong {
  color: var(--attentionColor);
  background: none;
  font-weight: bold;
}

.main .contactTelBox .catchTxt span {
  background: var(--primaryColor);
  border-radius: 5px;
  color: var(--whiteColor);
  font-size: 24px;
  margin-right: 4px;
  display: inline-block;
  padding: 0 8px;
}

.main .contactTelBox .tel {
  font-size: 13px;
}

.main .contactTelBox .tel span {
  font-size: 80px;
  line-height: 1;
  display: block;
  padding: 0 0 0 58px;
}

.main .contactTelBox .tel .note {
  color: var(--blackColor);
  font-size: 18px;
  background: none;
  font-weight: normal;
  line-height: 1.6;
  padding-left: 66px;
  letter-spacing: 0.03em;
}

/*---------- calendar -----------*/

.business-calendar-box {
  position: relative;
  overflow: hidden;
}

.business-calendar-box>div {
  width: calc(50% - 10px);
  float: left;
}

.business-calendar-box>div:nth-child(2n) {
  float: right;
}

.main .business-calendar-box table th,
.main .business-calendar-box table td {
  width: 14%;
  padding: 5px 20px;
  text-align: center;
}

.business-calendar caption {
  background: #22287f;
  color: var(--whiteColor);
  font-weight: bold;
  font-size: 15px;
}

.business-calendar .attr0 {
  background: #ffcccc;
}

.main .corpAbout {
  box-sizing: border-box;
  padding: 50px 0 30px;
  background: url(./img/common/bg_basicknow.png) top repeat-x;
}

.main .corpAbout .inner {
  display: flex;
  justify-content: space-between;
  padding: 0;
}

.main .corpAbout .corpAbouTxt {
  width: 68%;
}

.main .corpAbout .corpAboutPic {
  width: 28%;
}

.main .corpAbout h2 {
  font-size: 25px;
  line-height: 1.4;
  margin-bottom: 15px;
  background: none;
  color: var(--blackColor);
  padding: 0;
  text-align: left;
}

.main .corpAbout h2 span {
  display: block;
  font-size: 20px;
  color: #8f8f8f;
}

.main .corpAbout p {
  font-size: 14px;
  line-height: 2;
}

.main .corpAboutLink li {
  margin: 12px 0 0 0;
  padding-left: 0;
}

.main .corpAbout .corpAboutLink a {
  padding: 6px 20px 6px 40px;
  font-size: 18px;
  display: block;
  border-radius: 5px;
  border: 2px #22287f solid;
  color: var(--whiteColor);
  font-weight: 500;
  background: #22287f;
  box-shadow: 0px 3px 0px 0px rgb(255 255 255 / 30%) inset;
  text-align: left;
  text-decoration: none;
}

.main .corpAbout .corpAboutLink li::before,
.main .corpAbout .corpAboutLink li::after {
  display: none;
}

.main .corpAbout .corpAboutLink a:before,
.main .corpAbout .corpAboutLink a:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.main .corpAbout .corpAboutLink a:before {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--whiteColor);
}

.main .corpAbout .corpAboutLink a:after {
  left: 15px;
  width: 5px;
  height: 5px;
  border-top: 2px solid #22287f;
  border-right: 2px solid #22287f;
  transform: rotate(45deg);
  z-index: 10;
}

/*------- 屋根カバー --------*/

.main ul.itemList3 {
  overflow: hidden;
}

.main ul.itemList3 li::after,
.main ul.itemList3 li::before {
  content: none;
}

.main ul.itemList3 li {
  float: left;
  padding: 0;
  width: 280px;
  padding: 15px 15px 0;
  border: 5px solid #22287f;
  border-radius: 10px;
  margin-right: 20px;
}

.main ul.itemList3 li:nth-of-type(3n) {
  margin-right: 0;
}

.main ul.itemList3 li h5 {
  margin: 0 0 10px 0;
  text-align: center;
  display: block;
}

.main .bnrMainte {
  background: var(--attentionColor);
  overflow: hidden;
}

.main .bnrMainte p {
  font-size: 35px;
  color: var(--whiteColor);
  font-weight: bold;
  padding: 0 0 0 20px;
}

.main .bnrMainte img {
  float: right;
}

/*------- #faq--------*/

.main .faqList>li {
  padding: 0;
  margin-bottom: 30px;
  position: relative;
  overflow: hidden;
}

.main .faqList li:before,
.main .faqList li:after {
  content: none;
}

.main .faqList li h3 {
  background: var(--primaryColor);
  border-bottom-color: var(--primaryColor);
  font-size: 28px;
  line-height: 1.5;
  padding: 20px 10px 20px 60px;
  position: relative;
  overflow: hidden;
  margin-bottom: 0;
  color: var(--whiteColor);
}

.main .faqList li h3:before {
  content: "Q";
  color: rgba(255, 255, 255, 0.4);
  font-size: 70px;
  position: absolute;
  left: 5px;
  top: -5px;
  line-height: 1;
}

.main .faqList li .ansBox {
  border: #ccc solid 1px;
  padding: 25px 30px 25px 60px;
  position: relative;
  overflow: hidden;
}

.main .faqList li .ansBox img {
  max-width: 100%;
  height: auto;
}

.main .faqList li h4 {
  margin-bottom: 10px;
}

.main .faqList li p:last-child {
  margin-bottom: 0;
}

.main .faqList li .txtL {
  font-size: 28px;
  position: relative;
}

.main .faqList li .ansBox:before {
  content: "A";
  color: var(--attentionColor);
  font-size: 70px;
  position: absolute;
  left: 5px;
  top: -25px;
  font-weight: bold;
  z-index: -1;
}

.main .faqList li ul {
  margin-bottom: 0;
}

.main .faqList li li {
  margin: 15px 0 0;
}

.main .photoUL.photoColumn2 li {
  width: 48%;
  width: calc(50% - 10px);
  flex-grow: inherit;
  margin: 0;
}

.main .photoUL.pictBA li:first-child:after {
  content: "";
  left: 98%;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 25px 0 25px 40px;
  border-color: transparent transparent transparent var(--blackColor);
  transform: none;
  z-index: 2;
}

/*----------#docrequest---------*/
.main .docList {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.main .docList li {
  width: 33%;
  width: calc(33% - 20px);
  padding: 0;
  margin: 0 0 20px;
  text-align: center;
}

.main .docList li:before,
.main .docList li:after {
  content: none;
}

.main .docList li h3 {
  text-align: center;
}

.main .pickupBnr {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 1000px;
  margin: 0 auto;
  padding: 30px 0 0;
}

.main .bg04 .pickupBnr {
  padding: 40px 0;
}

.main .pickupBnr li {
  width: 33%;
  width: calc(33% - 5px);
  padding: 0;
  margin: 0;
  text-align: center;
}

.main .pickupBnr li:before,
.main .pickupBnr li:after {
  content: none;
}

.main .talkBox {
  background: url(./img/common/bg_stripe.png) repeat center center,
    url(./img/common/talk_bg.jpg) no-repeat center center;
  background-size: auto, cover;
  margin-top: 1px;
}

.main .talkBox .inner {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 0;
}

.main .talkBox .inner a {
  display: block;
}

/*---------- #flow -----------*/

.main .flowBox .flowWorks {
  position: relative;
}

.main .flowBox .flowWorks ol {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  padding: 0;
  counter-reset: flowworks;
  margin-bottom: 0;
}

.main .flowBox .flowWorks ol>li {
  -ms-writing-mode: vertical-lr;
  writing-mode: vertical-lr;
  width: 108px;
  -webkit-writing-mode: vertical-lr;
  list-style: none;
  font-size: 25px;
  font-weight: bold;
  box-sizing: border-box;
  counter-increment: flowworks;
  position: relative;
  box-shadow: 3px 0px 3px 0px rgba(0, 0, 0, 0.2) inset;
  color: var(--whiteColor);
}

.main .flowBox .flowWorks ol>li a {
  text-decoration: none;
  color: var(--whiteColor);
  padding: 75px 30px 30px 38px;
  display: block;
}

.main .flowBox .flowWorks ol>li:nth-child(1) {
  background: #6281bf;
}

.main .flowBox .flowWorks ol>li:nth-child(2) {
  background: #6292bf;
}

.main .flowBox .flowWorks ol>li:nth-child(3) {
  background: #62afbf;
  width: 240px;
}

.main .flowBox .flowWorks ol>li:nth-child(4) {
  background: #62bfa6;
}

.main .flowBox .flowWorks li:nth-child(5) {
  background: #69bf62;
}

.main .flowBox .flowWorks li:nth-child(6) {
  background: #b5bf62;
}

.main .flowBox .flowWorks li:nth-child(7) {
  background: #bf8e62;
}

.main .flowBox .flowWorks li:nth-child(8) {
  background: #bf6262;
}

.main .flowBox .flowWorks li:nth-child(9) {
  background: #a14747;
}

.main .flowBox .flowWorks ol>li:before {
  content: counter(flowworks, decimal);
  writing-mode: horizontal-tb;
  -webkit-writing-mode: horizontal-tb;
  -ms-writing-mode: horizontal-tb;
  background: var(--whiteColor);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 25px;
  left: 40px;
}

.main .flowBox .flowWorks ol>li:nth-child(1):before {
  color: #6281bf;
}

.main .flowBox .flowWorks ol>li:nth-child(2):before {
  color: #6292bf;
}

.main .flowBox .flowWorks ol>li:nth-child(3):before {
  color: #62afbf;
}

.main .flowBox .flowWorks li:nth-child(4):before {
  color: #62bfa6;
}

.main .flowBox .flowWorks li:nth-child(5):before {
  color: #69bf62;
}

.main .flowBox .flowWorks li:nth-child(6):before {
  color: #b5bf62;
}

.main .flowBox .flowWorks li:nth-child(7):before {
  color: #bf8e62;
}

.main .flowBox .flowWorks li:nth-child(8):before {
  color: #bf6262;
}

.main .flowBox .flowWorks li:nth-child(9):before {
  color: #a14747;
}

.main .flowBox .flowWorks ol>li:after {
  width: 40px;
  height: 40px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  z-index: -1;
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  top: 25px;
  left: 81%;
  content: "";
  position: absolute;
  z-index: 1;
  box-shadow: 3px 2px 2px 0px rgba(0, 0, 0, 0.2);
}

.main .flowBox .flowWorks ol>li:nth-child(1):after {
  background: #6281bf;
}

.main .flowBox .flowWorks ol>li:nth-child(2):after {
  background: #6292bf;
}

.main .flowBox .flowWorks ol>li:nth-child(3):after {
  background: #62afbf;
  left: 91%;
}

.main .flowBox .flowWorks li:nth-child(4):after {
  background: #62bfa6;
}

.main .flowBox .flowWorks li:nth-child(5):after {
  background: #69bf62;
}

.main .flowBox .flowWorks li:nth-child(6):after {
  background: #b5bf62;
}

.main .flowBox .flowWorks li:nth-child(7):after {
  background: #bf8e62;
}

.main .flowBox .flowWorks li:nth-child(8)::after {
  content: none;
}

.main .flowBox .flowWorks ol ul {
  margin: 10px 0 0 10px;
}

.main .flowBox .flowWorks ol ul li {
  list-style: disc;
  margin: 0;
  padding: 0;
}

.main .flowBox .flowWorks ul li:before,
.main .flowBox .flowWorks ul li:after {
  content: none;
}

.main .flowBox .flowWorks .imgLayer {
  bottom: 60px;
  left: 400px;
}

.main .flowBox .flowPeriod {
  display: flex;
  justify-content: space-between;
  padding: 0;
  margin-top: 1px;
  overflow: hidden;
}

.main .flowBox .flowPeriod li {
  padding: 5px 5px;
  color: var(--whiteColor);
  list-style: none;
  text-align: center;
  font-size: 18px;
  background: var(--primaryColor);
  width: 60%;
  margin: 0;
}

.main .flowBox .flowPeriod li:last-child {
  background: var(--secondaryColor);
}

.main .flowBox .flowPeriod li:last-child:before {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 50px 50px;
  border-color: transparent transparent var(--secondaryColor) transparent;
  content: "";
  right: 100%;
  background: none;
  left: inherit;
  top: 0;
  bottom: inherit;
}

.main .flowBox p {
  font-size: 15px;
}

.main h2.ttl-flow {
  background: var(--secondaryColor);
  color: var(--whiteColor);
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  padding: 10px 10px 10px 250px;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.main h2.ttl-flow:after {
  content: none;
}

.main h2.ttl-flow span {
  background: var(--primaryColor);
  color: var(--whiteColor);
  padding: 20px;
  font-size: 30px;
  font-weight: 500;
  position: absolute;
  left: 0;
  margin: -10px 40px -10px 0;
}

.main h2.ttl-flow span:after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 130px 80px 0 0;
  border-color: var(--primaryColor) transparent transparent transparent;
  transform: none;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  top: 0;
  left: 100%;
  position: absolute;
}

.main .flowDetail .alignleft {
  margin: 0 30px 15px 0;
}

.main .flowDetail .alignright {
  margin: 0 0 15px 30px;
}

.main .flowDetail p {
  font-size: 18px;
}

/*---------- #talk -----------*/

.main .talkDetail .alignleft {
  margin: 0 30px 15px 0;
}

.main .talkDetail .alignright {
  margin: 0 0 15px 30px;
}

.main .talkDetail p {
  font-size: 18px;
}

.main .talkDetail dt {
  font-weight: bold;
  font-size: 18px;
  float: left;
}

.main .talkDetail dd {
  font-size: 18px;
  margin-bottom: 20px;
}

.main .talkDetail .catchTxt {
  line-height: 1.5;
  font-size: 30px;
  font-weight: bold;
}

.main .talkList ol li {
  font-size: 20px;
}

/*-----------------------------
ギャラリー
------------------------------*/
.gallery {
  /** ギャラリーを囲むボックス **/
  width: 100%;
  margin-bottom: 20px !important;
  overflow: hidden;
}

.gallery br {
  display: none;
}

/** 自動で挿入される clearfix の余白解除 **/

.gallery-item {
  /** 画像共通のスタイル **/
  float: left;
  margin-bottom: 0 !important;
}

.gallery-icon {
  /** 画像を囲む dt のスタイル **/
  text-align: center;
}

.gallery-icon img {
  width: 100%;
  height: auto;
  margin-bottom: 10px !important;
}

.gallery-caption {
  /** キャプション **/
  color: #222;
  font-size: 12px;
  margin: 0 0 10px;
  text-align: center;
}

.gallery-columns-1 .gallery-item {
  /** カラムなし **/
  width: 100%;
  margin-right: 0;
}

.gallery-columns-2 .gallery-item {
  /** 2カラム **/
  width: 48%;
  margin: 0 1%;
}

.gallery-columns-3 .gallery-item {
  /** 3カラム **/
  width: 31.33333%;
  margin: 0 1%;
}

.gallery-columns-4 .gallery-item {
  /** 4カラム **/
  width: 23%;
  margin: 0 1%;
}

.gallery-columns-5 .gallery-item {
  /** 5カラム **/
  width: 18%;
  margin: 0 1%;
}

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

  /* 640px以下用の記述 */
  .gallery-columns-3 .gallery-item,
  .gallery-columns-4 .gallery-item {
    width: 48%;
    margin: 0 1%;
  }

  .gallery-columns-5 .gallery-item {
    width: 31.33333%;
    margin: 0 1%;
  }
}

/*-----------------------------
分譲マンション大規模修繕
------------------------------*/
#condominium .contents {
  background-color: #f5f5f5;
}

#condominium .pageTitle h1 span {
  background-color: #111;
}

#condominium .main h2 {
  font-weight: 700;
  font-size: 37px;
  color: #111;
}

#condominium .main h2::after {
  background: #caaf4c;
}

#condominium .main h2.fullWidth {
  border-top: 10px solid #caaf4c;
}

#condominium .main h2.fullWidth::before {
  border-top-color: #caaf4c;
}

#condominium .contactBox {
  width: inherit;
  padding: 70px 50px;
  border: #111 dashed 1px;
  background-color: #c3c3c3;
  border-left: none;
  border-right: none
}

#condominium .contactBox .inner {
  padding: 0;
}

#condominium .contactBox .inBox {
  background-color: #111;
}

#condominium .contactBox h3 span {
  position: relative;
  top: -2px;
  margin-left: 2px;
  font-size: 17px;
}

#condominium .contactBox .inBox .contactBoxTxt {
  line-height: 1;
}

#condominium .contactBox .inBox .contactBoxTxt small {
  font-size: 13px;
}

#condominium .reasons {
  padding-bottom: 80px;
}

#condominium .reasonsLead {
  margin-top: 10px;
  margin-bottom: 0;
  font-size: 18px;
  text-align: center;
  line-height: 2;
  color: #111;
}

#condominium .reasonsBox {
  width: 1100px;
  margin: 0 auto;
}

#condominium .reasonsSec {
  margin-top: 80px;
}

#condominium .reasonsSec:first-of-type {
  margin-top: 60px;
}

#condominium .reasonsWrap {
  width: 820px;
  margin: 0 auto;
}

#condominium .reasonsTtl {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  padding: 0;
  border-bottom: none;
  font-size: 34px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  color: #111;
}

#condominium .reasonsTtl .reasonsNumber {
  position: relative;
  display: flex;
  align-items: center;
  width: 240px;
  height: 76px;
  padding: 10px 10px 10px 20px;
  background-color: #111;
  border-bottom: none;
  font-size: 30px;
  font-weight: bold;
  color: var(--whiteColor);
  box-sizing: border-box;
}

#condominium .reasonsTtl .reasonsNumber::after {
  content: "";
  position: absolute;
  right: -47px;
  top: 0;
  width: 47px;
  height: 76px;
  background: url(img/common/bg_reason_arrow_img02.png) 0 0 no-repeat;
}

#condominium .reasonsTxtWrap {
  width: calc(100% - 300px);
}

#condominium .reasonsTtl em {
  color: var(--attentionColor);
}

#condominium .reasonsPic {
  margin: 40px 0 0;
  text-align: center;
}

#condominium .reasonsTxt {
  margin: 30px 0 0;
  line-height: 2;
  color: #111;
}

#condominium .reasonsList {
  margin: 30px 0 0;
  max-inline-size: max-content;
  margin-inline: auto;
}

#condominium .reasonsList li {
  margin: 10px 0 0;
  font-size: 24px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  color: #111;
}

#condominium .reasonsList li::before {
  width: 19px;
  height: 19px;
  top: 50%;
  transform: translateY(-50%);
  left: -12px;
  background: url(img/common/pic_reason_arrow_img01.png) 0 0 no-repeat;
}

#condominium .reasonsList li:after {
  display: none;
}

#condominium .worries {
  padding: 40px 0;
}

#condominium .worries h2 {
  margin-bottom: 0;
  padding: 0;
  font-size: 37px;
  text-align: center;
  font-weight: bold;
}

#condominium .worries h2::after {
  display: none;
}

#condominium .worriesList {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 50px;
  margin-bottom: 0;
}

#condominium .worriesItem {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 350px;
  height: 230px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--blackColor);
  box-shadow: 0px 0px 2px inset var(--whiteColor);
  box-sizing: border-box;
}

#condominium .worriesItem01 {
  background: url(img/common/bg_worries_main_img01.png) 0 0/cover no-repeat;
}

#condominium .worriesItem02 {
  background: url(img/common/bg_worries_main_img02.png) 0 0/cover no-repeat;
}

#condominium .worriesItem03 {
  background: url(img/common/bg_worries_main_img03.png) 0 0/cover no-repeat;
}

#condominium .worriesItem04 {
  background: url(img/common/bg_worries_main_img04.png) 0 0/cover no-repeat;
}

#condominium .worriesItem05 {
  background: url(img/common/bg_worries_main_img05.png) 0 0/cover no-repeat;
}

#condominium .worriesItem06 {
  background: url(img/common/bg_worries_main_img06.png) 0 0/cover no-repeat;
}

#condominium .worriesItem:nth-child(n+4) {
  margin-top: 30px;
}

#condominium .worriesItem::before {
  width: 51px;
  height: 51px;
  top: 1px;
  left: 1px;
  background: url(img/common/bg_worries_icon_img01.png) 0 0 no-repeat;
}

#condominium .worriesItem::after {
  width: 51px;
  height: 51px;
  left: inherit;
  top: inherit;
  bottom: 1px;
  right: 1px;
  border: none;
  transform: none;
  background: url(img/common/bg_worries_icon_img02.png) 0 0 no-repeat;
}

#condominium .worriesItem p {
  margin: 0;
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  color: #111;
}


#condominium .works .inner {
  padding: 80px 0 40px;
}

#condominium .worksList .workColumn {
  width: calc(50% - 30px);
}

#condominium .worksList .workColumn:nth-child(even) {
  margin-right: 0;
}

#condominium .worksList .workColumn:nth-child(odd) {
  margin-right: 40px;
}

#condominium .main .archiveList h3 {
  height: inherit;
  color: #111
}

#condominium .main .archiveList .btnDetail {
  background-color: #111;
}

#condominium .message {
  margin-top: 50px;
}

#condominium .main .msgTxt h3 {
  position: relative;
  font-weight: bold;
  font-size: 30px;
  color: #111;
}

#condominium .message .overflowH p {
  color: #111;
}

#condominium .message .msgPhoto p {
  margin-bottom: 0;
  color: #111;
}

#condominium .main .msgPhoto h5 {
  background-color: #111;
}

#condominium .main .msgTxt h3::after {
  content: "";
  display: block;
  width: 50px;
  height: 1px;
  position: absolute;
  bottom: -10px;
  left: 0;
  margin: auto;
  background: #caaf4c;
}

#condominium .flow .fullWidth {
  padding: 50px 0 40px;
}

#condominium .flow .fullWidth span {
  display: inline;
  font-size: 47px;
  color: #caaf4c;
}

#condominium .flowLists {
  padding: 80px 60px;
}

#condominium .flowItem {
  display: flex;
  position: relative;
}

#condominium .flowItem:not(:first-of-type) {
  margin-top: 50px
}

#condominium .flowItem:not(:first-of-type)::before {
  content: "";
  position: absolute;
  left: 55px;
  top: -50px;
  width: 10px;
  height: 50px;
  background: url(img/common/pic_flow_icon_img01.png) 0 0 no-repeat;
}

#condominium .flowItem dt {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  background-color: #111;
  color: var(--whiteColor);
  font-size: 18px;
}

#condominium .flowItem dt span {
  position: relative;
  top: -2px;
  margin-left: 2px;
  font-size: 28px;
  font-family: "Noto Serif JP", serif;
}

#condominium .flowItem dd {
  width: calc(100% - 120px);
  background-color: var(--whiteColor);
  padding: 15px 30px;
}

#condominium .flowItemTtl {
  font-size: 24px;
  padding: 0;
  margin-bottom: 0;
  color: #111;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  border-bottom: none;
}

#condominium .flowItemTxt {
  margin-top: 6px;
  margin-bottom: 0;
  font-size: 16px;
  color: #111;
}

#condominium .form {
  margin-top: 1px;
}

#condominium .main .formBox th {
  background-color: #111;
}

#condominium .main #form ul li {
  color: #111;
}

.main .topMedal {
  position: relative;
  overflow: hidden;
  width: 1020px;
  margin: 30px auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.main .topMedal li {
  float: left;
  background: none;
  padding: 0;
  margin: 0;
}

.main .topMedal li::before,
.main .topMedal li::after {
  display: none;
}

.main .topMedal li img {
  display: block;
  margin: 0 auto;
}


/*施工マップ*/
.top_worksmap h2 {
  font-size: 39px;
}

.worksmap {
  margin-bottom: 30px;
}



.main .btn-wrap {
  margin: 30px 0;
  text-align: center;
}

.main .btn-wrap p {
  margin-bottom: 0;
}

.main .showroom_btn {
  text-align: center;
  margin: 30px 0 50px
}

.showroom_btn .btn,
.showroom_btn a.btn,
.showroom_btn .button.btn {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all .3s;
  transition: all .3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: .1em;
  color: #222;
  border-radius: .5rem
}

.singleWorks a.btn-custom01 {
  margin-bottom: .5rem;
  padding: 0;
  border-radius: .75rem;
  text-decoration: none;
  color: #fff;
}


a.btn-custom01:before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  -webkit-transition: all .3s;
  transition: all .3s;
  -webkit-transform: translate3d(0, .75rem, -1rem);
  transform: translate3d(0, .75rem, -1rem);
  box-sizing: border-box;
  border: 2px solid #222;
  border-radius: inherit;
  background: var(--primaryColor);
  -webkit-box-shadow: 0 .6rem 0 0 rgba(0, 0, 0, .2);
  box-shadow: 0 .6rem 0 0 rgba(0, 0, 0, .2)
}

a.btn-custom01:after {
  font-family: "Font Awesome 5 Free";
  font-size: 2rem;
  font-weight: 400;
  line-height: 1;
  position: absolute;
  top: calc(50% - 1rem);
  left: 1.5rem;
  margin: 0;
  padding: 0;
  content: "\f0e0"
}

.btn-custom01-front {
  position: relative;
  display: block;
  padding: 1.5rem 5rem;
  -webkit-transition: all .3s;
  transition: all .3s;
  border: 2px solid #222;
  border-radius: inherit;
  background: var(--primaryColor)
}

.fa-position-left {
  position: absolute;
  top: calc(50% - .5em);
  left: 1rem
}

.fa-position-right {
  position: absolute;
  top: calc(50% - .5em);
  right: 1rem
}

a.btn-custom01:hover {
  -webkit-transform: translate(0, .25rem);
  transform: translate(0, .25rem);
  background: var(--whiteColor)100
}

a.btn-custom01:hover:before {
  -webkit-transform: translate3d(0, .5rem, -1rem);
  transform: translate3d(0, .5rem, -1rem);
  -webkit-box-shadow: 0 .35rem 0 0 rgba(0, 0, 0, .2);
  box-shadow: 0 .35rem 0 0 rgba(0, 0, 0, .2)
}

a.btn-custom01:hover:after {
  content: "\f2b6"
}

a.btn-custom01:active {
  -webkit-transform: translate(0rem, .75rem);
  transform: translate(0rem, .75rem)
}

a.btn-custom01:active:before {
  -webkit-transform: translate3d(0, 0, -1rem);
  transform: translate3d(0, 0, -1rem);
  -webkit-box-shadow: 0 .35rem 0 0 rgba(0, 0, 0, .2);
  box-shadow: 0 .35rem 0 0 rgba(0, 0, 0, .2)
}

a.btn-custom01:active:after {
  content: "\f2b6"
}



/*-----------------------------
工場・倉庫
------------------------------*/

#factory .works .inner {
  padding: 20px 0 40px;
}

#factory .worksList .workColumn {
  width: calc(50% - 30px);
}

#factory .worksList .workColumn:nth-child(even) {
  margin-right: 0;
}

#factory .worksList .workColumn:nth-child(odd) {
  margin-right: 40px;
}

#factory .main .satisfaction {
  text-align: center;
}

#factory .main .satisfaction-ttl {
  margin-bottom: 30px;
}

#factory .main .satisfaction-list {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

#factory .main .satisfaction-list .box img {
  width: 100%;
  height: auto;
}

#factory .main .satisfaction-cmt {
  text-align: right;
  font-size: 12px;
}

#factory .main .packsummary .priceTxt {
  color: var(--attentionColor);
  font-size: 100px;
}

#factory .main .packsummary .priceTxt span.unitTxt {
  font-size: 42px;
  margin-left: 10px;
}

#factory .main .packsummary {
  width: 785px;
}

#factory .main .priceBlock {
  align-items: flex-start;
}

#factory .main .packList ul.optionalUl li {
  width: auto;
}

#factory .main .priceTaxin {
  text-align: left;
  font-size: 13px;
  line-height: 1.5;
  padding: 5px;
}

#factory .main .factorySTtl {
  text-align: center;
  font-size: 24px;
  font-weight: bold;
}

#factory .contactBox {
  width: inherit;
  padding: 70px 50px;
  border: #111 dashed 1px;
  background-color: #c3c3c3;
  border-left: none;
  border-right: none
}

#factory .contactBox .inner {
  padding: 0;
}

#factory .contactBox .inBox {
  background-color: #111;
}

#factory .contactBox h3 span {
  position: relative;
  top: -2px;
  margin-left: 2px;
  font-size: 17px;
}

#factory .contactBox .inBox .contactBoxTxt {
  line-height: 1;
}

#factory .contactBox .inBox .contactBoxTxt small {
  font-size: 13px;
}

.main .contactBox .inBox .btn.doc a {
  background: url(./img/common/ico_doc.png) no-repeat 15px center;
  background-size: 30px auto;
}




#factory .main .reasonList {
  display: flex;
  flex-wrap: wrap;
}

#factory .main .reasonList li:nth-child(3),
#factory .main .reasonList li:nth-child(6) {
  clear: none;
  margin-right: 0;
}

#factory .main .reasonList li:nth-child(2),
#factory .main .reasonList li:nth-child(5) {
  margin-right: 10px;
}

#factory .main .reasonList li {
  height: auto;
}

#factory .main .reasonList .reasonSummary {
  padding-top: 80px;
}

#factory .main .reasonList li h4:before {
  content: '';
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--whiteColor);
  position: absolute;
  left: 50%;
  top: -65px;
  margin: 0 0 0 -30px;
  border: none;
}

#factory .main .reasonList li:nth-child(1) h4:before {
  background: url(./img/common/gnav_ico_case_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList li:nth-child(2) h4:before {
  background: url(./img/common/gnav_ico_work_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList li:nth-child(3) h4:before {
  background: url(./img/common/gnav_ico_menu_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList li:nth-child(4) h4:before {
  background: url(./img/common/gnav_ico_reason_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList li:nth-child(5) h4:before {
  background: url(./img/common/gnav_ico_showroom_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList li:nth-child(6) h4:before {
  background: url(./img/common/gnav_ico_corporate_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}


#factory .main .reasonList.factoryFlowList .reasonSummary h4 span {
  font-size: 28px;
}

#factory .main .reasonList.factoryFlowList li .reasonSummary:before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid #f18f06;
  border-left: 0;
  border-bottom: 0;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 12px;
  margin-top: -28px;
  z-index: 10;
}

#factory .main .reasonList.factoryFlowList li:last-child .reasonSummary:before {
  content: none;
}

#factory .main .reasonList.factoryFlowList li:nth-child(1) h4:before {
  background: url(./img/common/gnav_ico_showroom_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList.factoryFlowList li:nth-child(2) h4:before {
  background: url(./img/common/gnav_ico_work_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList.factoryFlowList li:nth-child(3) h4:before {
  background: url(./img/common/gnav_ico_seminar_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList.factoryFlowList li:nth-child(4) h4:before {
  background: url(./img/common/gnav_ico_column_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList.factoryFlowList li:nth-child(5) h4:before {
  background: url(./img/common/gnav_ico_case_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList.factoryFlowList li:nth-child(6) h4:before {
  background: url(./img/common/gnav_ico_corporate_p.png) no-repeat center center var(--whiteColor);
  background-size: auto 23px;
}

#factory .main .reasonList.factoryFlowList .reasonSummary p {
  text-align: left;
  padding: 0 10px 10px;
}

.faqBox dt {
  padding: 10px 60px;
  font-size: 22px;
  font-weight: bold;
  background-color: #111;
  color: var(--whiteColor);
  margin-top: 15px;
  border: solid 1px #DDD;
  cursor: pointer;
  position: relative;
}

.faqBox dd {
  display: none;
  background-color: #efefef;
  padding: 15px 30px 15px 60px;
  border: solid 1px #DDD;
  position: relative;
}

.faqBox dt::before,
.faqBox dd::before {
  content: "Q";
  color: var(--whiteColor);
  position: absolute;
  top: 7px;
  left: 15px;
  width: auto;
  font-size: 36px;
  line-height: 1.0;
  border: none;
}

.faqBox dd::before {
  content: "A";
  color: var(--blackColor);
  font-weight: bold;
}

.faqBox dt::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  bottom: 0;
  display: block;
  margin: auto;
  height: 32px;
  content: "\f055";
  font-weight: 900;
  font-size: 28px;
  font-family: "Font Awesome 5 Free";
  line-height: 1;
  color: var(--whiteColor);
}

.faqBox dt.clicked::after {
  content: "\f056";
}

.hdrBtnDoc {
  padding-left: 15px;
  text-align: center;
  height: 118px;
}

.hdrBtnContact {
  padding-left: 5px;
  text-align: center;
  height: 118px;
}

.hdrBtnDoc a,
.hdrBtnContact a {
  display: inline-block;
  text-decoration: none;
  width: 152px;
  border: 2px solid var(--blackColor);
  background: var(--blackColor);
  border-radius: 10px;
  line-height: 1.4;
  padding: 12px 0;
  font-size: 16px;
  font-weight: bold;
  color: var(--whiteColor);
  box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  position: relative;
  margin-top: 22px;
}

.hdrBtnDoc a:before,
.hdrBtnContact a:before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border: 2px solid #f18f06;
  border-left: 0;
  border-bottom: 0;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  right: 8px;
  margin-top: -5px;
}


.featureContentsCont {
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
  margin-bottom: 40px;
}

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

.featureContentsCont .imgWrap {
  width: 480px;
}

.featureContentsCont .txtWrap {
  width: calc(100% - 520px);
}

.featureContentsCont:nth-of-type(2n) .imgWrap {
  order: 2;
}

.featureContentsCont:nth-of-type(2n) .txtWrap {
  order: 1;
}