@charset "UTF-8";


/* ===================================================================
　ヘッダー（追従グローバルナビ）
==================================================================== */
nav.nav-color02 a{
	color: #474141;
}

/* ===================================================================
　汎用
==================================================================== */
.brown-bg{
  	background: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/background-c.jpg') lightgray 0% 0% / 600px 300px repeat;
	color: #F1EFEB;
}
.green-bg{
/*  background: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/background-b.jpg') repeat center center;*/
	background: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/background-green.jpg') lightgray 0% 0% / 600px 300px repeat;
	color: #F1EFEB;
}
.beige-bg{
  background: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/background-a.jpg') lightgray 0% 0% / 600px 300px repeat;
	color: #474141;
}

.beige-bg a,
.beige-bg h2,
.beige-bg span.accent-font{
	color: #474141;	
}

/* ===================================================================
　page
==================================================================== */
#page{
	padding-bottom: 8.333333333333332vw;/*vw1440---120px*/
}

/* pagehead */
#pagehead{
	position: relative;
	padding: 14.027777777777779vw 0 13.506944444444443vw;
}
#pagehead h1{
	width: 75vw;
	margin: 0 auto;
	font-family: YakuHanJP, "Montserrat-Light", "IBMPlexSansJP-Regular", "Hiragino Sans", sans-serif;
	font-weight: 300;	
	color: #F1EFEB;
	font-size: 4.444444444444445vw;
	line-height: 100%;
	letter-spacing: 0.17777777777777778vw;
}
#pagehead.pagehead-brown{
  background: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/wave-divider_brown.png') no-repeat bottom center;
	background-size: 100%;
}
#pagehead.pagehead-white{
  background: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/wave-divider_white.png') no-repeat bottom center;
	background-size: 100%;
}
#pagehead.pagehead-brown h1{
	color: #474141;
}
#pagehead.pagehead-brown .btn_area{
	color: #F1EFEB;
}

/* page-inner */
#page .page-inner span.accent-font{
	margin-bottom: 1.6666666666666667vw;
}
#page .page-inner h2{
	font-family: YakuHanJP, "IBMPlexSansJP-Regular", "Hiragino Sans", sans-serif;
	font-weight: 400;	
	font-size: 2.2222222222222223vw;
	line-height: 180%;
	letter-spacing: 0.2222222222222222vw;
	margin-bottom: 1.6666666666666667vw;
}





#page .page-inner .brown-sec_in{
	padding: 8.333333333333332vw 0;
}
#page .page-inner .brown-sec_in h2{
	white-space: nowrap;
}
#page .page-inner.page-aboutus #brown-sec:nth-of-type(1) .brown-sec_in{
	padding: 8.333333333333332vw 0 6.458333333333334vw;
}
#page .page-inner.page-aboutus #brown-sec:nth-of-type(2) .brown-sec_in{
	padding: 0 0 8.333333333333332vw;
}
#page .page-inner .brown-sec_l_02,
#page .page-inner .brown-sec_r_01{
	flex-basis: 49.44444444444444vw;
	max-width: 49.44444444444444vw;
}

/* Windows用補正 */
.windows-fix #page .page-inner .brown-sec_l_02,
.windows-fix #page .page-inner .brown-sec_r_01 {
  flex-basis: 48.34vw;
  max-width: 48.34vw;
}

#page .page-inner .brown-sec_r_02,
#page .page-inner .brown-sec_l_01{
	flex-basis: 31.666666666666664vw;
	max-width: 31.666666666666664vw;
}
#page .page-inner .brown-sec_r_02{
	margin: 0 12.5vw 0 6.388888888888888vw;
	padding: 0;
}
#page .page-inner .brown-sec_l_01{
	margin: 0 6.388888888888888vw 0 12.5vw;
	padding: 0;
}





/* page-inner-sec */
.page-inner-sec{
	width: 75vw;
	margin: auto;
	padding: 5.555555555555555vw 0;
}
.page-aboutus .page-inner-sec{
	border-top: 1px solid #F1EFEB;
	border-bottom: 1px solid #F1EFEB;	
}
#page .page-inner .page-inner-sec h2{
	text-align: center;
	margin-bottom: 4.444444444444445vw;
}


/* ===================================================================
　ページネーション
==================================================================== */
.pagination-controls {
    display: flex;
    gap: 1.6666666666666667vw;
    justify-content: center;
	font-family: YakuHanJP, "Montserrat-Medium", sans-serif;
	font-weight: 500;	  
	font-size: 1.3888888888888888vw;
	line-height: normal;
	letter-spacing: 0.1111111111111111vw;
}
.green-bg .pagination-controls {
	padding: 5.555555555555555vw 0 0;
}
.beige-bg .pagination-controls {
	padding: 2.361111111111111vw 0 0;
}
.pagination-controls button.page-number {
    padding: 0.6944444444444444vw 1.25vw;
    cursor: pointer;
}
.green-bg .pagination-controls button.page-number{
	color: #F1EFEB;
}
.green-bg .pagination-controls button.active {
    border-bottom: 1px solid #F1EFEB;
}
.beige-bg .pagination-controls button.active {
    border-bottom: 1px solid #474141;
}
.pagination-controls button.prev-page,
.pagination-controls button.next-page {
	border: 1px solid #F1EFEB;
	background-color: #383333;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1.6666666666666667vw 1.6666666666666667vw;
	border-radius: 50%;
	transition: background-color 0.5s ease, transform 0.5s ease;
	z-index: 2;
	/*以下初期化*/
	position: relative!important;
	width: 3.0555555555555554vw!important;
	height: 3.0555555555555554vw!important;
	left: auto!important;
	right: auto!important;
	top: auto!important;
	bottom: auto!important;
	margin-top: 0!important;
	z-index: 0!important;
	cursor: pointer;
}

