@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@font-face {
    font-family: "kunstler";
    src: url('../cyber-child/font/kunstler.woff') format('woff');
}

@font-face {
    font-family: "calistomtkursiv";
    src: url('../cyber-child/font/calistomtkursiv.woff') format('woff');
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
目次デザイン
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#toc_container {
	border: 1px solid #cdcdcd!important;
	border-top: 4px solid #54131B!important;
	width:100%!important;
	/* カウンター */
    counter-reset: num 0;
    padding: 0 25px!important;
	margin-top:15px!important;
}

#toc_container:not(.contracted) {
	padding-bottom: 20px!important;
}

#toc_container span.toc_toggle {
    background: none;
    font-weight: bold!important;
    color: #626262;
    font-size: 15px!important;
	margin-left: 0;
}

#toc_container .toc_toggle a {
    color: #6a6a6a;
}

#toc_container p.toc_title + ul.toc_list {
	border: none;
	padding: 0;
}

#toc_container ul.toc_list > li > a {
	position: relative;
	padding: 0px 0px 0px 35px;
	margin-bottom: 5px;
	display: inline-block;
	color:#54131B;
}

#toc_container ul.toc_list > li::before{
	counter-increment: num;
	content: counter(num);
	width: 25px;
	height: 25px;
	border-radius: 50%;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1.6em;
	color: #fff;
	background: #54131B;
	font-family: Bebas Neue, display;
	font-weight: normal;
	margin-top: 3px;
}

/*孫リスト*/
#toc_container .toc_list li ul{
	padding-left: 30px;
	display: flex;
	flex-direction: column;
	margin: 0;
}

#toc_container ul.toc_list li ul li{
	position: relative;
	padding-left: 25px;
	margin-bottom: 0px;
	display: inline-flex;
}

#toc_container > ul.toc_list > li > a{
	font-weight:bold;
}

#toc_container ul li ul li::before{
	content: "-";
	width: 14px;
	height: 2px;
	position: absolute;
	top: -2px;
	left: 10px;
	background: var(--main);
}

#toc_container ul li ul li a{
	color:#54131B;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
「booking-package」予約プラグイン
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* ボタン（全フェーズ共通） */
#booking-package button {
    font-family: "my_mincho",serif;
    background: #57141d;
    padding: 10px;
    color: #fff;
    min-width: 150px;
	max-width: 400px;
}

/* ボタン（前日、翌日への切替ボタン）※不要なので削除 */
/*#returnDayButton, #nextDayButtton {
    display: none;
}*/
/* 「次の週」「前の週」ボタン */
:is(#previous_available_day_button,#next_available_day_button){
	display: none!important;
}


/* ボタン（予約確定or戻る、最終フェーズのボタン） */
#booking-package_inputFormPanel .returnButton {
    max-width: 400px;
    display: block;
    margin: 0 auto;
}

/* 日付の選択フェーズ */
div#daysListPanel [class*="selectPanel"] {
    text-align: center;
}

div#daysListPanel [class*="selectPanel"] > *:first-child {
    display: none;
}

div#daysListPanel [class*="selectPanel"] > *:last-child:after {
    content: ' 日';
}

/* 時間の選択フェーズ */
/*div#scheduleMainPanel .selectPanel span:first-child:after {
    content: '◯';
}

div#scheduleMainPanel .selectPanelError span:first-child:after {
    content: '✕';
}*/
#booking-package .selectable_time_slot:not(.closed) span.timeSlot::after{
	 content: '◯';
}
#booking-package .selectable_time_slot.closed span.timeSlot::after{
	 content: '✕';
}
div#booking-package_pay_locally,
#booking-package_inputFormPanel .bottomBarPanel{
	text-align: center;
}

/* カレンダー　＞　「休日」の色変更 */
#booking-package_calendarPage div.holidayPanel {
    background-color: #eeeeee!important;
}

/* テキストフィード */
#booking-package_inputFormPanel input[type=text] {
    max-width: 500px;
}

#booking-package_inputFormPanel textarea {
    height: 100px;
}

