@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%;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training2　> 擬似要素（2024-06-24）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#feature_ttl:before {
	position: absolute;
	content: "";
	width: 350px;
	height: 80px;
	background: url(https://infinity-wall.jp/wordpress/wp-content/themes/cyber-child/images/feature_ttl01.png)no-repeat 100% / contain;
	top: -20px;
    left: -10%;
}

#reason_ttl:before {
    position: absolute;
    content: "";
    width: 230px;
    height: 50px;
    background: url(/wordpress/wp-content/themes/generatepress_child/images/reason_ttl01.png)no-repeat 100% / contain;
    top: -30px;
}

#mission_ttl:before {
	position: absolute;
	content: "";
	width: 900px;
	height: 150px;
	background: url(https://vinika.co.jp/wordpress/wp-content/uploads/2022/06/mission_txt.png) no-repeat 100% / contain;
	top: 20px;
	left: calc(35% - 100px);
}

#consultation_ttl:before {
    position:absolute;
    content:"CONSULTATION";
    font-size: 8.5vw;
    color: #F2F2F2;
    font-family: Jost, sans-serif;
    top: 50px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training3　> プロモオファーボタン（2024-06-24）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.promo_btn {
    position: absolute;
    bottom: 1em;
    right: 2em;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> プロモバナー（2024-06-27）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#nagai_promo .promo_bnr {
    position:absolute;
    bottom: 25px;
    left: 30px;
    z-index:1;
}

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

/* Gutensliderに入る周りの余白削除 */
.wp-block-eedee-gutenslider__content {
	padding: 0!important;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> 動画埋め込み画面いっぱいに（2024-06-28）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#eiwa_promo .eiwa_promo {
    height: 100%;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> 文字ループ（2024-07-01）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@keyframes infinite-scroll {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -1380px 0;
    }
}

#union_promo::after {
    position: absolute;
	content: '';
    width: 1380px;
    height: 133px;
	background: url(https://unionlunch.co.jp/wordpress/wp-content/themes/generatepress_child/images/unionlunch.png) repeat-X 50% / contain;
    bottom: 9%;
	animation: infinite-scroll 30s linear infinite;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> ユニオンランチ様 > スライダー画像（2024-07-01）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#union_promo .eedee-swiper-outer img,
#union_promo .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content):not(.eedee-gutenslider-pagination){
	height: calc(100svh - 200px);
	max-height: 50.25vw;
}

#union_promo .wp-block-eedee-block-gutenslider .swiper {
	border-radius: 30px  0px 0px 30px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> H-PROMO様 > 疑似要素（2024-07-02）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#h_promo .txt_wrap:before {
    position: absolute;
    content: "";
    background: url(https://h-promo.jp/wordpress/wp-content/themes/generatepress_child/images/promo_window.png)no-repeat 100% / contain;
    width: clamp(90px, 1.3vw + 73.3px, 100px);
    height: clamp(95px, 1.3vw + 78.3px, 105px);
    left: -4%;
    top: 10px;
}

#h_promo .area_ttl:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 12px;
    top: 50%;
    right: -11px;
    transform: translateY(-50%);
    clip-path: polygon(0 0, 0% 100%, 100% 50%);
    background-color: #FF9900;
}

#h_promo .area_wrap:before {
    content: '';
    position: absolute;
    background: url("https://h-promo.jp/wordpress/wp-content/themes/generatepress_child/images/promo_exterior_img.png") no-repeat 100% / contain;
    width: clamp(200px, 4.7vw + 143.3px, 234px);
    height: clamp(203px, 4.8vw + 144.6px, 238px);
    left: 110%;
	z-index: 1;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> H-PROMO様 > スライダー画像（2024-07-02）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#h_promo .eedee-swiper-outer img,
#h_promo .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content):not(.eedee-gutenslider-pagination){
	height: calc(100svh - 200px);
	max-height: 50.25vw;
}

#h_promo .wp-block-eedee-block-gutenslider .swiper {
	border-radius: 50px  0px 0px 50px;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> 関商工会議所様（2024-07-03）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* プロモテキスト横書きにする */
#seki_promo .promo_txt {
    writing-mode: vertical-rl;
}

/* プロモ動画 */
#seki_promo .movie_area {
    height: 100%;
	border-radius: 50px;
}

