@charset "UTF-8";

html {
  font-size: 62.5%;
  height: 100%;
}
body {
  color: var(--cm-main-tx-color);
  background-color: var(--cm-white-bg-color);
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  line-height: 1.8;
}
.mincho {
  font-family: 'Noto Serif JP', "游明朝体", YuMincho, "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", Georgia, Times, "Times New Roman", serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

.kosugiMaru {
  font-family: 'Kosugi Maru', 'Noto Serif JP', "游明朝体", YuMincho, "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", Georgia, Times, "Times New Roman", serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

.secularOne {
  font-family: 'Secular One', Georgia, Times, "Times New Roman", sans-serif;
}

.alert {
  color: var(--cm-danger-tx-color) !important;
}


/** メインの２カラーは下記にて

var(--bs-info)
var(--bs-dark)

**/
/* ----------------------------------------------
		 ローディング処理
------------------------------------------------- */
#loading {
  position: absolute;
  left: 50%;
  top: 50%;
}
#loader-bg {
  position: fixed;
  width: 100%;
  height: 100% !important;
  top: 0px;
  left: 0px;
  background: var(--cm-color-fff);
  z-index: 999999999;
}
/* ----------------------------------------------
		 文字色
------------------------------------------------- */
.tx-primary {
	color: var(--cm-primary-tx-color);
}
/* ----------------------------------------------
		 ボックス
------------------------------------------------- */
.box {
  height: 2.0em;
}
.box10 {
  height: 10px;
}
.box20 {
  height: 20px;
}
.box30 {
  height: 30px;
}
.box40 {
  height: 40px;
}
.box50 {
  height: 50px;
}
.box100 {
  height: 100px;
}
.anker {
  padding-top: 50px;
  margin-top: -50px;
}

/* ----------------------------------------------
		 エフェクト
------------------------------------------------- */
.fadein, .fdWrap {
  opacity: 0;
  transform: translateY(40px);
  transition: all 1.5s !important;
}
.fdWrap {
	overflow: hidden;
}
.fdChild {
  opacity: 0;
  transition: all 1.5s !important;
}
.fdChild.fdT {
  transform: translateY(-50px);
}
.fdChild.fdB {
  transform: translateY(50px);
}
.fdChild.fdL {
  transform: translateX(-200px);
}
.fdChild.fdR {
  transform: translateX(200px);
}
/* 通常aタグによるエフェクト */
a:hover {
  opacity: 0.9;
}

/* すべてのaタグのリンクを拒否 */
a {
  text-decoration: none;
  /*pointer-events:none;*/
}
a.no-link {
	pointer-events: none;
}


/* ホバーによるエフェクト */
.btnHv {
  transition: .3s;
}
.btnHv:hover {
  opacity: 0.75;
}
/* イメージホバーによる拡大エフェクト */
.btnImgHv img {
  transition: .3s;
}
.btnImgHv:hover {
  opacity: 1;
}
.btnImgHv:hover img {
  transform: scale(1.05);
}
/* ----------------------------------------------
		 トップページ
------------------------------------------------- */
body {
  overflow-x: hidden;
}

/************************
  header.header
************************/
header.header {
  width: 100%;
  height: auto;
  background-color: var(--cm-header-bg-color);
  border: 0px solid;
  /*height: calc(100vh - 100px);*/
}
header.header .header-inner {
  position: relative;
  width: 100%;
  height: auto;
}

/* ヘッダー上部　ロゴ・PCグロナビ　 */
header.header .header-inner .header-logo-nav {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 85px;
  color: var(--cm-color-fff);
  border: 0px solid;
}
header.header .header-inner .header-logo-nav h1 {
  margin: 0;
  padding: 0 0 0 15px;
}
header.header .header-inner .header-logo-nav h1 a {
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  width: 35vw;
  max-width: 450px;
  border: 0px solid;
}
header.header .header-inner .header-logo-nav h1 a img {
  width: 100%;
  height: auto;
  border: 0px solid;
}

