@charset "utf-8";
/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
css変数
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
:root {
	--slick_side_margin:15px;/*slik内の要素の左右の余白。*/
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用css
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*文章を1行に制限*/
.limit_txt01{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*文章を複数行に制限*/
.limit_txt02{
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;/*2行*/

}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用　＞　ベーシックテーブル01
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*線の重複があったため修正(2023-05-17og)*/
.basic_table01 table tr > td:first-child {
	background-color:  var(--base-2);
}

/*Gutenbergのテーブルでは一列目をthにできないため見出しは下記で装飾*/
.basic_table01 tr > td:first-child {
	background-color:  var(--base-2);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用 > タイムライン
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.sgb-tl-item__marker {
    border: 3px solid var(--main);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ローカルナビ
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*プロモ画像下のチャイルドナビ*/
.h_child_navi ul.child_navi a {
	background-color: var(--h-child-navi-bg);
	color: var(--main);
}

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

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
top > カルーセル（共通）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
[id*="carousel"] .slick-slider .slick-list {
    overflow: visible;
}

[id*="carousel"] .slick-slider .slick-slide {
    margin:0 var(--slick_side_margin)!important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
top > カルーセル（全画面）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#carousel_full .slick-slider .slick-list {
	margin-left: calc(var(--slick_side_margin) * -1);
}

/*矢印*/
#carousel_full .slick-next {
    right: var(--slick_side_margin);
}

#carousel_full .slick-prev {
    left: auto;
    right: 70px;
}

#carousel_full :is(.slick-prev, .slick-next) {
    top: -70px;
    width: auto;
    height: auto;
}

#carousel_full :is(.slick-prev, .slick-next)::before {
    content: '\ea3c'!important;
    font-family: "icomoon";
    font-size: 17px;
    font-weight: normal;
    color: var(--main)!important;
	width: 45px;
    height: 45px;
    border: 2px solid var(--main);
    border-radius: 50%;
	display: flex;
    justify-content: center;
    align-items: center;
}

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

#carousel_full :is(.slick-prev,.slick-next):not(.slick-disabled):before {
    opacity: 1;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
top > カルーセル（2カラム）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#carousel_2col .area_b {
    overflow-x: clip;
}

/*矢印*/
#carousel_2col :is(.slick-prev,.slick-next) {
    width: auto;
    height: auto;
    top: calc(100% + 40px);
    z-index: 1;
}

#carousel_2col .slick-prev{
	left: 0;
}

#carousel_2col .slick-next {
	right: 0;
}

#carousel_2col :is(.slick-prev,.slick-next):before {
    content: '\e917'!important;
    font-size: 45px;
    font-family: 'icomoon';
    display: block;
	color: var(--main)!important;
}
#carousel_2col :is(.slick-prev,.slick-next):not(.slick-disabled):before{
    opacity: 1;
	
}

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

/*インジケーター*/
#carousel_2col ul.slick-dots {
	bottom: -40px;
}

#carousel_2col .slick-dots li button:before {
    color: #a0a0a0;
    opacity: 1;
    font-size: 10px;
}


#carousel_2col .slick-dots li.slick-active button:before {
    color: var(--main);
    opacity: 1;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ハンバーガーメニューのカスタマイズ(2023-03-13mk)
↓↓↓下記をまずは削除した上で、【https://coco-factory.jp/ugokuweb/move01-cat/humbugermenu/】から、お好みのボタンのCSSを追加
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*==================================================
　5-2-1 3本線が×に
===================================*/
/*ボタン外側※レイアウトによって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%;
}

/* Gutensliderの不要なボタン非表示 */
button.eedee-gutenslider-nav {
    display: none;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
「booking-package」予約プラグイン 2024-08-07
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 上の日付 */
#booking-package .calendarData {
	font-weight: bold;
}

/* カレンダー　日付選択　曜日 */
#booking-package .calendar .week_slot {
    font-weight: bold;
}
#booking-package .calendar .week_slot.sun {
    color: #ff3f3f;
}
#booking-package .calendar .week_slot.sat {
    color: #2b71fd;
}

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