#booking-package_calendarPage .symbolPanel, #booking-package_calendarPage .numberInsteadOfSymbols {
    padding: 5px 0!important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用スタイル　＞　画像がない場合の汎用スタイル（一覧ページ／ショートコード／関連記事…などで共有）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.noimage {
    background-size: 20% auto;
    background-position: 50%;
    background-color: #ccabab;
 }
 
 /* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用スタイル　
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
table span.small {
    display: inline-block;
    font-size: .9em;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用スタイル　＞　サイトのテーマ色を一括指定する
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 文字色 */
body.sp[class*="voice"] ul.child_navi a[href*="voice"], body.sp dl.type01 [class*="current"] > a, body.sp dl.type01 dt, a.basic_btn02, .basic_list01 li:before, ol.basic_list02 > li:after, a.basic_color_font, [class*="current"] .basic_color_font_cur, [class*="current"] .basic_color_font_cur:hover, .basic_color_font_bf:before, .basic_color_font_af:after {
    color: #58141d;
}

/* ボーダー色 */
body.sp dl.type01 > dt .arrow, h3[class*="h3a"], h2[class*="h2a"], .basic_box02, .basic_list02 > li, .basic_color_border, .basic_color_border_bg:before, .basic_color_border_af:after {
    border-color: #58141d;
}

/* 背景色 */
a.basic_btn01, h3[class*="h3b"], ol.basic_list02 > li:before, .basic_color_bg, .basic_color_bg_bf:before, .basic_color_bg_af:after {
    background-color: #58141d;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用　検索窓（ヘッダー、フッター、サイドバー）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*form#searchform input[type="text"] {
    font-family: "my_mincho", serif;
}*/
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
スニペット　＞　写真・タイトル・テキスト
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*---横2列---*/
[class*="cmn_items_list_box"] .ttl {
    font-family: "my_mincho", serif;
    font-weight: normal;
}

/*---横2列横並び---*/
.cmn_items_list_box_side .ttl {
    font-family: "my_mincho", serif;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ビジュアルエディタ　＞　よくある質問(定義リストver.)
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
dl.faq > dt {
    font-family: "my_mincho", serif;
    font-weight: normal;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
投稿系一覧ページ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
ul.post_archive li .area_b {
    font-family: "my_mincho", serif;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
メインエリア
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#main_area .article_date_area {
    font-family: "my_mincho", serif;
}

#main_area .article_title.plain_type h1 {
    font-weight: normal;
    font-family: "my_mincho", serif;
}

#main_area .article_meta_area {
    margin: 50px auto 50px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ページ送りを止めてローカルナビに変更（固定ページ）2020-09-27mk
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
ul.local_navi3 > li > a {
    font-family: "my_mincho", serif;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
施工事例 ＞ 詳細ページ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
body.single-works #main_area .article_title.plain_type p.cat span a {
    display: inline-block;
    font-size: 14px;
    padding: 4px 10px;
    color: #fff;
    background: #57141d;
    text-decoration:none;
}

body.single-works #main_area .article_title.plain_type h1 {
    border-color: #d2bebe;
    padding-top:10px;
}

body.single-works #main_area .article_title.plain_type p.tag_wrap > span {
    display: inline-block;
    font-size: 13px;
    background:#d6b4ab;
    padding: 4px 15px;
    border-radius:5px;
    color:#fff;
    margin-right: .5em;
}

body.single-works #main_area .article_title.plain_type h1 .tag_wrap > span.cat a {
    color: inherit;
    text-decoration:none;
}

body.single-works #main_area .article_title p.works_place {
    text-align: right;
    font-size: 18px;
    font-family: "my_mincho", serif;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
施工事例 ＞ 詳細ページ ＞ Slickスライダー
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* コントロール（「次へ」「前へ」）のカスタマイズ */
body.single-works .slick-prev, body.single-works .slick-next {
    border: 0 solid rgba(0, 0, 0, 0.8);
    border-top-width: 3px;
    border-right-width: 3px;
    z-index: 1;
    width: 30px;
    height: 30px;
    top: 245px;
    border-radius: 0;
}