header.header .header-inner .header-logo-nav ul.pc-view {
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  list-style-type: none;
  border: 0px solid #000;
}
header.header .header-inner .header-logo-nav ul.pc-view li {
  border: 0px solid #000;
}
header.header .header-inner .header-logo-nav ul.pc-view li a {
  display: block;
  margin: 7px 0.8vw;
  font-size: clamp(1.1vw, 1.2vw, 1.4rem);
  font-weight: 600;
  line-height: 1.2 !important;
  letter-spacing: 0.02em;
  text-align: center;
  color: var(--cm-main-tx-color);
  white-space: nowrap;
  transition: all 0.3s;

  position: relative;
  

}
header.header .header-inner .header-logo-nav ul.pc-view li:not(.login) {
	margin: 0 7px;
}
header.header .header-inner .header-logo-nav ul.pc-view li:not(.login) a {
	padding: 7px 0;
}
header.header .header-inner .header-logo-nav ul.pc-view li:not(.login) a::before {
  background: var(--cm-primary-tx-color);
  content: '';
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  bottom: 0;
  margin: auto;
  transform-origin: center top;
  transform: scale(0, 1);
  transition: transform .3s;
}
header.header .header-inner .header-logo-nav ul.pc-view li a:hover {
  color: var(--cm-primary-tx-color);
}
header.header .header-inner .header-logo-nav ul.pc-view li a:hover::before {
  transform-origin: center top;
  transform: scale(1, 1);
}
/* ログインボタン */
header.header .header-inner .header-logo-nav ul.pc-view li:last-child {
	margin-left: 10px;
}
header.header .header-inner .header-logo-nav ul.pc-view li:last-child a {
	display: flex;
	align-items: center;
  margin: 0px;
	padding: 0px 30px;
  color: var(--cm-color-fff);
	background-color: var(--cm-base-bg-color);
	height: 85px;
}

/* ヘッダー内罫線 */
header.header .header-inner hr {
  height: 1px;
  margin: 0 15px;
}

/* ヘッダー下部　PCサブナビ　 */
header.header .header-inner .header-second-nav {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 85px;
  border: 0px solid;
}
header.header .header-inner .header-second-nav ul {
  width: 100%;
  margin: 0;
  padding: 0 15px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  list-style-type: none;
  border: 0px solid #000;
}
header.header .header-inner .header-second-nav ul li {
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  border: 0px solid #000;
}
header.header .header-inner .header-second-nav ul li a {
  display: flex;
  align-items: center;
  padding: 0.5em 0.25em;
  width: 100%;
  font-size: clamp(1.1vw, 1.2vw, 1.4rem);
  font-weight: 600;
  line-height: 1.2 !important;
  letter-spacing: 0.02em;

  color: var(--cm-primary-tx-color);
  white-space: nowrap;
  transition: all 0.3s;
  
  overflow: hidden;
  position: relative;
  z-index: 1;
  border-radius: 7.5px;
  border: 0px solid #000;
}
header.header .header-inner .header-second-nav ul li a::after {
  background: var(--cm-primary-tx-color);
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: top;
  transition: .3s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}
header.header .header-inner .header-second-nav ul li a:hover {
  color: var(--cm-color-fff);
}
header.header .header-inner .header-second-nav ul li a:hover::after {
  transform: scale(1, 1);
}
header.header .header-inner .header-second-nav ul li a:hover p:first-child img {
  filter: brightness(500%);
}
header.header .header-inner .header-second-nav ul li a p {
  padding: 0;
  margin: 0;
}
header.header .header-inner .header-second-nav ul li a p:first-child {
  width: 4vw;
  max-width: 50px;
  min-width: 30px;
  margin-right: 0.5em;
}
header.header .header-inner .header-second-nav ul li a p:first-child img {
  width: 100%;
  transition: all 0.5s;
}



/************************
  グロナビ
************************/
.header .pc-view {
  display: block;
}
.header .sp-view {
  display: none;
}

/************************
  div.right-button
************************/
div.right-button {
  /*position: absolute;*/
	position: fixed;
  z-index: 101;

  right: 0;
}
div.right-button.btn1 {
  top: 20vh;
}
div.right-button.btn2 {
  top: calc(25vh + 270px);
}

