@charset "utf-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用　＞　クラシックテーブル02
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.table02 table {
    border-spacing: 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
top > 新築
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*2カラムカルーセル > 矢印*/
#home_shinchiku.cmn_carousel_2col :is(.slick-prev,.slick-next):before {
    content: '\e917'!important;
    font-size: 32px;
    width: fit-content;
}

#home_shinchiku.cmn_carousel_2col :is(.slick-disabled):before{
	color: #8c8c8c!important;
    border: 0;
    right: 0;
}

/*2カラムカルーセル > ドット*/
/*#home_shinchiku.cmn_carousel_2col ul.slick-dots {
	bottom: -50px;
}*/

#home_shinchiku.cmn_carousel_2col :is(.slick-prev,.slick-next) {
    top: calc(100% + 30px);
}


#home_shinchiku.cmn_carousel_2col .slick-dots li button:before {
    color: #a0a0a0;
    opacity: 1;
    font-size: 6px;
	
}

#home_shinchiku.cmn_carousel_2col .slick-dots li.slick-active button:before {
    color: var(--main);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
top > リフォーム
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*全画面カルーセル > 矢印*/
#home_reform.cmn_carousel_full :is(.slick-prev,.slick-next) {
    top: calc(100% + 40px);
    z-index: 1;
}

#home_reform.cmn_carousel_full .slick-prev{
	left: 30%;
}

#home_reform.cmn_carousel_full .slick-next {
	right: 30%;
}

#home_reform.cmn_carousel_full :is(.cmn_carousel_full .slick-prev,.slick-next):before {
	content: '\e917'!important;
	font-size: 32px;
	border: 0;
}

#home_reform.cmn_carousel_full :is(.slick-disabled):before{
	color: #8c8c8c!important;
}


#home_reform.cmn_carousel_full.slick-prev:before {
    transform: scale(-1, 1);
}

/*全画面カルーセル > ドット*/
#home_reform.cmn_carousel_full ul.slick-dots {
	bottom: -55px;
}

#home_reform.cmn_carousel_full .slick-dots li button:before {
    color: #a0a0a0;
    opacity: 1;
    font-size: 6px;
}

#home_reform.cmn_carousel_full .slick-dots li.slick-active button:before {
    color: var(--main);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
top > お知らせ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_news .gb-tabs__button[aria-selected="true"] {
    color: var(--main);
}

#home_news .gb-tabs__button[aria-selected="false"] {
	color: #808080;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
フッター
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#footer-widgets ul.menu > li {
    font-weight: 500;
}

#footer-widgets a.map_btn {
    color: var(--main);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層 > 施工事例
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* カレント */
body[class*='works'] ul:not(.sub-menu) > li.works:not(.contact) > a,
body:is(.single-post, .category) .inside-navigation ul:not(.sub-menu) li.hnav_post:not(.contact) > a{
	color: var(--main);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層　＞　スティッキーのための記述
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*トップにも記述すると横がはみ出すため下層のみ */
body:is(.page-concept, .page-custom-home) .body_inner {
overflow-x: visible !important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
チャイルドナビ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.h_child_navi ul.child_navi {
	gap: 20px;
    border-radius: 0;
}

.h_child_navi ul.child_navi a {
    background-color: var(--base-2);
	border: 1px solid #dadada;
	color: var(--text);
}

.h_child_navi ul.child_navi a:hover,
.h_child_navi ul.child_navi li[class*='current'] a {
    background-color: var(--main);
	border: 1px solid var(--main);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップへ戻るボタン
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
a.generate-back-to-top{
	border: 2px solid var(--main);
}

a.generate-back-to-top .gp-icon svg {
    fill: var(--main);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ハンバーガーメニューのカスタマイズ(2023-03-13mk)
↓↓↓下記をまずは削除した上で、【https://coco-factory.jp/ugokuweb/move01-cat/humbugermenu/】から、お好みのボタンのCSSを追加
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*ボタン外側※レイアウトによってpositionや形状は適宜変更してください*/
.openbtn{
	position: relative;/*ボタン内側の基点となるためrelativeを指定*/
	background:transparent;
	cursor: pointer;
	width: 50px;
	height:50px;
	border-radius: 5px;
}

/*ボタン内側*/
.openbtn span{
	display: inline-block;
	transition: all .4s;/*アニメーションの設定*/
	position: absolute;
	left: 14px;
	height: 2px;
	border-radius: 2px;
  background:var(--main);
	width: 45%;
}

.openbtn span:nth-of-type(1) {
	top:15px; 
}

.openbtn span:nth-of-type(2) {
	top:23px;
}

.openbtn span:nth-of-type(3) {
	top:31px;
}

/*activeクラスが付与されると線が回転して×に*/

.openbtn.active span:nth-of-type(1) {
	top: 18px;
	left: 18px;
	transform: translateY(6px) rotate(-45deg);
	width: 30%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;/*真ん中の線は透過*/
}

.openbtn.active span:nth-of-type(3){
	top: 30px;
	left: 18px;
	transform: translateY(-6px) rotate(45deg);
	width: 30%;
}

/*トップ*/
.home #mobile-header:not(.is_stuck) .openbtn span{
	background: #fff;
}

/*トップ*/
.home #mobile-header:not(.is_stuck) .mobile_header_icon .bl {
	background: transparent;
	border: 1px solid #fff;
}

/*電話アイコン*/
.home #mobile-header:not(.is_stuck) .mobile_header_icon :is(.tel, .mail) {
	background: transparent;
	border: 1px solid #fff;
}