/* プロモ動画 > 「関」疑似要素 */
#seki_promo .movie_area:before {
	position: absolute;
	content: "";
	background: url(https://sekicci.or.jp/wordpress/wp-content/themes/generatepress_child/images/promo_img01.png)no-repeat 100% / contain;
	background-position: top;
	width: clamp(250px, 26.1vw + -63.3px, 438px);
	height: clamp(268px, 27.9vw + -67px, 469px);
	top: -5%;
	right: -30px;
	z-index: 1;
}

/* プロモ動画 > 疑似要素 */
#seki_promo:before {
    position: absolute;
    content: "";
    background: url(https://sekicci.or.jp/wordpress/wp-content/themes/generatepress_child/images/promo_img_a.png)no-repeat 100% / contain;
    background-position: top;
    width: clamp(300px, 39.1vw + -170px, 582px);
    height: clamp(394px, 50.2vw + -209.3px, 756px);
    z-index: 1;
    top: 0;
    left: 0
}

#seki_promo:after {
    position: absolute;
    content: "";
    background: url(https://sekicci.or.jp/wordpress/wp-content/themes/generatepress_child/images/promo_img_b.png)no-repeat 100% / contain;
    background-position: bottom ;
    width: clamp(200px, 35.1vw + -221.6px, 453px);
    height: clamp(316px, 55.5vw + -350.6px, 716px);
    z-index: 1;
    bottom: -45%;
    right: 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training4　> ハイエスト様（2024-07-05）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* スライダー画像 */
#highest_promo .eedee-swiper-outer img,
#highest_promo .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content):not(.eedee-gutenslider-pagination){
	height: calc(100svh - 200px);
	max-height: 50.25vw;
}

/* プロモ疑似要素 */
#highest_promo .promo_txt:before {
    position: absolute;
    content: "";
    background: url(https://highest-car.com/wordpress/wp-content/themes/generatepress_child/images/promo_no1.svg)no-repeat 100% / contain;
    width: clamp(90px, 5.5vw + 23.3px, 130px);
    height: clamp(90px, 5.5vw + 23.3px, 130px);
    bottom: 90%;
    left: -3%;
}

/* ボタンエリア */
#highest_promo .btn_area{
    position: absolute;
    bottom: -10%;
    z-index: 1;
}

/* ボタンエリア疑似要素 */
#highest_promo .line_deco:before {
    position: absolute;
    content:"";
    background: url(https://highest-car.com/wordpress/wp-content/uploads/2023/03/line_deco.png)no-repeat 100% / contain;
    width: 210px;
    height: 100px;
    bottom: 40%;
    left: 50%;
    transform: translateX(-50%);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training5　> 松野組様 > 疑似要素（2024-07-03）
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#matsuno_about .reason_num1:before, #matsuno_about .reason_num2:before{
    position: absolute;
    content: "";
    background: url(https://matsunogumi.co.jp/wordpress/wp-content/uploads/2023/02/01img2.png)no-repeat 100% / contain;
    width: 150px;
    height: 130px;
	opacity: 0.5;
	top: -60px;
}

#matsuno_about .reason_num1:before{
    left: 30px;
}

#matsuno_about .reason_num2:before {
    right: 30px;
}

.h_large_c:before {
    background-image: url(/wordpress/wp-content/themes/generatepress_child/images/tr5_icon.svg);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
模写課題　> ハイエスト様
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* スライダー画像 */
#home_promo .eedee-swiper-outer img,
#home_promo .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content):not(.eedee-gutenslider-pagination){
	height: calc(100svh - 200px);
	max-height: 50.25vw;
}

/* プロモ > 疑似要素 */
#home_promo .ttl_deco::before {
    position: absolute;
    content: "";
    background: url(/wordpress/wp-content/uploads/2024/07/promo_deco.svg) no-repeat 100% / contain;
    background-position: top left;
    width: clamp(110px, 5.5vw + 43.3px, 150px);
    height: clamp(118px, 5.5vw + 51.3px, 158px);
    bottom: clamp(60px, 4.1vw + 10px, 90px);
}

/* テキスト▼ */
#home_intro .txt_deco::before {
    position: absolute;
    content: "";
    border-style: solid;
    border-right: 15px solid transparent;
    border-left: 15px solid transparent;
    border-top: 10px solid #000000;
    border-bottom: 0;
    bottom: -30%;
}