div.right-button .rb {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 20px;
  border: 0px solid;
}
div.right-button .rb a {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0.75em 18px 0.75em 0.25em;
  position: relative;
  right: -15px;
  line-height: 1.4;
  letter-spacing: 0.2em;
  color: var(--cm-color-fff);
  background-color: var(--cm-orange-tx-color);
  border-radius: 7.5px 0px 0px 7.5px;
  transition: 0.3s all;
  
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  
  border: 0px solid;
}
div.right-button .rb a span {
  padding: 0 0.25em 0.5em 0.25em;
}
div.right-button .rb a img {
  width: 40px;
  height: auto;
}
div.right-button .rb:hover a {
  right: 0px;
}


/************************
  header.hero
************************/
header.hero {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 100%;
	height: 100%;
  /*height: calc(100vh - 85px);*/
  background-color: var(--cm-primary-tx-color);
  overflow-x: hidden; 
  border: 0px solid;
}

header.hero .container-fluid {
	max-width: 1200px;
	padding: 2.0em;
}

header.hero .hero-content {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	padding: 0 0.5em;
}
header.hero .hero-content div {
	color: var(--cm-color-fff);
}
header.hero .hero-content div.ttl-text {
	padding: 1.0em 0.5em;
}
header.hero .hero-content div h2 {
	font-size: 5.5rem;
	letter-spacing: 0.15em;
}
header.hero .hero-content div h2.ttl1 {
	/*text-indent: -1.7em;*/
}
header.hero .hero-content div h2.ttl2 {
	/*text-indent: 2.2em;*/
	width: 80%;
	position: relative;
	left: -3px;
	display: inline-block;
	padding: 1px 2px;
	line-height: 1 !important;
	letter-spacing: 0.0em;
	font-size: 5.5rem;
  font-family: "Metal", serif;
  font-style: normal;
	font-weight: 500;
	border: 1px solid var(--cm-color-fff);
}
header.hero .hero-content div.ttl-text .text {
	margin: 0 auto;
	width: 82%;
	text-align: left;
	font-size: 1.8rem;
	font-weight: 600;
	letter-spacing: 0.075em;
}

header.hero .hero-content div img {
/*	border: 3px solid var(--cm-color-fff);
	box-shadow: 0 0 3px var(--cm-sample-tx-color);
	border-radius: 5px;*/
}