/* 右矢印アイコン（Next） */
.pagination-controls button.next-page{
  background-image: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/lucide_arrow-right-min.png');
}

/* 左矢印アイコン（Prev）※画像が左右対称でない場合は反転 */
.pagination-controls button.prev-page{
  background-image: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/lucide_arrow-right-min.png');
  transform: scaleX(-1); /* 左矢印用に反転 */
}

/* ホバー時の色変更 */
.pagination-controls button.prev-page:hover,
.pagination-controls button.next-page:hover {
  background-color: #CA6E09;
}


/*シングルページ*/
#page .prevnext .prev a:hover,
#page .prevnext .next a:hover{
	background:  #CA6E09;
}
#page .prevnext .prev a,
#page .prevnext .next a{
	border-radius: 60px;
	border: 1px solid var(--maintext-color-02, #F1EFEB);
	background: var(--background-color-02, #383333);
	padding: 0.6944444444444444vw;
	width: 3.0555555555555554vw;
	height: 3.0555555555555554vw;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: all ease 0.5s;
}
/* 左矢印アイコン（Prev）※画像が左右対称でない場合は反転 */
#page .prevnext .prev a::after{
  background-image: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/lucide_arrow-right-min.png');
  transform: scaleX(-1); /* 左矢印用に反転 */
}
#page .prevnext .prev a::after,
#page .prevnext .next a::after {
  content: "";
  display: inline-block;
  width: 3.0555555555555554vw;
  height: 3.0555555555555554vw;
  background-image: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/lucide_arrow-right-min.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.6666666666666667vw 1.6666666666666667vw;
  transition: background-color 0.5s ease, transform 0.5s ease;
  z-index: 2;
}


#page .prevnext.page_head{
	position: absolute;
	top: 15.027777777777779vw;
	right: 15vw;
}
#page .prevnext{
	display: flex;
	justify-content: center;
	gap: 1.9vw;
	align-items: center;
	margin-top: 5.555555555555555vw;
}




/* ===================================================================
　下層汎用タグなど
==================================================================== */
/*404*/
.inner-404{
	padding: 16vw 0 4vw;
}

/*table*/
#page table{
	width: 55.13888888888889vw;
	margin: 0 auto 4.444444444444445vw;
}
#page tr{
	display: flex;
	gap: 0;
	align-items: flex-start;
	padding: 1.1111111111111112vw 0;
}
#page tr:nth-of-type(1){
	padding: 0 0 1.1111111111111112vw;
}
#page tr:last-of-type{
	padding: 1.1111111111111112vw 0 0;
}
#page tr th{
	width: 12.916666666666668vw;
	margin-right: 1.1111111111111112vw;
	text-align: left;
	font-family: YakuHanJP, "IBMPlexSansJP-Medium", "Hiragino Sans", sans-serif;
	font-weight: 500;
}

/* 2カラム */
.col2{
	display: flex;
	flex-wrap: wrap;
	overflow: auto;
}
.col2 .left{
	flex-basis: 60%;
	max-width: 60%;
}
.col2 .right{
	flex-basis: 40%;
	max-width: 40%;
}

#page p{
	margin-bottom: 2em;
}


/* ===================================================================
　about us
==================================================================== */
#slideshow-aboutus{
	padding: 0 0 8.333333333333332vw;
}
#slideshow-aboutus .flex-item img{
	width: 100%;
	object-fit: cover;
}
#slideshow-aboutus .flex-item{
	margin-right: 2.7777777777777777vw;
	width: 654px;
	height: 490px;
}
#slideshow-aboutus .flex-box.second{
	animation: aboutus-slide2 60s linear infinite;
}
#slideshow-aboutus .flex-box.first{
	animation: aboutus-slide1 60s -30s linear infinite;
}
#slideshow-aboutus .flex-box{
	display: flex;
	flex-shrink: 0;
	flex-wrap: nowrap;
}
#slideshow-aboutus .slide{
	width: 100%;
	display: flex;
	overflow: hidden;
	margin-bottom: 3.888888888888889vw;
}


@keyframes aboutus-slide1 {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}
 
@keyframes aboutus-slide2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}

#slideshow-aboutus .btn a{
  margin: auto;
}



.aboutus-link {
	width: 45.83333333333333vw;/*調整*/
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 3.888888888888889vw;/*調整*/
	margin: -1.6666666666666667vw auto 0;
}
.aboutus-link-in{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
#page .aboutus-link-in p{
	margin: 1.1111111111111112vw 0 0;
	white-space: nowrap;
	font-family: YakuHanJP, "IBMPlexSansJP-Medium", "Hiragino Sans", sans-serif;
	font-weight: 500;
	line-height: normal;
}