body.single-works .slick-prev {
    transform: rotate(-135deg);
    left: 0;
}

body.single-works .slick-next {
    transform: rotate(45deg);
    right: 0;
}

body.single-works .slick-prev:before, body.single-works .slick-next:before {
    display: none;
}

body.single-works .slick-slider {
    margin: 30px auto 2.5em;
}

/* スライダー　メイン画像 */
.slick li:focus {
    outline: none;
}

body.single-works .slick-list .img_container {
    width: 75%;
    padding-top: 50%;
    margin: 0 auto;
}

body.single-works .slick-list .img_container img {
    object-fit: contain;
}

body.single-works .slick-list .img_container a {
    position: static;
}

body.single-works .slick-list .img_container [rel=lightbox]:after {
    display: none;
}

body.single-works .slick-list p.caption {
    text-align: center;
}

/* スライダーのサムネイルリスト */
body.single-works .slick-dots {
    position: static;
    width: calc(100% + 10px);
    margin: 20px -5px 0;
    text-align: left;
}

body.single-works .slick-dots li {
    width: 89px;
    position: relative;
    padding-top: 89px;
    overflow: hidden;
    margin: 0 5px;
}

body.single-works .slick-dots li img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    /* 画像の高さを画像コンテナの高さに収める（4:3画像がアップされた場合に隙間が空かない様に考慮し、15%のゆとりを持たせる） */
    /* height: 115%!important; */
    /* width: auto; */
    height: 100%!important;
    width: 100%;
    /* ▼background-size:cover的に動作する */
    object-fit: cover;
    /* IE対策（併せて「ofi.js」を読み込むことではじめて正しく機能する） */
    font-family: 'object-fit: cover;';
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　プロモ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
div#promo_frame {
    display: flex;
    align-items: center;
    justify-content: center;
}

div#promo_frame .inner {
    text-align: center;
    color: #fff;
    font-family: "my_mincho", serif;
    margin-bottom: 15px;
}

div#promo_frame .inner p.since {
    background-color: #58141d;
    font-size: 24px;
    letter-spacing: 0.2em;
    padding: 10px 40px;
    min-width: 700px;
    display: inline-block;
    margin-bottom: 25px;
}

div#promo_frame .inner h2.main_ttl {
    font-size: 66px;
    letter-spacing: 0.05em;
    line-height: 1.3;
    margin-bottom: 25px;
    text-shadow: 0px 0px 7px rgba(36,20,10,.6);
}

div#promo_frame .inner p.sub_ttl {
    font-size: 40px;
    letter-spacing: 0.2em;
    text-shadow: 0px 0px 7px rgba(36,20,10,.6);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層ページ　＞　ヘッダー画像
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.page_promo .img_wrap {
    height: 450px;
    max-height: 50vh;
}

body[class*="works"] .page_promo .img_wrap {
    background: url(images/header_works.jpg) no-repeat 50% 50%/cover;
}


body[class*="works"] .page_promo .img_wrap img {
    display: none;
}

.page_promo .ttl {
    font-weight: normal;
    font-size: 30px;
    max-width: 1200px;
    margin: 0 auto;
    color: #fff;
    font-family: "my_mincho", serif;
}

.page_promo .sub_ttl {
    display: none;
}