/* アニメーション */
header.hero .hero-content .animation {
	overflow: hidden;
}
header.hero .hero-content .animation img {
	transition: .3s;
}
header.hero .hero-content .animation:hover img {
	/*transform: rotate(-5deg);*/
	transform: scale(1.1);
}
header.hero .hero-content #hc-anm1 {
	animation-name: hc-anm1;
	animation-delay: 1.0s;
	animation-duration: 1.5s;
	animation-fill-mode: forwards;
	transform: translateX(-50px);
	opacity: 0;
}
@keyframes hc-anm1 {
    0% {
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

header.hero .hero-content #hc-anm2 {
	animation-name: hc-anm2;
	animation-delay: 3.0s;
	animation-duration: 1.5s;
	animation-fill-mode: forwards;
	transform: translateX(-50px);
	opacity: 0;
}
@keyframes hc-anm2 {
    0% {
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

header.hero .hero-content #hc-anm3 {
	animation-name: hc-anm3;
	animation-delay: 2.0s;
	animation-duration: 1.5s;
	animation-fill-mode: forwards;
	transform: translateX(50px);
	opacity: 0;
}
@keyframes hc-anm3 {
    0% {
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

header.hero .hero-content #hc-anm4 {
	animation-name: hc-anm4;
	animation-delay: 4.0s;
	animation-duration: 1.5s;
	animation-fill-mode: forwards;
	transform: translateX(50px);
	opacity: 0;
}
@keyframes hc-anm4 {
    0% {
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

header.hero .hero-content #hc-anm5_1 {
	animation-name: hc-anm5_1;
	animation-delay: 5.0s;
	animation-duration: 1.5s;
	animation-fill-mode: forwards;
	transform: translateX(50px);
	opacity: 0;
}
@keyframes hc-anm5_1 {
    0% {
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}
header.hero .hero-content #hc-anm5_2 {
	animation-name: hc-anm5_2;
	animation-delay: 5.5s;
	animation-duration: 1.5s;
	animation-fill-mode: forwards;
	transform: translateX(-50px);
	opacity: 0;
}
@keyframes hc-anm5_2 {
    0% {
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}
header.hero .hero-content #hc-anm5_3 {
	animation-name: hc-anm5_3;
	animation-delay: 6.5s;
	animation-duration: 1.5s;
	animation-fill-mode: forwards;
	opacity: 0;
}
@keyframes hc-anm5_3 {
    0% {
    }
    100% {
        opacity: 1;
    }
}



/************************
  main
************************/
main {
  
}
main .main-inner {
  margin: 0em auto;
  padding: 2.0em 0;
  width: 100%;
  max-width: 1000px;
  text-align: center;
  
  border: 0px solid #000;
}
main .main-inner.wide1100 {
  max-width: 1100px;
}
main .main-inner.no-margin {
  margin: 0em auto 0em auto;
  padding: 4.0em 0;
}
main .main-inner.wide {
  width: 100%;
  max-width: 100% !important;
}
main .main-inner.bg-gray {
  background-color: var(--cm-header-bg-color);
}
main .main-inner.bg-water {
  background-color: var(--cm-water-bg-color);
}
main .main-inner.bg-light-green {
  background-color: var(--cm-light-green-bg-color);
}

main .main-inner h3 {
  font-family: 'Kosugi Maru', 'Noto Serif JP',  serif !important;
  color: var(--cm-primary-tx-color);
  font-size: 3.6rem;
  font-weight: bold;
}

main .main-inner h4 {
  font-size: 2.4rem;
  font-weight: bold;
}

main .main-inner .btn-common a {
  width: 100%;
  max-width: 300px;
  color: var(--cm-primary-tx-color);
  font-size: 1.6rem;
  font-weight: bold;
  padding: 0.5em 1.5em;
  border: 1px solid var(--cm-primary-tx-color);
  border-radius: 30px;
  background-color: var(--cm-color-fff);

  overflow: hidden;
  position: relative;
  z-index: 1;
}
main .main-inner .btn-common a.small {
  font-size: 1.4rem;
  padding: 0.2em 1.5em;
}
main .main-inner .btn-common a.no-bg {
  background-color: transparent;
}
main .main-inner .btn-common a::after {
  background: var(--cm-primary-tx-color);
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}
main .main-inner .btn-common a:hover {
  color: var(--cm-color-fff);
}
main .main-inner .btn-common a:hover::after {
  transform: scale(1, 1);
}


main .main-inner .btn-common-rev a {
  width: 100%;
  max-width: 300px;
  color: var(--cm-color-fff);
  font-size: 1.6rem;
  font-weight: bold;
  padding: 0.5em 1.5em;
  border: 1px solid var(--cm-primary-tx-color);
  border-radius: 30px;
  background-color: var(--cm-primary-tx-color);

  overflow: hidden;
  position: relative;
  z-index: 1;
}
main .main-inner .btn-common-rev a::after {
  background: var(--cm-color-fff);
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 100%;
  transform: scale(0, 1);
  transform-origin: top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  z-index: -1;
}
main .main-inner .btn-common-rev a:hover {
  color: var(--cm-primary-tx-color);
}
main .main-inner .btn-common-rev a:hover::after {
  transform: scale(1, 1);
}
main .main-inner .inner {
	margin: 0 auto;
	padding: 4.0em 0;
  max-width: 1000px;
}
main .main-inner .inner.max11 {
  max-width: 1100px;
}
main .main-inner .inner.max12 {
  max-width: 1200px;
}
main .main-inner .inner.max13 {
  max-width: 1300px;
}
main .main-inner .inner.pad1 {
	padding: 1em 0;
}
main .main-inner .inner.pad2 {
	padding: 2em 0;
}
main .main-inner .inner-box {
	padding: 1.0em;
}


/************************
  main -- お知らせ
************************/
#home-news {
  
}


#home-news table {
  margin: 2.0em 0;
  width: 100%;
  border-top: 1px solid var(--cm-main-tx-color); 
}
#home-news table th,
#home-news table td {
  padding: 1.0em;
  vertical-align: top;
  text-align: left;
  border-bottom: 1px solid var(--cm-main-tx-color);  
}
#home-news table th {


  font-weight: normal;
}
#home-news table td {

}
#home-news table th span.date {
  margin-right: 3.0em;
}
#home-news table th span.catego {
	display: inline-block;
  padding: 0.5em 2.0em;
  line-height: 1;
	min-width: 10em;
	font-size: 1.4rem;
	text-align: center;
  color: var(--cm-color-fff);
	border-radius: 5px;
  background-color: var(--cm-gray-tx-color);
}
#home-news table th span.catego.news {
  background-color: var(--cm-base-bg-color);
}
#home-news table th span.catego.maker {
  background-color: var(--cm-primary-tx-color);
}
#home-news .news-ydm {
  position: relative;
  margin-top: 1.5em;
  text-align: center;
  color: var(--cm-primary-tx-color);
}
#home-news .news-ydm::before {
  position: relative;
  top: 2px;
  left: -5px;
  content: "\F1FE";
  font-family: bootstrap-icons;
  font-weight: 400;
}