/* 強み > 下線 */
#home_intro span.small {
    border-bottom: 2px solid #ffffff;
}

/* 流れ ＞ 線 */
/*#home_flow::before {
    position: absolute;
    content: "";
    width: 1200px;
    height: 1px;
    background-color: #ffffff;
    top: 46%;
    left: 50%;
    transform: translateX(-50%);
}
*/

/* 流れ > 番号 */
#home_flow { counter-reset: flow; }
#home_flow .flow_num::before {
	counter-increment: flow;
    content: "STEP." counter(flow);
    position: absolute;
    background-color: #D70000;
    width: 75px;
    height: 75px;
    border-radius: 50px;
    font-family: Oswald, sans-serif;
	font-weight: normal;
    text-align: center;
    line-height: 70px;
}

/* 流れ > お問い合わせ下線 */
#home_flow a.underline:hover {
    border-bottom: 1px solid #D70000;
}

#home_map .logo_deco:before {
    content: "";
    z-index: 0;
    position: absolute;
    top: -75%;
    right: 0;
    bottom: 0;
    left: 0;
    background: url(/wordpress/wp-content/uploads/2024/07/company.svg)no-repeat 100% / contain;
    background-attachment: scroll;
}


/* Q&A　> 位置調整 */
#home_qa .gb-container-accordion.faq .gb-button-accordion_ttl{
	padding-left:25px;
}

/* Q&A　> Qマーク */
#home_qa .gb-container-accordion.faq .gb-button-accordion_ttl:before {
	font-family: Barlow Condensed, sans-serif;
	font-size: 26px;
	font-weight: normal;
	color: #D70000;
	left: 0;
}

/* 理由 > 番号01からカウント */
#home_reason { counter-reset: reason; }
#home_reason .reason_num::before {
    counter-increment: reason;
    content: "0" counter(reason);
    position: absolute;
    color: #fff;
    font-size: 120px;
    font-family: Oswald, sans-serif;
	font-weight: normal;
    right: 0;
    top: 20px;
    z-index: -1;
}

/* お問い合わせ > 疑似要素 */
#home_contact::before {
    position: absolute;
    content: "";
    background: url(/wordpress/wp-content/uploads/2024/07/bigcar_img.png)no-repeat 100% / contain;
	background-position: center center;
    width: 1087px;
    height: 556px;
    top: -13%;
    left: 50.25vw;
}