/* ボタン（全フェーズ共通） */
#booking-package .bottomBarPanel {
    text-align: center;
}
#booking-package button {
    font-weight: bold!important;
    min-width: 150px;
    border-radius: 4px;
    transition: .3s;
}
#booking-package button:hover {
    opacity: .8;
}
/* 予約するボタン */
#booking-package button.book_now_button {
    background: var(--company-color,#222);
    padding: 15px 20px;
    color: #fff;
}
/* 戻るボタン */
#booking-package button[class*="return"] {
    background: #f1f1f1;
    width: 140px!important;
    color: #717171;
    border: 1px solid #d0d0d0;
    font-size: 15px;
}

/* 個人情報入力画面にてタイトルの文字を太くする */
#booking-package .row div:first-of-type {
    font-weight: bold!important;
}

/* ◯の位置が下に来るための修正 */
#booking-package_calendarPage{
    line-height:1.5;
}

/* ------------ デザイン追加修正 ------------ */

/* 「次の週」「前の週」ボタン */
:is(#previous_available_day_button,#next_available_day_button){
	display: none!important;
}

/* 日付選択（カレンダーで選択後） */
#booking-package_schedulePage .selectable_day_slot {
    flex-direction: row-reverse;
}
#booking-package_schedulePage .selectable_day_slot>*:first-child::before {
    content:'(';
}
#booking-package_schedulePage .selectable_day_slot>*:first-child::after {
    content:')';
}
#booking-package_schedulePage .selectable_day_slot>*:last-child::after {
    content:'日';
}

/* サービス・時間選択 */
#booking-package .service_details > span::after,
#booking-package .selectable_time_slot:not(.closed) span.timeSlot::after{
    font-family: 'icomoon';
    content: '\e917';
    font-size:1.3em;
    font-weight:bold;
    margin-left: 2px;
    vertical-align: -3px;
}
#booking-package .selectable_time_slot.closed span.timeSlot::after{
    content: '予約不可';
    margin-left: 5px;
}

/* 個人情報入力画面（「個人情報」という表現が相応しくないと先方から指摘があり変更・翻訳プラグインは上手く動作しなかったためCSSで変更）2024-04-25mk */
/* →その後、カレンダーアカウント＞カレンダー選択＞カスタマイズ＞機能の有効化「ON」＞フォームにて設定可能だと気づく2024-06-12mk */
#booking-package_inputFormPanel:not(.booking_completed_panel) #reservationHeader {
	font-weight: bold;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
ファーストビュー高さ調整2024-07-01
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

#unionlunch .eedee-swiper-outer img,
#unionlunch .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content){
	max-height: 56.25vw;
}

#h-promo .eedee-swiper-outer img,
#h-promo .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content){
	max-height: 56.25vw;
}

	#highest .eedee-swiper-outer img,
#highest .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content):not(.eedee-gutenslider-pagination){
	height: 80svh;
	max-height: 56.25vw;
}

	#h-promo-company .access::after{
		content:"";
		position:absolute;
		bottom:-15px;
		left:50%;
		width:50px;
		height:4px;
		background-color:#00c2ac;
		transform: translateY(-50%) translateX(-50%); 
	}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ模写　フォント適応
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/*overでフォントを当てる用*/
:root {
  --hiragino: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --oswald: "Oswald", sans-serif;
  --yu_go: 游ゴシック, "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", メイリオ, Meiryo, Osaka, "MS Pゴシック", MSゴシック, Helvetica, verdana, arial;
  --dinal:"din_alternate","suns-serif";
  --heisei:"DFHsm7_0";
  --zenold:"ZenOldMincho";
}

/*WPでクラスをつけてフォントを当てる用*/
.hiragino{
	font-family:var(--hiragino);
}

.oswald{
	font-family:var(--oswald);
}

.yu_gothic{
	font-family:var(--yu_go);
}