/* ===================================================================
　サンクスページ
==================================================================== */
.page-id-28 #page .page-inner-sec p{
	margin-bottom: 3em;
}
.page-id-28 .page-inner-sec p:last-of-type{
	margin-bottom: 0;
}



/*========================================================
*
　事業案内
*
=========================================================*/
#our_service{
	padding: 8.333333333333332vw 0 4.166666666666666vw;
}
#our_service .fv-text-img .flex img{
	width: 41.458333333333336vw;
}
#our_service .fv-text-img .flex .text{
	width: 34.72222222222222vw;
}
#our_service .fv-text-img .flex h2{
	font-weight: 400;
}
#our_service .fv-text-img .flex{
	display: flex;
	padding: 0px 4.166666666666666vw 0px 12.5vw;
	justify-content: space-between;
	align-items: flex-start;
	align-self: stretch;
}
#our_service .about-stove .flex{
		display: flex;
	align-items: flex-start;
	gap: 2.2222222222222223vw;
	align-self: stretch;
	justify-content: center;
	margin-bottom: 3.888888888888889vw;
}
#our_service .about-sauna .flex{
	display: flex;
	align-items: flex-start;
	gap: 2.7777777777777777vw;
	align-self: stretch;
	justify-content: center;
	margin-bottom: 3.888888888888889vw;
}
#our_service .about-stove p.textC,
#our_service .about-sauna p.textC{
	margin-bottom: 3.888888888888889vw;
}
#our_service .about-stove h2,
#our_service .about-sauna h2{
	text-align: center;
	margin-bottom: 0.5555555555555556vw;
}
#our_service .about-sauna{
	padding-top: 8.333333333333332vw;
	margin-bottom: 5vw;
}
#our_service .flex-item .price .f16{
	font-size: 1.1111111111111112vw;
	letter-spacing: 0.1em;
	font-weight: 400;
	line-height: 100%;
}
#our_service .flex-item .price .f12{
	font-size: 0.8333333333333334vw;
	letter-spacing: 0.1em;
	font-weight: 400;
	line-height: 100%;
	margin-bottom: 1.1111111111111112vw;
}
#our_service .flex-item .f15{
	font-size: 1.0416666666666665vw!important;
	letter-spacing: 0.08333333333333333vw!important;
	font-weight: 400;
	line-height: 100%;
	margin-bottom: 1.1111111111111112vw;
}
#our_service .about-stove .flex-item .price .en-font{
	font-size: 1.3888888888888888vw;
	letter-spacing: 0.1111111111111111vw;
}
#our_service .flex-item .detail-text p.f12{
		font-size: 0.8333333333333334vw;
}
#our_service .flex-item .detail-text p{
	margin-bottom: 1.6666666666666667vw;
	line-height: 160%;
}

#our_service .flex-item .detail-text{
	margin-top: 0.5555555555555556vw;
}
#our_service .flex-item .price{
	margin-bottom: 1.1111111111111112vw;
	line-height: 1;
}
#our_service .flex-item .price .en-font{
	font-family: YakuHanJP, "Montserrat-Light", sans-serif;
	font-weight: 300;	
	font-size: 1.6666666666666667vw;
	letter-spacing: 0.13333333333333333vw;
	line-height: 100%;
	margin-bottom: 1.1111111111111112vw;
}
#our_service .about-stove .flex-item h4{
	font-size: 2.2222222222222223vw;
	letter-spacing: 0.08888888888888889vw;
}
#our_service .flex-item h3{
	font-size: 2.5vw;
	letter-spacing: 0.1vw;
	font-style: normal;
	line-height: 100%; /* 36px */
	font-family: YakuHanJP, "Montserrat-Light", sans-serif;
	font-weight: 300;	
	margin-bottom: 1.1111111111111112vw;
}
#our_service .flex-item {
	width: 35.27777777777778vw;
}
#our_service .about-sauna .main-img img {
  width: 36.94444444444444vw;
    height: 25.972222222222225vw;
    margin-bottom: 1.1111111111111112vw;
    object-fit: contain;
}
#our_service .about-stove {
	margin-bottom: 5vw;
}
#our_service .about-stove .flex-item {
	width: 32.5vw;
}
#our_service .about-stove .main-img img {
    width: 20.833333333333336vw;
    height: 20.833333333333336vw;
	margin-bottom: 1.1111111111111112vw;
    object-fit: contain;
}
#our_service .thumbs {
	display: flex;
	gap: 1rem;
	justify-content: center;
	width: 100%;
}

#our_service .thumbs img {
	width: 4.861111111111112vw;
    height: 4.861111111111112vw;
    cursor: pointer;
    opacity: 0.7;
    transition: all 0.3s;
    object-fit: cover;
}