/************************
  main -- 施工事例
************************/
#home-works .slider-works .work-box {
	text-align: left;
  border: 0px solid;
}
#home-works .slider-works .work-box .ttl {
	padding: 1.0em 0;
	font-size: 2.0rem;
	font-weight: 600;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	/*background-color: var(--cm-water-bg-color);*/
}

#home-works .slider-works .work-box p {
  padding: 0;
  margin: 0;
  line-height: 1.5;
  font-size: 1.4rem;
}

#home-works .slider-works .work-box .b_a {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
#home-works .slider-works .work-box .b_a .before {
	width: 35%;
}
#home-works .slider-works .work-box .b_a .after {
	width: 62%;
}

#home-works .slider-works .work-box .b_a .before::before {
	position: relative;
	top: 5px;
	content: 'Before↓';
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	font-size: 2.4rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	color: var(--cm-primary-tx-color);
}
#home-works .slider-works .work-box .b_a .after::before {
	position: absolute;
	left: 0;
	width: 38%;
	padding-right: 5px;
	text-align: right;
	content: 'After→';
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	font-size: 2.4rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	color: var(--cm-color-fff);
	background-color: var(--cm-primary-tx-color); 
}

/*ホバーエフェクト*/
#home-works .slider-works .work-box .b_a img {
  transform: scale(1);
  transition: .3s ease-in-out;
}
#home-works .slider-works .work-box .b_a .before:hover img,
#home-works .slider-works .work-box .b_a .after:hover img {
  /*transform: scale(1.1);*/
  filter: brightness(125%);
}

#home-works .slider-works .work-box .method {
	margin: 1.0em 0;
	display: flex;
	justify-content: space-between;
}
#home-works .slider-works .work-box .method .m-name {
	display: flex;
	align-items: center;
	height: 2.5em;
	padding: 0.5em;
	font-size: 1.5rem;
	font-weight: 500;
	white-space: nowrap;
	color: var(--cm-color-fff);
	background-color: var(--cm-base-bg-color); 
}
#home-works .slider-works .work-box .method .m-detail {
	text-align: right;
	padding: 0.5em;
	font-size: 1.5rem;
/*	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;*/
	background-color: var(--cm-color-fff);
}