.dinal{
	font-family:var(--dinal);
}

.heisei{
	font-family:var(--heisei);
}

.zenold{
	font-family:var(--zenold);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
汎用クラス（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.cmn_shadow02{
	box-shadow:rgba(29, 4, 28, 0.1) 0 0 20px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
トップページ構築（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

	#home_promo .sub_copy::before{
		content:"";
		position:absolute;
		width:3px;
		height:30px;
		background-color:#d70000;
		transform:rotate(-30deg);
		left:-40px;
	}

	#home_promo .sub_copy::after{
		content:"";
		position:absolute;
		width:3px;
		height:30px;
		background-color:#d70000;
		transform:rotate(30deg);
		right:-30px;
	}

	#home_promo .txt_span{
		letter-spacing:-15px;
	}

	#home_promo .grid{
		width:100%;
	}

	#home_promo .area_a_inner::before{
		content:"";
		position:absolute;
		background: url('https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/07/promo_batch.png') no-repeat center center / contain;
		width:150px;
		height:150px;
		top:-80px;
		left:-20px;
	}

	#home_intro .copy span{
		font-size:38px;
	}

	#home_intro .sub_copy::before{
		content:'';
		position:absolute;
		top:100%;
		left:50%;
		margin-left:-15px;
		border:15px solid transparent;
		border-top:15px solid #000000;
	}

	#home_intro .images::before{
		content:"CAR\00A0PURCHASE";
		position:absolute;
		font-family:var(--oswald);
		font-size:170px;
		font-weight:500;
		color:#EFEFEF;
		top:-22%;
		left:50%;
		transform:translateX(-50%);
	}

	#home_intro .strong_txt{
		position:absolute;
		right:50%;
		transform:translateX(50%);
		text-wrap:nowrap;
		bottom:30px;
	}

	#home_intro .strong_txt span{
		border-bottom:solid 2px #ffffff;
		padding-bottom:2px;
		font-size:17px;
	}

	#home_best_cars .box::before{
		position:absolute;
		color:#d70000;
		font-family:var(--oswald);
		font-weight:400;
		top:-10px;
		font-size:40px;
		left:60px;
	}

	#home_best_cars .box_01::before{
		content:"SUV/CROSS COUNTRY";
	}

	#home_best_cars .box_02::before{
		content:"MINIVAN/ONE BOX";
	}

	#home_best_cars .box_03::before{
		content:"SPORT/DRIFT";
	}

	#home_best_cars .box_04::before{
		content:"FOREIGN/OLD";
	}

	#home_reason .inner::before{
		content:"";
		position:absolute;
		background-color:#fff8f7;
		transform:skewY(-10deg);
		height:580px;
		width:93.57vw;
		min-width:1200px;
		right:0;
		top:150px;
	}

	#home_reason .inner::after{
		content:"";
		position:absolute;
		background-color:#fff8f7;
		transform:skewY(-10deg);
		height:580px;
		width:93.57vw;
		min-width:1200px;
		left:0;
		bottom:100px;
	}

	#home_reason .area_b::after{
		position:absolute;
		color:#ffffff;
		font-family:var(--oswald);
		font-weight:400;
		z-index:1;
		font-size:120px;
		top:0;
		right:10%;
	}

	#home_reason .area_01::after{
		content:"01";
	}

	#home_reason .area_02::after{
		content:"02";
	}

	#home_reason .area_03::after{
		content:"03";
	}

	#home_reason .area_04::after{
		content:"04";
	}

	#home_reason .copy span{
		font-size:42px;
	}

	#home_flow .image img{
		position:relative;
		z-index:2;
	}

	#home_flow .image::after{
		content:"";
		position:absolute;
		background-color:#ffffff;
		z-index:1;
		width:100px;
		height:1px;
		right:-100px;
		top:50%;
		transform:translateY(50%);
	}

	#home_flow .txt span{
		border-bottom:solid 1px #d70000;
	}

	#home_flow .step{
		position:absolute;
		top:0;
		left:0;
	}

	#home_faq .gb-button::before{
		color:#d70000;
		font-family:var(--oswald);
		line-height:1.2;
	}