#our_service .thumbs img:hover {
  opacity: 1;
}
#our_service .attic-banner p.textC{
	text-align: center;
	margin-bottom: 1.1111111111111112vw;
}	
#our_service .attic-banner{
	text-align: center;
}
#our_service .our-strengths{
	margin-top: 12.5vw;
}
#our_service .our-strengths h2 span{
	width: fit-content;
	margin: 1.1111111111111112vw auto 0;
}
#our_service .our-strengths .flex.padding-right{
	padding-right: 9.722222222222223vw;
}#our_service .our-strengths .flex.padding-left{
	padding-left: 9.722222222222223vw;
}
#our_service .our-strengths .strength.narrow-width .flex img{
	width: 41.66666666666667vw;
}
#our_service .our-strengths .strength.narrow-width .flex .text{
	width: 39.29722222222222vw;
}
#our_service .our-strengths .strength.narrow-width .flex{
	gap: 0 2.569444444444444vw;
	justify-content: center;
	padding-right: 4.166666666666666vw;
}
#our_service .our-strengths .strength.narrow-width{
	border: none;
}
#our_service .our-strengths .strength .flex{
	margin-bottom: 5.555555555555555vw;
}
#our_service .our-strengths .strength{
	border-bottom: 1px solid #D9D9D9;
	margin-bottom: 5.555555555555555vw;
}
#our_service .our-strengths .flex .text h2{
	font-size: 1.9vw;
	letter-spacing: 0.1em;
 	font-family: 'IBMPlexSansJP-Regular';
	margin-bottom: 1.6666666666666667vw;
}
#our_service .our-strengths .flex .text span.accent-font.orange{
	margin: 0 0 2.2222222222222223vw;
	color: #CA6E09;
	font-size: 1.3888888888888888vw;
	letter-spacing: 0.1111111111111111vw;
}
#our_service .our-strengths .flex .text{
	width: 35.2vw;
}
#our_service .our-strengths .flex img{
	width: 49.44444444444444vw;
}
#our_service .our-strengths .flex{
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-self: stretch;
}
#our_service .our-strengths h2{
	font-family: YakuHanJP, "Montserrat-Light", sans-serif;
	font-weight: 300;	
	margin-bottom: 3.888888888888889vw;
}
#our_service .our-strengths h2.midashi{
	font-size: 4.444444444444445vw;
	line-height: 100%;
	letter-spacing: 0.17777777777777778vw;
	text-align: center;
}
#our_service .flow h4{
	font-size: 1.9444444444444444vw;
	letter-spacing: 0.1em;
	margin-bottom: 0.5555555555555556vw;
}
#our_service .flow .step{
	border-radius: 40px;
	background: #CA6E09;
	display: flex;
	width: fit-content;
	padding: 0.8333333333333334vw 1.1111111111111112vw;
	justify-content: center;
	align-items: center;
	gap: 10px;
	font-family: YakuHanJP, "Montserrat-Light", sans-serif;
	font-weight: 300;	
	font-size: 0.9722222222222222vw;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.07777777777777778vw;
	z-index: 1;
}
#our_service .flow .flex{
	display: flex;
	align-items: flex-start;
	gap: 1.1111111111111112vw;
	width: 52.84722222222222vw;
	margin: 0 auto 3.888888888888889vw;
}
#our_service .flow .caution{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 8px;
	margin-left: 1.5em;
}
#our_service .flow h3{
	font-size: 1.9444444444444444vw;
	line-height: normal;
	letter-spacing: 0.19444444444444445vw;
	margin-bottom: 0.5555555555555556vw;
}
#our_service .flow p{
	margin-bottom: 0;
}
#our_service .flow svg {
    position: absolute;
    left: 13.85vw;
    top: 17vw;
    height: 43.1vw;
	width: auto;
}
#our_service .flow{
	width: 75vw;
	border-top: 1px solid #F1EFEB;
	border-bottom: 1px solid #F1EFEB;
	padding: 5.555555555555555vw 0;
	margin: auto auto 5vw;
	position: relative;
}
#our_service .flow.inner1080 h2{
	text-align: center;
	margin-bottom: 4.444444444444445vw;
}
#our_service .more-question .btn.white-arrow a {
    padding: 1.1111111111111112vw 4.027777777777778vw 1.1111111111111112vw 1.6666666666666667vw;
    width: fit-content;
    margin: auto;
}




/*========================================================
*
　施工実績、お知らせ　アーカイブページ
*
=========================================================*/
#archive-works #pagehead .pagehead-in,
#archive-news #pagehead .pagehead-in{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	width: 75vw;
	margin: 0 auto;
}
#archive-works #pagehead .pagehead-in h1,
#archive-news #pagehead .pagehead-in h1{
	width: 100%;
}


/*カテゴリータブエリア*/
.btn_area span.cat{
	display: flex;
	align-items: center;
  justify-content: flex-end;
	gap: 1.6666666666666667vw;
}
.tab_btn{
display: flex;
padding: 0.8333333333333334vw 1.1111111111111112vw;
justify-content: center;
align-items: center;
	white-space: nowrap;
gap: 0.6944444444444444vw;
border-radius: 40px;
border: 1px solid #F1EFEB;
background: #383333;
	font-family: YakuHanJP, "Montserrat-Medium", "IBMPlexSansJP-Regular", "Hiragino Sans", sans-serif;
  font-size: 0.9722222222222222vw;
  font-weight: 500;
line-height: normal;
letter-spacing: 0.07777777777777778vw;
	cursor: pointer;
	transition: background 0.5s;
}
.tab_btn.active{
background: #CA6E09;
	transition: background 0.5s;
}



/*表示切り替え*/
.tab_box .panel_area .tab_panel {
    display: none;
}
.tab_box .panel_area .tab_panel.active {
    display: block;
}