/************************
  main -- 防水改修ブログ
************************/
.home-blog .container-fluid {
  margin: 2.0em auto;
  max-width: 1200px;
}
.home-blog .container-fluid .wrap {
  padding: 2.0em;
  text-align: left;
  background-color: var(--cm-color-fff);
}
.home-blog .container-fluid .wrap h4 {
	font-size: 1.6rem;
	min-height: 2.5em;
}
.home-blog .container-fluid .wrap .txt {
  /*height: 5.5em;*/
  font-size: 1.4rem;
	color: var(--cm-main-tx-color);
	height: 3.5em;
	overflow: hidden;
}
.home-blog .container-fluid .wrap .yymmdd {
  font-size: 1.2rem;
	color: var(--cm-main-tx-color);
}
.home-blog .container-fluid .wrap .thumb {
  border: 0px solid var(--cm-efefef-bg-color);
}
.home-blog .container-fluid .wrap .thumb {
	display: flex;
	align-items: center;
  max-width: 100%;
  height:100%;
	min-height: 200px;
  margin: 0 0 0.5em 0;
  padding: 0;
  background: #fff;
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
.home-blog .container-fluid .wrap .thumb img {
  width: 100%;
  height: 100%;
}


/*ホバーエフェクト*/
.home-blog .container-fluid .wrap .thumb img {
  transform: scale(1);
  transition: .5s ease-in-out;
}
.home-blog .container-fluid .wrap .thumb:hover img {
  transition: .5s ease-in-out;
  transform: scale(1.1);

}

/* ブログ　Pick Up */
.home-blog .slider-blog {
	margin: 0 auto;
	width: 80%;
	background-color: var(--cm-color-fff);
}
.home-blog .slider-blog .blog-pickup-box {
	border: 0px solid;
	padding: 0;
	margin: 0;
}
.home-blog .slider-blog .blog-pickup-box a {
	display: flex;
	justify-content: center;
	padding: 2.0em 1.0em;
}
.home-blog .slider-blog .blog-pickup-box a > div {
	width: 50%;
}
.home-blog .slider-blog .blog-pickup-box a * {
	text-align: left;
}
.home-blog .slider-blog .blog-pickup-box a p,
.home-blog .slider-blog .blog-pickup-box a h4 {
	margin: 0;
	padding: 0 1.0em;
}

.home-blog .slider-blog .blog-pickup-box a h4 {
	font-size: 1.8rem;
	margin-bottom: 1.0em;
	line-height: 1.8;
}
.home-blog .slider-blog .blog-pickup-box a p {
	font-size: 1.6rem;
	color: var(--cm-main-tx-color);
}
.home-blog .slider-blog .blog-pickup-box a p.pickup {
	display: inline-block;
	margin: 0 0 1.0em 1.2em;
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--cm-color-fff);
	background-color: var(--cm-primary-tx-color);
}

/* スライダー装飾 */
.home-blog .slider-blog .slick-arrow {
	
	width: 50px;
	height: 50px;
	border: 2px solid var(--cm-primary-tx-color);
	border-radius: 50%;
	background-color: rgba(255,255,255,0.5);
	z-index: 5;
	transition: .5s;
}
.home-blog .slider-blog .slick-arrow:hover {
	background-color: rgba(255,255,255,1);
}
.home-blog .slider-blog .slick-prev::before,
.home-blog .slider-blog .slick-next::before {
	font-size: 18px;
  font-family: bootstrap-icons;
	color: var(--cm-primary-tx-color);
	opacity: 1;
}
.home-blog .slider-blog .slick-prev::before {
  content: "\F22D";
}
.home-blog .slider-blog .slick-next::before {
	content: "\F231";
}
.home-blog .slick-dots li button::before {
	font-size: 20px;
	content: '━';
}



/************************
  main -- 関連団体・関連情報
************************/
#home-banner .container-fluid {
  margin: 2.0em auto;
	padding: 4.0em 0;
  max-width: 1200px;
}
#home-banner .container-fluid .row > div {
  max-height: 120px;
}
#home-banner .container-fluid .row > div img {
  border: 1px solid var(--cm-main-tx-color);

}
#home-banner .container-fluid .row > div img.no-border {
  border: none;
}
#home-banner .container-fluid .row > div a.bn {
  display: block;
  margin: 0 auto;
  max-height: 120px;
	background-color: var(--cm-base-bg-color);
  /*background: linear-gradient(to bottom right, #01C935 30%, #CCFFD9); */
  max-width: 500px;
  border: 0px solid;
}