#home_faq .gb-container-accordion_item:last-child{
	border-bottom:none;
}

	#home_map .logo img{
		position:relative;
		z-index:3;
	}

	#home_map .logo::after{
		content:"COMPANY";
		position:absolute;
		  color: #fff;
	  text-shadow:
		1px 1px 0 #f0f0f0,
		-1px 1px 0 #f0f0f0,
		-1px -1px 0 #f0f0f0,
		1px -1px 0 #f0f0f0;
		font-family:var(--oswald);
		left:50%;
		transform: translateY(-50%) translateX(-50%); 
		text-wrap:nowrap;
		z-index:1;
		font-weight:400;
		font-size:166px;
		top:50%;
	}

	#home_contact .logo img{
		width:220px;
	}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層構築-選ばれる理由（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

	#reason .bigger{
		font-size:38px;
	}
	
	#reason .image{
		object-position: 5% center;
	}
	
	#reason .image_02{
		object-position: 70% center;
	}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層構築-査定方法（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

	#assessment .step span{
		font-size:30px;
	}

	#assessment .txt span{
		font-weight:700;
	}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層構築-会社案内（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

	#company .basic_table02 td:first-child{
		border-bottom:#D5D5D5 2px solid;
	}

	#company .basic_table02 td:nth-child(2){
		font-weight:normal;
		font-size:16px;
	}

	#company .map{
		width:100%;
		height:450px;
	}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層構築-お問い合わせ：メールで査定（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

	#contact_mail .line_ttl .gb-icon{
		padding-bottom:15px;
	}

	#contact_mail .line_flow{
		margin-top:-20px;
	}

	#contact_mail .space{
		margin-bottom:30px;
	}

	#contact_mail .sub_ttl{
		border-top:none !important;
		border-bottom:2px solid #000000;
		padding:30px 0 15px 0 !important;
		margin-bottom:30px;
		color:#525252;

	}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層構築-お問い合わせ：LINE査定の流れ（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

	#contact_line .flow {
	  width: 0;
	  height: 0;
	  border-style: solid;
	  border-right: 27px solid transparent;
	  border-left: 27px solid transparent;
	  border-top: 20px solid #d70000;
	  border-bottom: 0;
	  border-radius:5px;
	}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
下層構築-個人情報保護方針（ハイエスト）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

#privacy .list{
	text-indent:-1em;
}

	#privacy .list::before{
		content: "•";
		position: absolute;
	}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
cssアニメーション
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* スクロール前（opacityを0にして要素を隠しておく） */
#page_animation.animate::before {
	content: '';
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/06/favicon.png") no-repeat 50% / contain;
	width: 20vw;
	height: 18.2vw;
	position: absolute;
	bottom: -7.2vw;
	right: -50px;
	opacity: 0;
	transition: all 1s 1s;
}

/* スクロール後（is-inviewというクラスが付与された後、opacityを1にして表示させる） */
#page_animation.animate.is-inview::before {
	opacity: 1;
	right: 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
辰己製作所　トップページ構築
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.finger{
	cursor:pointer;
}

#tatsumi_home_promo .title_01{
	font-size:40px;
	line-height:0;
}

#tatsumi_home_promo .number{
	font-size:clamp(80px, 2.7vw + 46.6px, 100px);
	line-height:1em;
}

#tatsumi_home_promo .title_box{
	border:solid #fff 1px;
	font-size:clamp(65px, 1.8vw + 43.3px, 78px);
	padding:15px;
	line-height:2em;
}

#tatsumi_home_short_contact .pop::before{
	content:'';
	position:absolute;
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/08/sun_icon.png") no-repeat center center/contain;
	width:100px;
	height:70px;
	top:-35px;
	left:0;
}

#tatsumi_home_short_contact .pop::after{
	content:'';
	position:absolute;
	top:100%;
	left:50%;
	margin-left:-15px;
	border:15px solid transparent;
	border-top:15px solid #ffffff;
}