/*記事一覧表示エリア*/
.panel_area h2{
font-size: 1.3888888888888888vw;
line-height: 150%;
letter-spacing: 0.1388888888888889vw;
	margin-bottom: 1.6666666666666667vw;
}



#archive-works .tab_box {
  padding: 8.819444444444445vw 0 0;
}
#archive-works .panel_area ul {
	width: 88.19444444444444vw;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4.166666666666666vw 2.2222222222222223vw;
	margin: auto;
}


#archive-works .tab_box {
  padding: 8.819444444444445vw 0 0;
}
#archive-works .panel_area ul {
	width: 88.19444444444444vw;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4.166666666666666vw 2.2222222222222223vw;
	margin: auto;
}

#archive-works .panel_area ul li .eyecatching a{
	display: block;
	width: 27.916666666666668vw;
	height: 20.90277777777778vw;
	position: relative;
}
#archive-works .panel_area ul li img{
	display: block;
	width: 27.916666666666668vw;
	height: 20.90277777777778vw;
	object-fit: cover;
}
#archive-works .panel_area ul li .eyecatching a::before{
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.6);
  mix-blend-mode: multiply;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.8s ease;
  z-index: 1;
}
#archive-works .panel_area ul li .eyecatching a:hover::before {
  opacity: 1;
}
#archive-works .panel_area ul li .eyecatching a span{
  opacity: 0;	
	z-index: 2;
  transition: opacity 0.8s ease;
	position: absolute;
	top: 7.777777777777778vw;
	left: 50%;
	transform: translateX(-50%);
	font-family: YakuHanJP, "Montserrat-Medium", sans-serif;
  font-size: 1.0416666666666665vw;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.08333333333333333vw;
}
#archive-works .panel_area ul li .eyecatching a::after {
  content: "";
  display: inline-block;
  width: 3.0555555555555554vw;
  height: 3.0555555555555554vw;
  border: 1px solid #F1EFEB;
  background-color: #383333;
  background-image: url('https://yume-sauna.jp/wp/wp-content/uploads/2025/06/lucide_arrow-right-min.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.6666666666666667vw 1.6666666666666667vw;
  border-radius: 50%;
  z-index: 2;
  opacity: 0;
  transition: opacity 0.8s ease;
	position: absolute;
	top: 10.13888888888889vw;
	left: 50%;
	transform: translateX(-50%);
}
#archive-works .panel_area ul li .eyecatching a:hover::before,
#archive-works .panel_area ul li .eyecatching a:hover span,
#archive-works .panel_area ul li .eyecatching a:hover::after {
  opacity: 1;
}




#archive-news .tab_box {
  padding: 5.486111111111111vw 0 0;
}
#archive-news .panel_area ul {
	width: 72.77777777777777vw;
	margin: auto;
	border-bottom: 1px solid #474141;
  list-style: none;
  padding: 0;
	border-top: 1px solid #4A7061;
	border-bottom: 1px solid #4A7061;
}
#archive-news .panel_area ul li.news-item {
  display: flex;
  gap: 1.1111111111111112vw;
  padding: 1.1111111111111112vw;
  border-bottom: 1px solid #4A7061;
}
#archive-news .panel_area ul li.news-item:last-child {
  border-bottom: none;
}

#archive-news .panel_area ul .left img {
  width: 10.416666666666668vw;
  height: 10.416666666666668vw;
  object-fit: cover;
  display: block;
}

#archive-news .panel_area ul .right {
  flex: 1;
  padding: 1.1111111111111112vw 0;
}

#archive-news .panel_area ul .right .slide-title{
	display: flex;
	justify-content: space-between;
	align-items: center;		
  margin-bottom: 1.1111111111111112vw;
}
#archive-news .panel_area ul .right .slide-title h3 {
  font-size: 1.25vw;
  line-height: normal;
  letter-spacing: 0.125vw;
  white-space: normal;
  margin: 0;
}
#archive-news .panel_area ul .right p{
	font-family: YakuHanJP, "IBMPlexSansJP-Medium", "Hiragino Sans", sans-serif;
  font-size: 0.9722222222222222vw;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.09722222222222222vw;
  margin-bottom: 0;
}


#archive-news .panel_area h2{
	font-family: YakuHanJP, "IBMPlexSansJP-Medium", "Hiragino Sans", sans-serif;
	font-weight: 500;
font-size: 1.3888888888888888vw;
line-height: normal;
letter-spacing: 0.1388888888888889vw;
	margin-bottom: 0;
}
#archive-news .panel_area p{
	margin-bottom: 0;
}
#archive-news .panel_area ul li .eyecatching img{
	display: block;
	width: 10.416666666666668vw;
	height: 10.416666666666668vw;
	object-fit: cover;
}
#archive-news .panel_area ul li .title-txt{
	width: 61.111111111111114vw;
}
#archive-news .panel_area ul li .title-txt-in{
display: flex;
justify-content: space-between;
align-items: center;
align-self: stretch;	
	margin-bottom: 1.1111111111111112vw;
}



.date{
	display: inline-block;
	font-family: YakuHanJP, "Montserrat-Medium", sans-serif;
  font-size: 1.0416666666666665vw;
  font-weight: 500;
	line-height: normal;
	letter-spacing: 0.08333333333333333vw;
	margin-right: 1.1111111111111112vw;
}
.category{
	display: inline-block;
	font-family: YakuHanJP, "Montserrat-Medium", "IBMPlexSansJP-Regular", "Hiragino Sans", sans-serif;
  font-size: 0.9722222222222222vw;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.09722222222222222vw;
}
.category span{
	margin-right: 0.5555555555555556vw;
}