.page_promo .slug {
    display: block;
    color: #fff;
    font-family: "kunstler";
    font-size: 80px;
    font-weight: normal;
    text-transform: capitalize;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　一言コメント
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.tweet_area {
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: rgba(255,255,255,0.9);
    font-size: 16px;
    font-family: "my_mincho", serif;
}

.tweet_area .f_wrap {
    max-width: 770px;
    padding: 5px 15px;
    align-items: center;
}

.tweet_area .f_wrap > * {
    padding: 20px 0;
}

.tweet_area .icon {
    color: #58141d;
    letter-spacing: 0.1em;
}

.tweet_area ul.items li {
    color:#58141d;
}

.tweet_area .date {
    color:#151515;
}

.tweet_area .ttl a {
    text-decoration: underline;
    color:#58141d;
}

.tweet_area .ttl a:hover {
    text-decoration: none;
}

.tweet_area .more a::after {
    font-family: "icomoon";
    content: '\e91b';
    font-size: 1em;
    position: absolute;
    top: calc(50% - .5em);
    line-height: 1;
    right: 10px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ビジュアルエディタ　＞　汎用見出し
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* [.h2a]のスタイル */
h2[class*="h2a"] {
    padding: 0;
    border: none;
    text-align: center;
    position: relative;
    font-size: 30px;
    font-family: "my_mincho", serif;
    padding: 35px 0 0 0;
}

h2[class*="h2a"]::before {
    content: '';
    background: url(images/h2a_kazari.png) no-repeat 50% / contain;
    position: absolute;
    width: 28px;
    height: 24px;
    left: calc(50% - 14px);
    top: 0;
}

/* [.h2b]のスタイル */
h2[class*="h2b"] {
    font-size: 26px;
    font-family: "my_mincho", serif;
    text-align: left;
    background: url("images/h2b_bg.jpg") no-repeat left/cover;
    padding-top: 0;
    padding-left: 22px;
    padding: 12px 30px;
}

h2[class*="h2b"]::before {
    display: none;
}

/* [.h3a][.h3b]共通のスタイル */
h3[class*="h3"] {
    font-size: 22px;
}

/* [.h3a]のスタイル */
h3[class*="h3a"] {
    padding: 12px 25px;
    border: none;
    background-color: #54131b;
    color: #fff;
    font-family: "my_mincho", serif;
}

/* [.h3b]のスタイル */
h3[class*="h3b"] {
    color: inherit;
    font-family: "my_mincho", serif;
    padding: 12px 10px;
    background-color: inherit;
    border-top: 1px solid #54131b;
    border-bottom: 1px solid #54131b;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ビジュアルエディタ　＞　汎用ボックス
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.basic_box01 {
    background-color: #f7eced;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ビジュアルエディタ　＞　汎用ボタン01
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
a.basic_btn01 {
    min-width: 410px;
    padding: 25px 30px;
    background-image: linear-gradient(90deg, #31060c 30%, #57141d 75%);
    font-family: "my_mincho", serif;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用ボタン01 &　トップボタン ＞　hover時キラン
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
a.basic_btn01:hover,#contact_area .btn_wrap p.contact a:hover {
    opacity: 1;
}

a.basic_btn01::before,#contact_area .btn_wrap p.contact a::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-60deg);
}


a.basic_btn01:hover::before,#contact_area .btn_wrap p.contact a:hover::before {
    -webkit-animation: shine .75s;
    animation: shine .75s;
}

@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}

@keyframes shine {
    100% {
        left: 125%;
    }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用タイトル
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
h2.cmn_ttl {
    background: url(images/menu_bg.jpg) no-repeat 50% / cover;
    text-align: center;
    color: #fff;
    font-size: 36px;
    padding: 18px 20px;
    text-shadow: 0px 0px 27px rgba(36,20,10,.6);
}

h2.cmn_ttl span {
    display: block;
}

h2.cmn_ttl span.en {
    font-size: 72px;
    font-family: "kunstler";
}

h2.cmn_ttl span.ja {
    font-size: 16px;
    font-weight: bold;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用リスト　＞　施工事例
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
p.tax_ttl{
    text-align:center;
    font-size:30px;
    margin-bottom:1em;
    font-family: "my_mincho", serif;
}

ul.cmn_work_list {
    width: calc(100vw - 120px);
    min-width: 1100px;
    margin: 0 auto;
    justify-content: center;
}

ul.cmn_work_list li {
    width: calc(25% - 10px);
    margin: 0 5px;
}

ul.cmn_work_list li:hover {
    opacity: 1;
}

ul.cmn_work_list li p.img {
    width: 100%;
    /*padding-top: 68%;*/
	padding-top: 100%;
    margin-bottom: 20px;
}

ul.cmn_work_list li .txt_wrap {
    padding: 0 15px;
}

ul.cmn_work_list li *.ttl {
    margin-bottom: 10px;
}

ul.cmn_work_list li *.ttl a {
    color: inherit;
    text-decoration: none;
    font-size: 18px;
    font-family: "my_mincho", serif;
}

ul.cmn_work_list li p.place {
    font-size: 14px;
    color: #58141d;
    display: block;
    font-family: "my_mincho", serif;
}

/* archives */
body:not(.home) ul.cmn_work_list {
    width: calc(100% + 40px);
    min-width: 0;
    margin: 0 -20px -40px;
    justify-content: flex-start;
}

body:not(.home) ul.cmn_work_list li {
    width: calc(33.333333% - 40px);
    margin: 0 20px 40px;
}

body:not(.home) ul.cmn_work_list li h3.ttl {
    margin-bottom: 5px;
}

/*hover*/
ul.cmn_work_list li p.img::before {
    content: 'MORE';
    font-size: 14px;
    line-height: 1;
    color: #fff;
    position: absolute;
    top: calc(50% - 46px);
    left: calc(50% - 46px);
    border: 1px solid #fff;
    border-radius: 50%;
    opacity: 0;
    transition: .5s;
    z-index: 1;
    width: 90px;
    height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "my_mincho", serif;
}

ul.cmn_work_list li p.img::after {
    content: "";
    background: rgba(0,0,0,.3);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: .5s;
}

ul.cmn_work_list li.biggerlink:hover p.img::before, ul.cmn_work_list li.biggerlink:hover p.img::after, ul.cmn_work_list li p.img:hover::before, ul.cmn_work_list li p.img:hover::after {
    opacity: 1;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用リスト　＞　ブログ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
ul.cmn_post_list {
    margin: 0 -13.33333px;
}

ul.cmn_post_list li {
    width: 280px;
    margin: 0 13.33333px;
}

ul.cmn_post_list li p.img {
    margin-bottom: 15px;
    padding-top: 68.2%;
}

ul.cmn_post_list li p.date {
    color: #9e5c65;
    font-size: 14px;
    line-height: 1.5;
    font-family: "my_mincho", serif;
    margin-bottom:.25em;
}

ul.cmn_post_list li h3.ttl a {
    color: inherit;
    text-decoration: none;
    font-family: "my_mincho", serif;
    font-size:16px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用ボタン
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
a.cmn_more {
    font-size: 18px;
    font-family: "my_mincho", serif;
    color: #3e1515;
    border: 1px solid #3e1515;
    padding: 10px 25px;
    position: relative;
    min-width: 200px;
}

a.cmn_more::after {
    font-family: "icomoon";
    content: '\e917';
    font-size: 1.5em;
    position: absolute;
    top: 50%;
    margin-top: -0.40em;
    line-height: 1;
    right: 0;
}

a.cmn_more:hover {
    color: #ebebeb;
    background-color: #4c0707;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　バナーエリア
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_bnr ul.items {
    justify-content: space-between;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　オーダメイドリフォーム
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_menu p.main_lead {
    font-size: 26px;
    text-align: center;
    font-family: "my_mincho", serif;
    margin-bottom: 45px;
}

#home_menu ul.items {
    width: calc(100vw - 120px);
    min-width: 1090px;
    justify-content: space-between;
    margin: 0 auto;
}

#home_menu ul.items li {
    position: relative;
    width: 48.333%;
}

#home_menu [class*="biggerlink"]:hover {
    opacity: 1;
}

#home_menu ul.items li p.img {
    overflow: hidden;
}

#home_menu ul.items li p.img img {
    transition: .5s all;
}

#home_menu ul.items li p.img img:hover {
    transform: scale(1.1,1.1);
    transition: .5s all;
}

#home_menu ul.items li h3.ttl {
    text-align: center;
    position: absolute;
    bottom: 0;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
}

#home_menu ul.items li h3.mansion {
    background: rgba(49,37,49,.8);
}