/************************
  フッター部　問合せボタン
************************/
#footer-contact {
	position: relative;
	display: flex;
	justify-content: center;
	z-index: 100;
}
#footer-contact .inner {
	position: absolute;
	padding: 2.5em;
	top: -65px;
	width: 100%;
	max-width: 1100px;
	border-radius: 10px;
	background-color: var(--cm-primary-tx-color);
	
	display: flex;
	justify-content: space-around;
}
#footer-contact .inner > div {
	color: var(--cm-color-fff);
}
#footer-contact .inner > div.left {
	font-size: 2.4rem;
	font-weight: 600;
}
#footer-contact .inner > div.right {
	font-size: 2.4rem;
}
#footer-contact .inner > div.right a {
	position: relative;
	display: flex;
	align-items: center;
	z-index: 10;
	
	border-radius: 10px;
	border: 1px solid var(--cm-primary-tx-color);
	background-color: var(--cm-color-fff);
	
	transition: .5s;
	transform-origin: left;
}
#footer-contact .inner > div.right a::before {
	content: "";
	position: absolute;
	display: block;
	background-color: var(--cm-primary-tx-color);
	width: 0;
	top: 0;
	bottom: 0;
	border-radius: 10px;
	-webkit-transition: .4s ease 0s;
	transition: .4s ease 0s;
	z-index: -1;
}
#footer-contact .inner > div.right a:hover {
	border: 1px solid var(--cm-color-fff);
}
#footer-contact .inner > div.right a:hover::before {
	width: 100%;
}

#footer-contact .inner > div.right a span {
	display: block;
	padding: 0.25em 3.0em;
	color: var(--cm-primary-tx-color);
	text-indent: 1em;
	border: 0px solid;
}
#footer-contact .inner > div.right a span::before,
#footer-contact .inner > div.right a span::after {
	position: absolute;
	top: 9px;
	font-family: bootstrap-icons;
	font-size: 1.6em;
	line-height: 1;
}

#footer-contact .inner > div.right a span::before {
	content: '\F133';
	left: 20px;
}
#footer-contact .inner > div.right a span::before {
	color: var(--cm-primary-tx-color);
}
#footer-contact .inner > div.right a:hover span {
	color: var(--cm-color-fff);
	position: relative;
	left: -1.0em;
	/*left: -1.0em;*/
}
#footer-contact .inner > div.right a:hover span::before {
	content: '';
}
#footer-contact .inner > div.right a:hover span::after {
	right: 15px;
	color: var(--cm-color-fff);
	content: '\F133';
}




/************************
  footer
************************/
footer {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0;
  height: auto;
}


footer .footer-inner-wrap,
footer .footer-copy {
  margin: 0;
  padding: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 0px solid;
	background-color: var(--cm-base-bg-color);
}

footer .footer-inner {
  width: 100%;
  padding: 2.0em 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  border: 0px solid;
}
footer.is_contact .footer-inner {
	padding: 7.0em 0 2.0em 0;
}
footer .footer-inner div.sns-icons {
  margin-bottom: 2.0em;
}
footer .footer-inner div.sns-icons i {
  font-size: 4.5rem;
	color: var(--cm-color-fff);
  margin: 0 0.2em;
}
footer .footer-inner ul.nav-bottom {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  border: 0px solid;
}
footer .footer-inner ul.nav-bottom li {
  padding: 0;
  margin: 0;
  text-align: left;
}
footer .footer-inner ul.nav-bottom li a {
  display: block;
  padding: 0 1.0em;
  font-size: 1.3rem;
  color: var(--cm-color-fff);
  text-decoration: none;
  line-height: 1.4;
}


footer .footer-inner > div ul {
  display: inline-block;
  list-style: none;
  padding: 0;
  margin: 0;
  border: 0px solid;
}
footer .footer-inner > div ul li {
  padding: 0;
  margin: 0;
  text-align: left;
}
footer .footer-inner > div ul li a {
  display: block;
  padding: 0.25em 0;
  opacity: 0.8;
  font-size: 1.3rem;
  color: var(--cm-color-fff);
  text-decoration: none;
  line-height: 1.4;
}
footer .footer-inner > div ul li a.bold {
  font-weight: bold;
}