/* ===================================================================
施工事例シングル
==================================================================== */
article.works-single{
	padding-bottom: 8.368055555555555vw;
	border-bottom: 1px solid #F1EFEB;
}
.beige-bg article.works-single{
	border-bottom: 1px solid #474141;
}
.works-single #pagehead .pagehead-in{
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	width: 75vw;
	margin: 0 auto;
}
.works-single #pagehead h1 .flex{
	display: flex;
	margin-top: 1.6666666666666667vw;
}
.works-single #pagehead h1 .title::before{
	content: "";
	width: 3.4722222222222223vw;
	height: 1px;
	background: #F1EFEB;
	position: absolute;
	left: 0.5555555555555556vw;
    top: 0.7em;
}
.works-single #pagehead h1 .title{
	position: relative;
    color: #F1EFEB;
    font-family: YakuHanJP, "IBMPlexSansJP-Regular", "Hiragino Sans", sans-serif;
    font-size: 1.25vw;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.125vw;
    padding-left: 4.583333333333333vw;
    vertical-align: middle;
    margin-top: 1.1111111111111112vw;
}
.beige-bg .works-single #pagehead h1 .title::before{
	background: #474141;
}
.beige-bg .works-single #pagehead h1 .title{
	color: #474141;	
}
.works-single-related-posts ul li .eyecatching a::after {
    content: "";
    display: inline-block;
    width: 3.0555555555555554vw;
    height: 3.0555555555555554vw;
    border: 1px solid #F1EFEB;
    background-color: #383333;
    background-image: url(https://yume-sauna.jp/wp/wp-content/uploads/2025/06/lucide_arrow-right-min.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.6666666666666667vw 1.6666666666666667vw;
    border-radius: 50%;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.8s ease;
    position: absolute;
    top: 10.13888888888889vw;
    left: 50%;
    transform: translateX(-50%);
}
.works-single-related-posts ul li .eyecatching a:hover::after,
.works-single-related-posts ul li .eyecatching a:hover::before,
.works-single-related-posts ul li .eyecatching a:hover span {
	opacity: 1;
}
.works-single-related-posts ul li .eyecatching a span {
    opacity: 0;
    z-index: 2;
    transition: opacity 0.8s ease;
    position: absolute;
    top: 7.777777777777778vw;
    left: 50%;
    transform: translateX(-50%);
    font-family: YakuHanJP, "Montserrat-Medium", sans-serif;
    font-size: 1.0416666666666665vw;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.08333333333333333vw;
}
.works-single-related-posts h3 span{
    position: relative;
    display: block;
    color: #F1EFEB;
    font-family: YakuHanJP, "IBMPlexSansJP-Regular", "Hiragino Sans", sans-serif;
    font-size: 1.25vw;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.125vw;
    padding-left: 1.2em;
    width: fit-content;
    vertical-align: middle;
    margin: 0.5555555555555556vw auto 0;
}
.works-single-related-posts h3{
	margin-bottom: 5.555555555555555vw;
	text-align: center;
	font-size: 1.9444444444444444vw;
	font-family: YakuHanJP, "Montserrat-Medium", sans-serif;
}
.works-single-related-posts{
	padding-top: 5.555555555555555vw;
}
.works-single-related-posts ul li img {
    display: block;
    width: 27.916666666666668vw;
    height: 20.90277777777778vw;
    object-fit: cover;
}
.works-single-related-posts h2 {
    font-size: 1.3888888888888888vw;
    line-height: 150%;
    letter-spacing: 0.1388888888888889vw;
    margin-bottom: 1.6666666666666667vw;
}
.works-single-related-posts ul li .eyecatching a {
    display: block;
    width: 27.916666666666668vw;
    height: 20.90277777777778vw;
    position: relative;
}
.works-single-related-posts ul li .eyecatching a::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    mix-blend-mode: multiply;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.8s ease;
    z-index: 1;
}
.works-single-related-posts ul {
    width: 88.19444444444444vw;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4.166666666666666vw 2.2222222222222223vw;
    margin: auto;
}
.section-title-02{
	text-align: center;
	padding: 5.555555555555555vw 0 0;/*vw1440--- 80px 0*/
}
.section-title-02 h1{
	font-size: 1.9444444444444444vw;/*vw1440--- 28pxx*/
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 0.1em;
    margin: 1.1111111111111112vw 0 2.2222222222222223vw;/*vw1440---16px 0 0 32px*/
}
.section-title-02 .date{
	display: inline-block;
	font-size: 1.0416666666666665vw;
}
.section-title-02 .date{
	display: inline-block;
	font-size: 0.9722222222222222vw;
}


/*スライド*/
.works-single .image-slider-wrap{
	margin-top: 3.2638888888888893vw;
}
.works-single .image-slider, .image-slider-nav {
  padding: 0;
  margin: 0;
}

.works-single .image-slider li, .image-slider-nav li {
  list-style: none;
}