#home_menu ul.items li h3.kodate {
    background: rgba(88,20,29,.8);
}

#home_menu ul.items li h3.ttl a {
    color: #fff;
    text-decoration: none;
    font-size: 26px;
    font-family: "my_mincho", serif;
    letter-spacing: 0.2em;
    display: block;
    position: relative;
}

#home_menu ul.items li h3.mansion a {
    padding: 32px 0px 32px 40px;
}

#home_menu ul.items li h3.kodate a {
    padding: 32px 0px 32px 40px;
}

#home_menu ul.items li h3.mansion a::before {
    content: '';
    background: url("images/mansion_kazari.png") no-repeat 50% / contain;
    width: 34px;
    height: 42px;
    position: absolute;
    top: 21px;
    left: -15px;
}

#home_menu ul.items li h3.kodate a::before {
    content: '';
    background: url("images/kodate_kazari.png") no-repeat 50% / contain;
    width: 38px;
    height: 38px;
    position: absolute;
    top: 25px;
    left: -20px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　施工事例
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_work {
    background-color: #ebebeb;
    position: relative;
}

#home_work h2.main_ttl {
    text-align: center;
    font-family: "my_mincho", serif;
    margin-bottom: 50px;
}

#home_work h2.main_ttl span {
    display: block;
}