/* お問い合わせ > 確認ボタン色変更 */
.wpforms-container-full .wpforms-form .wpforms-pagebreak-left .wpforms-page-next,
.wpforms-container-full .wpforms-form .wpforms-pagebreak-left .wpforms-page-next:hover{
	background: #D70000!important;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
模写課題　> ハイエスト様　>　共通CSS
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*ボックスシャドウ*/
.cmn_shadow {
box-shadow: 5px 5px 30px 5px rgba(0, 0, 0, 0.1);
}

/*ホバー時トランジション*/
.cmn_hover,.icon　{
        transition: all 0.5s ease;
}

.cmn_hover:hover {
    opacity: 0.8;
}

/*アイコン > ホバー時拡大*/
.gb-container-92f2e6f4:hover .icon,
.gb-container-5e18a1fd:hover .icon,
.gb-container-77afb01d:hover .icon {
	transform: scale(1.2);
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
模写課題　> ハイエスト様　>　レイアウト変更
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.basic_table02 tr > td:first-child{
	border-bottom: 2px solid #ccc;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
模写課題　> ハイエスト様　>　WPフォームレイアウト変更
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*h3 > デザイン*/
div.wpforms-container-full .wpforms-form .wpforms-field.wpforms-field-divider {
    padding-top: 35px!important;
    padding-bottom: 20px;
    border-top: none !important;
    border-bottom: 2px solid #000000;
    margin-bottom: 20px;
}

/*h3 > 文字色*/
div.wpforms-container-full .wpforms-form h3 {
    font-size: 24px;
    color: #525252;
}

/*「このサイトは～」文字色*/
.privacy .color {
    color: #D70000;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
模写課題　> ハイエスト様　>　プライバシー色変更
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.privacy_wrap .gb-headline-h_middle_a {
    border-left: 8px solid #C70000;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
模写課題　> ハイエスト様　>　カスタム投稿レイアウト
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.custom_txt p {
	font-size: 15px;
	font-weight: normal;
	line-height: 27px;
}

/*アーカイブページ*/
body.post-type-archive-custom_sample .generate-columns{ 
	margin-bottom: 30px; padding-left: 30px; 
}

body.post-type-archive-custom_sample .generate-columns-container{
    margin-left: -30px;
}

body.post-type-archive-custom_sample #content{
	width: 80%;
	min-width: 1200px;
}

body.post-type-archive-custom_sample img.dynamic-meta-image {
    border-radius: 10px;
    object-fit: cover;
    max-height: 230px;
    transition: all 0.5s ease;
}

body.post-type-archive-custom_sample img.dynamic-meta-image:hover{
    box-shadow: 0 0 20px 5px rgba(0,0,0,0.2);
}

/*詳細ページ*/
body.single-custom_sample img.dynamic-meta-image {
    margin-bottom: 30px;
    border-radius: 20px;
    max-height: 550px;
    object-fit: cover;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
「booking-package」予約プラグイン(2024-08-07)wi
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* 上の日付 */
#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(--main);
    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;
}

#reservationHeader::before {
    content: "※予約はまだ完了していません";
    color: red;
    display: block;
    margin-bottom: 10px;
    font-size: 17px;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
構築課題 > 辰巳製作所様
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_promo_t h2 span:not(span.big , span.br_sp) {
    font-size: clamp(70px, 1.9vw + 46.6px, 84px);
    padding: 5px 10px;
    border: 1px solid #fff;
}

#home_promo_t .wp-block-cover {
    min-height: 100%;
	align-items: flex-end;
}

#home_bnr_t .ttl_deco::before {
    position: absolute;
    content: "";
    background: url(https://imai.cyber318.xyz/wordpress/wp-content/uploads/2024/08/bnr_txt_deco.png)no-repeat 100% / contain;
    width: 100px;
    height: 100px;
    top: -60px;
    right: -45px;
}

/*トラック装飾*/
#home_intro_t::before {
    position: absolute;
    content: "";
    background: url(/wordpress/wp-content/uploads/2024/08/intro_deco.png)no-repeat 50% / contain; 
    width: clamp(360px, 25.1vw + 58.3px, 541px);
	height: clamp(280px, 22.9vw + 5px, 445px);
    top: -5%;
    right: -10%;
}

/* 番号01からカウント */
#home_intro_t { counter-reset: intro; }
#home_intro_t .intro_deco::before {
    counter-increment: intro;
    content: "0" counter(intro);
    position: absolute;
    width: 100px;
    height: 100px;
    background-color: #002198;
    clip-path: polygon(0% 0%, 0% 100%, 100% 0%);
    font-size: 32px;
    color: #fff;
    font-family: Oswald, sans-serif;
    padding: 10px;
}

/*縦書きにする*/
.cmn_rl {
    writing-mode: vertical-rl;
}

#home_works_t::after {
    position: absolute;
    content: "";
    background: url(/wordpress/wp-content/uploads/2024/08/works_deco.png)no-repeat 100% / contain;
    width: 804px;
    height: 539px;
    top: -120px;
    left: clamp(-100px, 13.8vw + -266.6px, 0px);
}

/*works　＞ ボタン*/
#home_works_t .works_btn::after {
    position: absolute;
    content: "";
    font-family: "icomoon";
    content: '\ea3c';
    font-size: 14px;
	font-weight: normal;
	line-height: 55px;
    text-align: center;
    width: 55px;
    height: 55px;
    border-radius: 50px;
    color: #fff;
    background-color: #002198;
    right: -5%;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.5s ease;
}

#home_works_t .works_wrap .works_btn::after {
	color: #001459;
	background-color: #FAE900;
	width: 45px;
	height: 45px;
	line-height: 45px;
	right: -20%;
}

#home_works_t .works_box .works_btn::after {
	right: 20px;
	top: 40%;
}


/*見出し装飾*/
#home_works_t .works_ttl::before {
    position: absolute;
    content: "";
    width: 6px;
    height: 50%;
    background-color: #fabb00;
    left: -6px;
    bottom: 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