.works-single .slide-field-area .slick-slide img {
    width: 100%;
    height: 41.66666666666667vw;
    max-height: 59.72222222222222vw;
    object-fit: cover;
}		
.works-single .image-slider-nav img {
  width: 100%;
  height: auto;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.3s;
}

.works-single .image-slider-nav img:hover {
  opacity: 1;
}
.works-single .image-slider .slick-slide {
  opacity: 0.3;
}

.works-single .image-slider .slick-center {
  opacity: 1;
}
.works-single .image-thumbs {
  display: flex;
  justify-content: center;
  gap: 1.6666666666666667vw;
  flex-wrap: wrap; /* or nowrap depending on design */
  margin-top: 1.6666666666666667vw;
  padding: 0;
  list-style: none;
}

.works-single .image-thumbs li {
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.3s;
  width: 4.861111111111112vw; /* サムネイルサイズ調整 */
	height: 4.861111111111112vw;
}

.works-single .image-thumbs li:hover,
.works-single .image-thumbs li.active {
  opacity: 1;
}

.works-single .image-thumbs img {
  width: 100%;
  height: 100%;
	object-fit: cover;
  display: block;
}

.works-single .works-sec{
	display: flex;
	width: 55.55555555555556vw;/*vw1440---800px*/
	margin: 0 auto 2.2222222222222223vw;/*vw1440---32px*/
	padding: 2.7777777777777777vw;/*vw1440---40px;*/
	justify-content: space-between;
	align-items: center;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.10);
	background: rgba(255, 255, 255, 0.10);
}

.works-single .works-sec h2{
	font-size: 1.3888888888888888vw;/*vw1440---20px*/
	line-height: 100%;
	letter-spacing: 0.2222222222222222vw;/*vw1440---3.2px*/
}
.works-single .achievement-box{
	font-size: 1.0416666666666665vw;
	font-style: normal;
	font-weight: 400;
	line-height: 220%; /* 33px */
	letter-spacing: 0.1em;
	background: var(--background-color-02, #383333);
	padding: 16px;
	margin-bottom: 3.888888888888889vw;
}
.works-single .under_article_img_wrap img{
	width: 17.36111111111111vw;
	height: 23.125vw;
	object-fit: cover;
}
.works-single .under_article_img_wrap{
	display: flex;
	gap: 0 1.7361111111111112vw;
	justify-content: center;
	margin: 5.555555555555555vw auto 0;
}
/*table*/
#page .works-sec table{
	width: 38.88888888888889vw;/*vw1440---560px*/
	margin: 0;
	border: 0;
}
#page .works-sec tr{
	gap: 2.2222222222222223vw;/*vw1440---32px*/
	margin-bottom: 1.6666666666666667vw;/*vw1440---24px*/
	padding: 0;
	border: 0;
}
#page .works-sec tr th{
	width: 5.2vw;/*調整*/
}
#page .works-sec tr td{
	width: 27.77777777777778vw;/*vw1440---400px*/
}
#page .works-sec table a{
	color: #949494;
	font-family: "Jost-SemiBold", sans-serif;
	font-size: 0.9722222222222222vw;/*vw1440---14px*/
	line-height: 100%;
	letter-spacing: 0.07777777777777778vw;/*vw1440---1.12px*/
	text-decoration-line: underline;
}
#page .works-sec table a.works-pf-link{
	display: block;
	margin-top: 0.5555555555555556vw;/*vw1440---8px*/
}

#page .sns-share {
	margin-top: 5.555555555555555vw;
}
#page .sns-share p.textC{
	margin-bottom: 0.5555555555555556vw;
}
.sns-btn-wrap div svg{
    width: 3.0555555555555554vw;
    height: 3.0555555555555554vw;
}
.sns-btn-wrap div {
    width: 3.0555555555555554vw;
    height: 3.0555555555555554vw;
}
.sns-btn-wrap div a rect{
	    transition:  all 0.5s ease;
}
.sns-btn-wrap div a:hover rect{
	fill:#CA6E09;
}
.sns-btn-wrap div a {
	
    display: block;
    width: 3.0555555555555554vw;
    height: 3.0555555555555554vw;
    position: relative;
}
.sns-share .sns-btn-wrap{
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 1.6666666666666667vw;
}

.sns-box-wrap{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2.7777777777777777vw;/*vw1440---40px*/	
	width: 38.88888888888889vw;/*vw1440---560px*/
}
.sns-box-in{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.1111111111111112vw;/*vw1440---16px*/
}
.sns-box_l img{
	width: 4vw;/*調整*/
	height: 4vw;
	object-fit: contain;
}
.sns-box_r p:nth-of-type(1){
	line-height: 100%;
	margin-bottom: 0.5555555555555556vw;/*vw1440---8px*/
}
.sns-box_r p:nth-of-type(2){
	font-size: 0.8333333333333334vw;/*vw1440---12px*/
	line-height: 100%;
	letter-spacing: 0.13333333333333333vw;/*vw1440---1.92px*/
}


.works-sec02{
	width: 55.55555555555556vw;/*vw1440---800px*/
	margin: auto;
	text-align: justify;
	font-size: 1.0416666666666665vw;/*vw1440---15px*/
	letter-spacing: 0.15555555555555556vw;/*vw1440---2.24px*/
}
.works-sec02 p{
	margin-bottom: 1.5555555555555556vw;/*vw1440---22.4px*/
}