footer .footer-line {

}
footer .footer-copy p {
  margin: 1.0em 3.0em;
  font-size: 1.2rem;
}
footer .footer-copy p a {
  color: var(--cm-color-fff);
  text-decoration: none;
}

/************************
  .page-top
************************/
/* ボタンのスタイル */
.page-top {
  /* buttonタグのリセットCSS */
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  /* ボタンの装飾 */
  position: fixed;
  right: -10px;
  bottom: 10px;
  z-index: 100;
  width: 65px;
  height: 55px;
  font-size: 1.6rem;
  color: var(--cm-info-tx-color);
  background-color: var(--cm-base-bg-color);
  background-image: url("../images/common/arrow_square.png");
  background-repeat: no-repeat;
  background-position: 40%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.3s ease;
  opacity: 0;
}
/* ホバー時のスタイル */
.page-top:hover {
  transform: translateX(-10px);

}
.page-top i {
  position: relative;
  top: 2px;

}

.page-top span {
  width: 100%;
  display: block;
  position: relative;
  padding: 0;
  line-height: 1.5;
  top: -3px;
  font-size: 1.8rem;
  border-top: 2px solid var(--cm-info-tx-color);
  border-bottom: 2px solid var(--cm-info-tx-color);
}


/************************
  フォーム関連
************************/
table.table-common-form input[type="text"],
table.table-common-form input[type="password"],
table.table-common-form input[type="email"],
table.table-common-form input[type="tel"],
table.table-common-form input[type="number"] {
  width: 100%;
}

/************************
  パーツ関連関連
************************/
/* ダウンロードアイコン */

.ico-area {
  font-size: 3.0rem;
  display: flex;
  flex-wrap: wrap;
}

a.icon {
  margin: 0 auto;
  padding: 0.5em;
  transition: all 0.5s;
}
a.icon.ico-pdf i {
  color: var(--cm-color-pdf);
}
a.icon.ico-doc i {
  color: var(--cm-color-doc);
}
a.icon.ico-xls i {
  color: var(--cm-color-xls);
}
a.icon.ico-nml i {
  color: var(--cm-color-nml);
}

a.link::before {
  padding-right: 0.25em;
  font-family: bootstrap-icons;
  color: var(--cm-color-nml);
}
a.link-out::before {
  content: '\F1C5';
}
a.link-in::before {
  content: '\F1C0';
}


/* テーブルレイアウト */
table.tbl-normal {
  margin: 2.0em 0;
  width: 100%;
  border-top: 1px solid var(--cm-main-tx-color); 
}
table.tbl-normal th,
table.tbl-normal td {
  padding: 1.0em;
  vertical-align: top;
  text-align: left;
  border-bottom: 1px solid var(--cm-main-tx-color);  
  
  word-break: break-all;
}

table.tbl-normal.jusify th {
  text-align: justify;
  text-align-last: justify;
  text-justify: inter-ideograph;
  white-space: nowrap;
}
body.about table.tbl-normal.jusify th {
  width: 25%;
  padding-right: 7.5em;
}

/* 番号リスト */
ol.num {
  list-style: none;
  counter-reset: number;
  padding-left: auto;
  margin: 0;
  border: 0px solid;
}
ol.num li {
  position: relative;
  left: -1.2em;
  padding-left: 1.75em;
  margin: 0.5em 0;
}
ol.num li::before {
  counter-increment: number;
  content: counter(number);
  position: absolute;
  top: 3px;
  left: -2px;
  width: 1.6em;
  height: 1.6em;
  font-weight: 600;
  border: 0px solid var(--cm-main-tx-color);
  border-radius: 50%;
  background-color: var(--cm-efefef-bg-color);
  text-align: center;
  line-height: 1.5;
  letter-spacing: 0em;
}

ol.num.ol-about-2 {
  list-style: none;
  counter-reset: number 5;
}
ol.num.ol-about-2 li::before {
  counter-increment: number;
}