#tatsumi_home_short_contact .bigger{
	font-size:79px;
	font-family:var(--zenold);
    text-decoration: underline #fae900 2px;
    text-underline-offset: 12px;
	position:relative;
}

#tatsumi_home_short_contact .bigger::after{
	content:"";
	position:absolute;
	width:80px;
	height:80px;
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/08/shine.png") center center / contain no-repeat;
	right:-40px;
	top:0;
}

#tatsumi_home_short_contact .tel{
	font-size:47px;
	font-family:var(--dinal);
}

#tatsumi_home_short_contact .wrap{
	text-wrap:nowrap;
}

#tatsumi_home_intro .bigger{
	font-size:30px;
}

#tatsumi_home_intro .images::before{
	position:absolute;
	content:"";
	height:100px;
	width:100px;
	background-color:#002198;
	clip-path: polygon(0% 0%,100% 0,0% 100%);
	z-index:2;
}

#tatsumi_home_intro .num{
	position: absolute;
	z-index:5;
	left:10px;
	top:10px;
}

#tatsumi_home_intro .content{
	overflow:visible;
}

#tatsumi_home_intro .content::after{
	position:absolute;
	content:"";
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/08/track.png") no-repeat left center/cover;
	width:clamp(200px, 20.8vw + -50px, 350px);
	height:clamp(360px, 12.5vw + 210px, 450px);
	top:-60px;
	right:0;
	z-index:2;
}

#tatsumi_home_works{
	overflow:visible;
}

#tatsumi_home_works::before{
	position:absolute;
	content:"";
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/08/hand.png") no-repeat left center/cover;
	top:-105px;
	left:0;
	width:clamp(530px, 38.8vw + 63.3px, 810px);
	height:clamp(330px, 29.1vw + -20px, 540px);
}

#tatsumi_home_works .box{
	position:absolute;
	bottom:0;
	left:50%;
	transform:translateX(-50%);
}

#tatsumi_home_works .label{
	position:absolute;
	top:-20px;
	right:35px;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}

#tatsumi_home_works .ttl{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	position:absolute;
}

#tatsumi_home_works .ttl_left{
	top:-25px;
	right:35px;
}

#tatsumi_home_works .ttl_right{
	top:60px;
	right:35px;
}

#tatsumi_home_works .ttl_border::before{
	content:"";
	position:absolute;
	width:6px;
	background-color:#001c80;
	top:0;
	left:0;
}

#tatsumi_home_works .long::before{
	height:38px;
}

#tatsumi_home_works .short::before{
	height:30px;
}

#tatsumi_home_works .ttl_border::after{
	content:"";
	position:absolute;
	width:6px;
	background-color:#fabb00;
	bottom:0;
	left:0;
}

#tatsumi_home_works .long::after{
	height:38px;
}

#tatsumi_home_works .short::after{
	height:33px;
}

#tatsumi_home_case::before{
	content:"";
	position:absolute;
	background:url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/case_bg.png") center center / contain no-repeat;
	width:410px;
	height:550px;
	top:-80px;
	right:0;
	z-index:1;
}

#tatsumi_home_parallax .content::before{
	content:"";
	position:absolute;
	background-color:#001c80;
	width:460px;
	height:130px;
	bottom:0px;
	right:0;
}

#tatsumi_home_number{
	overflow:visible;
}

#tatsumi_home_number .number span{
	font-size:clamp(80px, 1.3vw + 63.3px, 90px);
	color:#fae900;
	font-family:var(--dinal);
}

#tatsumi_home_number .number_box::after{
	content:"";
	position:absolute;
	top:50%;
	left:clamp(50% - 50px, 5.5vw + 63.3px, 50% - 100px);
	width:clamp(130px, 5.5vw + 63.3px, 170px);
	height:clamp(130px, 5.5vw + 63.3px, 170px);
	transform:translateX(-50%) translateY(-50%);
	z-index:1;
}