/********************************************************
*
			お問い合わせ
*
*********************************************************/
.page-contact-top{
	display: flex;
	justify-content: center;
	align-items: center;		
  gap: 2.2222222222222223vw;
	margin: 2.7083333333333335vw 0 3.888888888888889vw;
}
.page-contact-top .btn span{
	font-size: 1.25vw;
	letter-spacing: 0.15vw;	
}



.page-contact .form-t{
	width: 12.916666666666668vw;
}
.page-contact .form-d{
	width: 34.583333333333336vw;
}
.page-contact .form-l{
	display: flex;
	align-items: center;
	gap: 1.1111111111111112vw;
	font-family: YakuHanJP, "IBMPlexSansJP-Medium", "Hiragino Sans", sans-serif;
	font-weight: 500;
}
.page-contact .form-l-last{
	align-items: start;
}
.page-contact .page-inner span.required{
	color: #CA6E09;
	font-size: 0.9722222222222222vw;
	letter-spacing: 0.09722222222222222vw;
	margin-left: 0.6944444444444444vw;
	display: inline-block;
}
.page-contact .page-inner .form-l-last span.required{
	margin: 0 0 1.1111111111111112vw 0;
}
.page-contact .page-inner{
	width: 56.388888888888886vw;
	margin: 0 auto 8.333333333333332vw;
}
.page-contact-middle{
	border-top: 1px solid #383333;
	border-bottom: 1px solid #383333;
	padding: 2.7777777777777777vw 3.888888888888889vw;
}
.page-contact-middle p.textC{
	font-family: YakuHanJP, "IBMPlexSansJP-Medium", "Hiragino Sans", sans-serif;
	font-weight: 500;
}


#mailform input[type="text"],
#mailform input[type="email"],
#mailform textarea{
	width: 100%;
	border: 0;
  box-sizing: border-box;	
  background: #F5F5F5;
	outline: 0;	
	padding: 0.5555555555555556vw 1.1111111111111112vw;
	font-family: YakuHanJP, "IBMPlexSansJP-Regular", "Hiragino Sans", sans-serif;
	font-size: 0.9722222222222222vw;
	font-weight: 400;
	line-height: 160%;
	letter-spacing: 0.09722222222222222vw;	
	border: 1px solid #D4D3D3;
	background: #F1EFEB;
}
#mailform input,
#mailform textarea,
#mailform select{
	text-align: justify;
}
#mailform textarea{
  resize: none;/* 右下の伸縮マークを消す */
}

/*入力内容アラート*/
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  border-color: #CA6E09!important;
	color: #CA6E09!important;
}


/* 独自チェックボックス */
#mailform input[type=checkbox] {
    display: none;
}
#mailform .list label span {
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    padding: 0 0 0 2.2222222222222223vw;
    position: relative;
    width: auto;
}
#mailform .wpcf7-list-item {
  display: block;
  margin: 0 0 0 -2.2222222222222223vw;
}
#mailform .list label span::before {
    content: '';
    display: block;
		border: 1px solid #D4D3D3;
		background: #F1EFEB;
    margin-top: -0.65vw;
    position: absolute;
    left: 0;
    top: 50%;
    width: 1.25vw;
    height: 1.25vw;
}
#mailform .list label span::after {
    content: '';
    display: block;
    border-right: 1.5px solid #F1EFEB;
    border-bottom: 1.5px solid #F1EFEB;
    height: 0.7vw;
    left: 0.45vw;
    margin-top: -0.5vw;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: rotate(45deg);
    width: 0.35vw;
}
#mailform input[type=checkbox]:checked + .wpcf7-list-item-label::before {
    background: #383333;
		border: 1px solid #383333;
}
#mailform input[type=checkbox]:checked + .wpcf7-list-item-label::after {
    opacity: 1;
}


/* 送信ボタン */
#page .wpcf7 .submit-btn p {
  margin-bottom: 0;
}
.wpcf7 input[type="submit"]{
  display: block;
  margin: auto;
  padding: 1.1111vw 4.583333333333333vw 1.1111vw 2.2222222222222223vw;
  background: #383333;
  color: #F1EFEB;
  border: 1px solid #F1EFEB;
  cursor: pointer;
  text-align: center;
  font-size: 1.25vw;
  letter-spacing: 0.15vw;
  font-family: YakuHanJP, "IBMPlexSansJP-Medium", "Hiragino Sans", sans-serif;
  font-weight: 500;
  line-height: normal;
  border-radius: 40px;
  transition: all 0.8s;
}

.wpcf7 input[type="submit"]:hover {
  background: #CA6E09;
}
.wpcf7 .submit-btn{
  position: relative;	
	margin: auto;
  width: 18.88888888888889vw;
	height: 4.444444444444445vw;
}
.wpcf7 .submit-btn::after {
  content: '';
  position: absolute;
  top: 45%;
  transform: translateY(-45%);
  right: 1.8vw;
  width: 1.6667vw;
  height: 1.6667vw;
  aspect-ratio: 1 / 1;
  background: url(https://yume-sauna.jp/wp/wp-content/uploads/2025/06/lucide_arrow-right-min.png) no-repeat;
  background-size: cover;
  transition: all 0.8s;
}
.wpcf7 .submit-btn:hover:after {
  right: 1.35vw;
}