training3 > スマホ表示のときに間にいれる > display:gled レイアウト調整
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#home_works_t .works_wrap .box {
    display: grid;
    grid-template-areas:
        "img ttl"
        "img txt";/*ここでpcとの並び順を変更します。*/
    /* grid-column: auto; */
    gap: 0 30px;/*コンテンツ要素同士の間を調整*/
}

#home_works_t .works_wrap .ttl {
    grid-area: ttl;/*display:grid;で制御するための名前をつける*/
}

#home_works_t .works_wrap .img {
    grid-area: img;/*display:grid;で制御するための名前をつける*/
	width: 140px;
}

#home_works_t .works_wrap .txt {
    grid-area: txt;/*display:grid;で制御するための名前をつける*/
}

/*文字位置下げ*/
#home_num_t span.lower {
    padding-top: 110px;
}

/*枠線装飾*/
#home_num_t .num_deco::before, .num_deco::after{
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    background-color: #475a9c;
    border-radius: 15px;
}

#home_num_t .num_deco::before{
	top: 49%;
    left: 32.8%;
}

#home_num_t .num_deco::after{
	top: 49%;
    left: 66.2%;
}

/*制作事例 ＞ 装飾*/
#home_case_t::before {
    content: "";
    position: absolute;
    background: url(/wordpress/wp-content/uploads/2024/09/case_deco.png)no-repeat 50% / contain;
    width: clamp(480px, 14.5vw + 305px, 585px);
    height: clamp(380px, 23.1vw + 101.6px, 547px);
    top: -8%;
    right: -8%;
}

/*会社案内 ＞ トラック装飾*/
#home_company_t .item01::before {
    position: absolute;
    content: "";
    background: url(/wordpress/wp-content/uploads/2024/09/company_deco.png) no-repeat 50% / contain;
    width: 346px;
    height: 144px;
    bottom: -30px;
    left: -30px;
}

/*工場見学 > フキダシ*/
#home_contact_t .fukidashi::before {
    position: absolute;
    content: "";
    background: #03038e;
    clip-path: polygon(50% 40%, 0 0, 100% 0);
    width: 70px;
    height: 50px;
    bottom: -35%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}

/*すべてお任せください ＞ 装飾*/
#home_contact_t .contact_deco::before {
    position: absolute;
    content: "";
    background: url(/wordpress/wp-content/uploads/2024/09/contact_deco.png)no-repeat 50% / contain;
    width: clamp(350px, 27.5vw + 20px, 548px);
    height: clamp(270px, 21.1vw + 16.6px, 422px);
    top: -28%;
    left: 0;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
H-PROMO様
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/*プロモ ＞ 疑似要素*/
#home_promo_h .txt_wrap:before {
    position: absolute;
    content: "";
    background: url(https://h-promo.jp/wordpress/wp-content/themes/generatepress_child/images/promo_window.png)no-repeat 100% / contain;
    width: clamp(90px, 1.3vw + 73.3px, 100px);
    height: clamp(95px, 1.3vw + 78.3px, 105px);
    left: -4%;
    top: 10px;
}

#home_promo_h .area_ttl:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 12px;
    top: 50%;
    right: -11px;
    transform: translateY(-50%);
    clip-path: polygon(0 0, 0% 100%, 100% 50%);
    background-color: #FF9900;
}

#home_promo_h .area_wrap:before {
    content: '';
    position: absolute;
    background: url("https://h-promo.jp/wordpress/wp-content/themes/generatepress_child/images/promo_exterior_img.png") no-repeat 100% / contain;
    width: clamp(200px, 4.7vw + 143.3px, 234px);
    height: clamp(203px, 4.8vw + 144.6px, 238px);
    left: 110%;
	z-index: 1;
}

/*プロモ ＞ スライダー画像*/
#home_promo_h .eedee-swiper-outer img,
#home_promo_h .eedee-swiper-outer > *:not(.wp-block-eedee-gutenslider__content):not(.eedee-gutenslider-pagination){
	height: calc(100svh - 200px);
	max-height: 50.25vw;
}

#home_promo_h .wp-block-eedee-block-gutenslider .swiper {
	border-radius: 50px  0px 0px 50px;
}

/*バナー ＞ 「補助金」装飾*/
#home_bnr_h span.sobig {
    font-size: 40px;
    position: relative;
    z-index: 1;
}

#home_bnr_h span.sobig::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 20px;
    background-color: #FFDD00;
    bottom: 0;
    z-index: -1;
}