#tatsumi_home_number .multiplication::after{
	mix-blend-mode:multiply;
}

#tatsumi_home_number .number01::after{
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/number01.svg") center center / contain no-repeat;
}

#tatsumi_home_number .number02::after{
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/number02.svg") center center / contain no-repeat;
}

#tatsumi_home_number .number03::after{
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/number03.svg") center center / contain no-repeat;
}

#tatsumi_home_number .number04::after{
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/number04.svg") center center / contain no-repeat;
}

#tatsumi_home_number .number05::after{
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/number05.svg") center center / contain no-repeat;
}

#tatsumi_home_number .number06::after{
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/number06.svg") center center / contain no-repeat;
}

#tatsumi_home_number .number04::before{
	width:10px;
	height:10px;
	background-color:#475a9c;
	border-radius:100%;
	content:"";
	position:absolute;
	right:-5px;
	top:-5px;
}

#tatsumi_home_number .number06::before{
	width:10px;
	height:10px;
	background-color:#475a9c;
	border-radius:100%;
	content:"";
	position:absolute;
	left:-5px;
	top:-5px;
}

#tatsumi_home_number .number_ttl{
	/*letter-spacing:0.15em;*/
	line-height:1.3em;
	letter-spacing:-0.15em;
	text-indent:-1.8em;
}

#tatsumi_home_number .gb-grid-column-96f081ad{
	display:inline-grid;
}

#tatsumi_home_number .tate{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}

#tatsumi_home_number .number_ttl .yellow{
	font-size:84px;
	color:#fae900;
	/*letter-spacing:0.15em*/
	letter-spacing:-0.3em;
}

/*
#tatsumi_home_number .number_ttl .twotxt{
	padding-top:125px;
}
*/

#tatsumi_home_company .img::before{
	content:"";
	position:absolute;
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/company.svg") center center / contain no-repeat;
	width:960px;
	height:145px;
	top:-80px;
	left:230px;
}

#tatsumi_home_company .img::after{
	content:"";
	position:absolute;
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/08/track-mini.png") center center / contain no-repeat;
	width:350px;
	height:145px;
	bottom:-40px;
	left:-40px;
}

#tatsumi_home_company .ttl span{
	font-family:var(--zenold);
	font-size:clamp(48px, 3vw + 11.3px, 70px);
	color:#000;
}

#tatsumi_home_map iframe{
	display:block;
}

#tatsumi_home_map .access{
	position:absolute;
	top:50%;
	right:0;
	transform:translateY(-50%);
}

#tatsumi_home_contact::before{
	content:"";
	position:absolute;
	width:clamp(350px, 27.7vw + 16.6px, 550px);
	height:clamp(300px, 16.6vw + 100px, 420px);
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/08/hand02.png") center center / contain no-repeat;
	top:0;
	left:0;
	z-index:10;
}

#tatsumi_home_contact .sub_ttl span{
	color:#fae900;
}

#tatsumi_home_contact .content::before{
	content:"";
	position:absolute;
	background: url("https://onda.cyber318.xyz/wordpress/wp-content/uploads/2024/09/CONTACT.png") center center / contain no-repeat;
	top:calc(50% + 5px);
	left:50%;
	transform:translateX(-50%) translateY(-50%);
	width:650px;
	height:110px;
	z-index:3;
}

#tatsumi_home_contact .ttl .side_border{
	font-size:28px;
	position:relative;
}

#tatsumi_home_contact .ttl .side_border::before{
	content:"";
	position:absolute;
	width:3px;
	height:35px;
	background-color:#fff;
	top:50%;
	left:-25px;
	transform: translateY(-50%) rotate(-30deg);
}

#tatsumi_home_contact .ttl .side_border::after{
	content:"";
	position:absolute;
	width:3px;
	height:35px;
	background-color:#fff;
	top:50%;
	right:-25px;
	transform: translateY(-50%) rotate(30deg);
}

#tatsumi_home_footer .area{
	text-wrap:nowrap;
}