#home_work h2.main_ttl span.ja {
    font-size: 36px;
    margin-bottom: 7px;
}

#home_work h2.main_ttl span.en {
    font-size: 18px;
    color: #58141d;
    letter-spacing: 0.2em
}

#home_work p.btn {
    position: absolute;
    top: 70px;
    right: 60px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　リフォーミヤの特長
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_features h2.cmn_ttl {
    font-family: "my_mincho", serif;
    padding: 65px 80px;
}

#home_features [class*="features"] h3.main_ttl {
    font-size: 30px;
    text-align: center;
    position: relative;
    padding: 30px 0;
    margin-bottom: 30px;
    font-family: "my_mincho", serif;
}

#home_features [class*="features"] h3.main_ttl::before {
    font-family: "calistomtkursiv";
    letter-spacing: 0.075em;
    transform: skewX(-10deg);
    color: #ab888d;
    font-size: 130px;
    position: absolute;
    top: calc(50% - 85px);
}

#home_features .features1 h3.main_ttl::before {
    content: '01';
    left: -35px;
}

#home_features .features2 h3.main_ttl::before {
    content: '02';
    right: -25px;
}

#home_features .features3 h3.main_ttl::before {
    content: '03';
    left: 65px;
}

#home_features [class*="features"] .inner {
    justify-content: space-between;
}

#home_features [class*="features"] .area_a {
    margin-left: -210px;
    margin-right: -210px;
    width: 58.333%;
}

#home_features [class*="features"] .area_b {
    align-content: space-between;
    width: 52.5%;
}

#home_features [class*="features"] .area_b .img_wrap {
    width: 100%;
    justify-content: space-between;
}

#home_features .features2 {
    background-color: #efedea;
}

/*features2 左右入れ替え用*/
#home_features .features2 .inner {
    flex-direction: row-reverse;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　メッセージ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

#home_message {
    background: url(images/message_bg.jpg) no-repeat 50% / cover;
}

#home_message .inner {
    justify-content: space-between;
}

#home_message .area_b {
    padding-top: 30px;
}

#home_message .area_b h2.ttl {
    font-size: 26px;
    margin-bottom: 35px;
    font-family: "my_mincho", serif;
    line-height: 1.8;
}

#home_message .area_b p.prof {
    text-align: end;
    font-family: "my_mincho", serif;
    margin-bottom: 60px;
}

#home_message .area_b p.prof span.name1 {
    margin-right: 20px;
    font-size: 18px;
}

#home_message .area_b p.prof span.name2 {
    font-size: 18px;
    margin-right: 25px;
}

#home_message .area_b p.prof span.name3 {
    font-size: 24px;
}

#home_message .area_b .shikaku_box {
    background-color: #fff;
    padding: 15px 75px 25px;
}

#home_message .area_b .shikaku_box h3.ttl {
    text-align: center;
    margin-bottom: 5px;
    font-family: "my_mincho", serif;
}

#home_message .area_b .shikaku_box p.content {
    font-size: 15px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　About
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_about {
    background: url(images/about_bg.jpg) no-repeat 50% / cover;
}

#home_about .box {
    background: rgba(255,255,255,0.9);
    margin: 0 auto;
    text-align: center;
    padding: 50px;
    position: relative;
    width: 88%;
}

#home_about p.ttl {
    font-size: 72px;
    background: rgba(88,20,29,.85);
    color: #fff;
    display: inline-block;
    position: absolute;
    left: 0;
    top: 0;
    padding: 10px 45px;
    font-family: "kunstler";
}

#home_about p.main_ttl {
    font-size: 30px;
    font-family: "my_mincho", serif;
    margin-bottom: 60px;
    padding: 0 240px;
}

#home_about p.main_ttl span.kaigyo1 {
    display: inline-block;
}

#home_about h2.ttl {
    margin-bottom: 35px;
}

#home_about ul.items {
    max-width: 1110px;
    justify-content: space-between;
    margin: 0 auto 45px;
}

#home_about ul.items li {
    width: calc(33.333% - 25px);
}

#home_about ul.items li p.img {
    margin-bottom: 10px;
}

#home_about ul.items li h3.ttl {
    font-size: 18px;
    font-family: "my_mincho", serif;
}

#home_about p.txt {
    margin-bottom: 30px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　blog
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_blog {
    /*padding: 40px 0 130px;*/
	/*PC表示時のブログ下の幅調整*/
	padding: 40px 0;
}

#home_blog .pc_base_width {
    position: relative;
}

#home_blog h2.ttl {
    font-family: "kunstler";
    font-size: 72px;
    color: #58141d;
    line-height: 1.2;
    text-align: center;
    margin-bottom: 40px;
}

#home_blog p.btn {
    position: absolute;
    right: 0px;
    top: 25px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ　＞　追加コンテンツ（リフォームの流れ～会社概要）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_flow,#home_qa,#home-area,#hojokin,#company-info{
	margin-bottom: 50px;
}

#home-area,#hojokin {
	max-width: 1400px;
	margin: 0 auto;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
contactエリア
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#contact_area {
    background: url(images/contact_bg.jpg) no-repeat 50%;
    font-family: "my_mincho", serif;
    padding-top: 40px;
    padding-bottom: 90px;
}

#contact_area h2.ttl {
    font-family: "kunstler";
    font-size: 72px;
    color: #58141d;
    line-height: 1.2;
    text-align: center;
}

#contact_area p.main_lead {
    font-size: 24px;
    line-height: 1.7;
    margin-bottom: 30px;
    text-align: center;
}

#contact_area p.main_lead span {
    display: block
}

#contact_area p.main_lead span.big {
    font-size: 32px;
}

#contact_area .btn_wrap {
    justify-content: center;
}

#contact_area .btn_wrap p:not(:last-child) {
    margin-right: 20px;
}

#contact_area .btn_wrap p a {
    min-width: 530px;
}

#contact_area .btn_wrap p.tel a {
    background-color: #fff;
    font-size: 30px;
    padding: 23px 0;
    position: relative;
}

#contact_area p.tel a::before {
    font-family: "icomoon";
    content: '\f095';
    font-size: 1em;
    font-weight: bold;
    color: #56131c;
    position: absolute;
    margin-top: -.48em;
    line-height: 1;
    left: 130px;
    top: 50%;
}

#contact_area .btn_wrap p.contact a {
    background-image: linear-gradient(90deg, #31060c 30%, #57141d 75%);
    color: #fff;
    font-size: 20px;
    padding: 32px 0;
    position: relative;
    overflow: hidden;
    vertical-align: top;
}

#contact_area .btn_wrap p.contact a::after {
    font-family: "icomoon";
    content: '\e917';
    font-size: 1.5em;
    position: absolute;
    top: 50%;
    margin-top: -.48em;
    line-height: 1;
    right: 0;
    font-weight: normal;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
会社概要修正　2025-06-19kn
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.text-align_left_sp p{
	text-align: center;
}