* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}


html {
height: 100%;
width: 100%;
font-size: 62.5%; 
}

body {
counter-reset: number 0;
text-align:left;
font-family: "Noto Sans JP","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN",sans-serif,"游ゴシック",YuGothic,"メイリオ",Meiryo;
font-size: 17px;
font-weight:400;
line-height:1.9;
margin:0px;
padding:0px;
background-color:#fff;
background-image: url("../images/common/bg04.jpg");
-webkit-text-size-adjust: 100%;
color:#1e1716;
word-wrap: break-word;
overflow-wrap: break-word;
}
@media screen and (min-width: 681px) {
body {
min-width:1280px !important;
height:100%;
}
}
@media screen and (max-width:680px){
body { 
font-size: 16px; 
border:none;
}
}

body.no-scroll {
overflow: hidden;
}

.l-header{
	width:100%;
	height:120px;
	display: flex;
	justify-content: space-between;
	position: fixed;
	z-index:999;
}

body#toppage .l-header{
	background-color:rgba(29,35,53,0.9);
}
@media screen and (max-width: 680px) {
body#toppage .l-header{
	background-color:rgba(29,35,53,1.0);
}
}
body.kasou .l-header{
	background-color:rgba(29,35,53,1.0);
}

.l-header__inner{
width:380px;
}
.l-header__inner:before {
	content: "";
	width: 100%;
	height: 85px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -100;
}
.sp-menubtn{
	display: none;
}
.menu__inner{
	overflow:hidden;
	margin-right:15px;
}
.menu__item{
float:left;
}
.menu__link{  /* 親 */
	display:block;
	color:#fff;
	height:100%;
	text-decoration: none;
	padding:0px 20px;
	line-height:66px;
		font-size:16px;
	font-weight:600;
	cursor: pointer;
}





/* megamenu ------------------------------ */
.menu__contents{ 
	display: none;
	position:absolute;
	top:100%;
	left:0;
	width: calc(100% - 150px);
	background: #fdfdfd;
	border-bottom:#ccc solid 1px;
	padding:45px 0 35px;
	width:100%;
	overflow:hidden;
}
.menu__contents_inner{
	max-width:1200px;
	margin:0 auto;
 overflow: hidden;	
}

.submenu_close{
text-align: right;
position: absolute;
right: 20px;
bottom: 0px;
font-size: 48px;
font-weight: 900;
color: #ccc;
cursor: pointer;
padding: 0 20px;
}
@media screen and (max-width: 680px) {
.submenu_close{
display:none;
}
}

.mega_ttl{
float:left;
width:20%;
padding:32px 20px 20px;
}
.mega_ttl_img{
width:200px;
}
.mega_ttl_text{
width:100%;
font-weight:900;
font-size:18px;
margin:8px 0 0;
color:#4b3d34;
text-align: center;
}
.menu__contents ul {
float:right;
width:78%;
	display: flex;
	justify-content: space-between;
	display: block;
	overflow:hidden;
	padding:20px;
}
.menu__contents ul li{
	width: 33%;
	float:left;	
}
.menu__contents ul li a{
	display:block;
	line-height: 1.0;
	width:100%;
	padding:15px 15px 15px 47px;
	text-decoration: none;
	font-size:17px;
	font-weight:700;
	color:#4b3d34;
	transition: .5s;
background-image: url("../images/common/ico_arrow_square.png");
background-repeat:no-repeat;
background-size:22px;
background-position:15px 14px;
	}
.menu__contents ul li a:hover{
	background-color:#d8d4d0;
	}
/* megamenu end ------------------------------ */

@media screen and (min-width: 681px) {
.spContect{
display: none;
}
}

@media screen and (max-width: 680px) {
	.l-header{
		height:65px;
	}
	.l-header__inner:before {
		height: 65px;
	}
	.l-header__inner{
		width:100%;
		height:65px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	body.no-scroll .spContect{
	display: none;
	}
		.sp-menubtn {
		width: 70px;
		height: 100%;
		position: relative;
		display: block;
		z-index: 5000;
		border: none;
		cursor: pointer;
		border-left: #505566 solid 1px;
	}	
	body.no-scroll .sp-menubtn {
 border:none;
	}
	
	
	
	.sp-menubtn span {
		display: block;
		overflow: hidden;
		white-space: nowrap;
		text-indent: 100%;
		width: 22px;
		height: 3px;
		background: #FFFFFF;
		position: absolute;
		transition: 0.2s;
		left: 50%;
		top: 50%;
	}	
	.sp-menubtn span:nth-child(1) {
		transform: translate(-50%, -9px);
	}	
	.sp-menubtn span:nth-child(2) {
		transform: translate(-50%, -50%);
	}	
	.sp-menubtn span:nth-child(3) {
		transform: translate(-50%, 6px);
	}	
	.sp-menubtn.active span {
		width: 25px;
		height: 2px;
	}	
	.sp-menubtn.active span:nth-child(1) {
		transform: translate(-50%, 50%) rotate(45deg);
	}	
	.sp-menubtn.active span:nth-child(2) {
		opacity: 0;
		left: 50%;
	}	
	.sp-menubtn.active span:nth-child(3) {
		transform: translate(-50%, 50%) rotate(-45deg);
	}
	.menu {
		position: fixed;
		padding-top:11px;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #4d4d4d;
		background:rgba(52,53,59,1.0);
		color: #FFFFFF;
		overflow: auto;
		opacity: 0;
		visibility: hidden;
		transition: opacity .6s ease, visibility .6s ease;
	}
	.menu.active{
		opacity:100;
		visibility: visible;
	}
	
	.menu__inner {
		display:block;
		height:auto;
		width: 72.16vw;
		margin-left: auto;
		margin-right: auto;
		padding: 20px 0 0;
	}	
	.menu__item {
		border-bottom:#7a7d84 solid 1px;
		width: 100%;
		position: relative;
	}		
	.menu__link {
		font-weight: bold;
		font-size: 1.5rem;
		height: 55px;
		line-height:55px;
		align-items: center;
		padding:0 8px;

	}	
	.menu__contents{
		display: none;
		position:static;
		width:100%;
		padding:0;
		background: none;
		border:none;
	}
		.mega_ttl{
display:none;
}
.menu__contents ul {
float:none;
width:100%;
	display: block;
	overflow:hidden;
	padding:0;
	margin-bottom:20px;
}
		.menu__contents ul li{
		width: 100%;
		height:auto;
		/* border-bottom:#ccc solid 1px; */
		    position: relative;
	}
	.menu__contents ul li a{
		color:#fff;
		display:block;
		line-height:1.5;
		font-size:14px;
		font-weight:400;
		padding:10px 14px 10px 36px;
		background-size: 14px;
		background-position: 4px 18px;
		background: none;
	}
	
		.menu__contents ul li::before {
    content: "";
    position: absolute;
    top: 19px;
    left: 20px;
    width: 2px;
    aspect-ratio: 1 / 1;
    border: 1px solid;
    background-color: #fff;

}
	
	
	.menu__item.sub::after{
		content: "";
		position: absolute;
		right: 20px;
		top:24px;
		transform:translateY(-50%);
		transition: all 0.2s ease-in-out;
		display: block;
		width: 4px;
		height: 4px;
		border-top: solid 2px #E5E5E5;
		border-right: solid 2px #E5E5E5;
		-webkit-transform: rotate(135deg);
		transform: rotate(135deg);
	}
	.menu__item.sub.active::after{
		content: "";
		position: absolute;
		right: 20px;
		top:24px;
		transform:translateY(-50%);
		transition: all 0.2s ease-in-out;
		display: block;
		width: 4px;
		height:4px;
		border-top: solid 2px #E5E5E5;
		border-right: solid 2px #E5E5E5;
		-webkit-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	
	.menu__item.subno::after{
		content: "";
		position: absolute;
		right: 20px;
		top:24px;
		transform:translateY(-50%);
		transition: all 0.2s ease-in-out;
		display: block;
		width: 4px;
		height: 4px;
		border-top: solid 2px #E5E5E5;
		border-right: solid 2px #E5E5E5;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);

	}

.spContect{
	width: 57px;
	height: 100%;
	position: absolute;
	right:58px;
	top:0;
	display: block;
	z-index: 5000;
	border: none;
	cursor: pointer;
	border-left: #505566 solid 1px;
background-image: url("../images/common/ico_mail.svg");
background-repeat: no-repeat;
background-size: 26px;
background-position: 50% 50%;
}
.spContect a{
color:#fff;
display: block;
height:100%;
}
.spContect a i{
line-height:65px;
padding-left:18px;
}
.fa {
font-size: 24px !important;
}
}




/* header ------------------------------ */
.header-logo{
margin:0 0 0 15px;
width:100%;
}
.header-logo img{
width:330px;
height:auto;
}
.header-logo h1{
color:#fff;
font-size:11px;
letter-spacing: -1px;
margin:8px 10px 6px; 
}
@media screen and (max-width: 680px) {
.header-logo{
margin: 0 0 0 10px;
}
h1{
display: none;
}
.header-logo img{
width:210px;
}
}


.spmenu_logo{
display: none;
}
@media screen and (max-width: 680px) {
.spmenu_logo{
margin-left: 10px;
display: block;
}
.spmenu_logo img{
width:210px;
height:auto;
}
}

nav.menu{
margin-top:54px;
}
.submenu{
position: absolute;
top:0;
right:10px;
}
@media screen and (max-width: 680px) {
nav.menu{
margin-top:0px;
}
.submenu{
position: relative;
top:0;
right:0;
width: 72.16vw;
margin:0 auto;
}
}
	
.submenu ul{
overflow:hidden;
line-height:1.5;
}
.submenu li{
float:left;
color:#fff;
}
.submenu li a{
text-decoration:none;
color:#ebe7df;
display: block;
line-height:1.3;
transition: 0.5s
}
.submenu li:first-child a,
.submenu li:nth-child(2) a{
border:#7a7d84 solid 1px;
padding:8px 20px 10px 47px;
font-size:14px;
width:178px;
margin:16px 5px 0;
background-repeat:no-repeat;
background-position:12px 6px;
}
.submenu li:first-child a{
background-image: url("../images/common/ico_note.svg");
background-size:24px;
}
.submenu li:nth-child(2) a{
background-image: url("../images/common/ico_schedule.svg");
background-size:20px;
}
.submenu li:first-child a:hover,
.submenu li:nth-child(2) a:hover{
background-color: #3a4056;
}
.submenu li:nth-child(7){
text-align:center;
font-size:18px;
font-weight:700;
padding:0px 10px 10px 15px;
margin:14px 5px 0;
line-height:1.2;
background-image: url("../images/common/ico_phone.svg");
background-repeat:no-repeat;
background-size:16px;
background-position:12px 0px;
}
.submenu li:nth-child(7) .header_time{
font-size:12px;
}
.submenu li:last-child a{
background-color: #ca5d13;
text-align:center;
padding:8px 20px 10px;
width:260px;
margin:16px 5px 0;
font-weight:700;
}
.submenu li:last-child a:hover{
background-color: #dba682;
}
		@media screen and (max-width: 680px) {
		nav.menu{
margin-top:0px;
padding-bottom: 130px;
}
.submenu{
position: relative;
top:0;
right:0;
width: 72.16vw;
margin:10px auto;
}
}

/* hover effect  */

@media only screen and (min-width:1281px){
.menu__link {
position: relative;
display: inline-block;
text-decoration: none;
}
.menu__link::before {
content: '';
position: absolute;
width: 0;
height: 3px;
bottom: 0;
left: 50%;
background-color:#ca5d13;
transition: width 0.3s ease, left 0.3s ease;
}
.menu__link:hover::before {
width: 100%;
left: 0;
}
}

.menu__item.active > a,
.menu__item.active > span{
color: #ec843d;
}

@media only screen and (max-width:680px){
.menu__link span{
font-weight:normal;
}
.submenu li{

}
.submenu li.half{
width:49%;
}
.submenu li.all{
width:100%;
}

.submenu li:nth-child(1),
.submenu li:nth-child(3),
.submenu li:nth-child(5){
margin-right:2%;
}

.submenu li:first-child a,
.submenu li:nth-child(2) a{
padding:16px 6px 16px 24px;
font-size:13px;
width:100%;
margin:16px 0px 15px;
background-position: 8px 14px;
text-align:center;
}

.submenu li.sp_sub{
margin-bottom:6px;
}

.submenu li a.ico_ya::before {
border:none;
}
.submenu li:first-child a{
background-size: 18px;
}
.submenu li:nth-child(2) a{
background-size: 16px;
}

.submenu li.sp_sub a{
background-color: #52535a;
font-size:14px;
text-align:center;
padding:14px 8px;
}

 

.submenu li:nth-child(7){
padding:0;
margin: 4px 0 0;
background-image: url(../images/common/ico_phone.svg);
background-repeat: no-repeat;
background-size: 16px;
background-position: calc(50% - 75px) 20px;
}
.submenu li:nth-child(7) a{
padding: 3px 10px 5px 15px;
display: block;
margin: 16px 0 0;
width:100%;
line-height: 1.4;
}
.submenu li:last-child a {
padding: 16px 20px 18px;
margin: 16px 0 0;
width: 100%;
}
}


/* common ---------------------------------------- */
main{
position:relative;
}

body.kasou main{
position:relative;
padding-top:120px;
}
@media only screen and (max-width:680px){
body.kasou main{
padding-top:65px;
}
}


/* sub midashi　------------- */
.common_ttl{
text-align: center;
line-height:1.4;
}
.common_ttl_en{
color:#c5c1bf;
font-weight:900;
font-size:74px;
margin-bottom:10px;
}
.common_ttl_jp{
font-weight:700;
font-size:24px;
}
.common_ttl_jp{
position: relative;
display: inline-block;
padding: 0 120px;
letter-spacing: 1px;
}
.common_ttl_jp:before, .common_ttl_jp:after {
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 100px;
height: 1px;
background-color: black;
}
.common_ttl_jp:before {
left:0;
}
.common_ttl_jp:after {
right: 0;
}
@media screen and (max-width:680px){
.common_ttl{
width:90%;
margin:0 auto 40px;
}
.common_ttl_en{
color:#c5c1bf;
font-size:50px;
}
.common_ttl_jp{
font-weight:700;
font-size:18px;
padding: 0 50px;
}
.common_ttl_jp:before, .common_ttl_jp:after {
width:40px;
}
}



/* footer ---------------------------------------- */

/* footer contact ----------- */

#fotter_contact{
background-image:url("../images/top/footer_contact_bg.jpg");
background-repeat:no-repeat;
background-size:cover;
background-position:top right;
padding:80px 0;
}
@media only screen and (max-width:680px){
#fotter_contact{
padding:50px 0;
}
}
.fotter_contact_inner{
max-width:1200px;
margin:0 auto;
background-color:#e3e4e6;
padding:40px 150px 60px
}
@media only screen and (max-width:680px){
.fotter_contact_inner{
width:90%;
padding:40px 20px 60px
}
}

.contact_box{
overflow:hidden;
max-width:920px;
margin:0 auto;
display: flex;
}
@media only screen and (max-width:680px){
.contact_box{
display: block;
max-width:360px;
}
}

.contact_tel,
.contact_mail{
margin:0 6px;
}
.contact_tel a{
font-size:40px;
font-weight:900;
padding:18px;
width:448px;
background-color:#fff;
text-align:center;
display:block;
line-height:1.2;
color:#253453;
}
@media only screen and (max-width:680px){
.contact_tel a{
font-size:24px;
width:100%;
margin-bottom:20px;
border-radius:40px;
padding:10px;
}
}


.contact_tel a span{
font-size:14px;
font-weight:400;
display:block;
}
.contact_mail a{
width:448px;
background-color:#ca5d13;
color:#fff;
font-size:24px;
font-weight:900;
text-align:center;
display:block;
padding:28px 28px 28px 74px;
background-image:url("../images/common/ico_mail.svg");
background-repeat:no-repeat;
background-size:40px;
background-position:34px 31px;
}
@media only screen and (max-width:680px){
.contact_tel a span{
font-size:13px;
}
.contact_mail a{
width:100%;
font-size:18px;
padding:20px 20px 20px 50px;
background-size:30px;
border-radius:35px;
background-position: calc(50% - 95px) 23px;
}
}

/* footer guide ----------------------- */

#footer_guide{
max-width:1200px;
margin:0 auto;
padding:100px 0 100px;
display: flex;
}
@media only screen and (max-width:680px){
#footer_guide{
padding:60px 0;
display: block;
width:90%;
max-width:480px;
}
}

#footer_guide h2{
width:218px;
height:186px;
margin:0 11px;
text-align: center;
background-color:#cac5c2;
color:#43302c;
font-size:20px;
font-weight:700;
padding:0;
line-height:186px;
}
#footer_guide h2 a{
display: block;
}
@media only screen and (max-width:680px){
#footer_guide h2{
width:96%;
height:auto;
margin:0 auto 20px;
padding:15px;
font-size:20px;
line-height:1.0;
}
}

#footer_guide ul{
overflow:hidden
}
#footer_guide li{
float:left;
width:218px;
height:186px;
margin:0 11px;
}
@media only screen and (max-width:680px){
#footer_guide li{
float:left;
width:46%;
height:auto;
margin:0 2% 20px;
}
}


#footer_guide li a{
width:100%;
display:block;
text-align: center;
background-color:#fff;
padding:30px 20px;
height:186px;
line-height:1.4;
}
#footer_guide li a img{
width:80px;
margin-bottom:15px;
}
.guide_kind{
font-size:18px;
font-weight:700;
}
@media only screen and (max-width:680px){
.guide_kind{
font-size:16px;
}
}


/* footer link ----------------------- */

footer#footer_box{
width:100%;
margin:-150px auto 0;
padding:50px 0;
padding-top: 150px; /* 調整したい高さ（固定ヘッダーの高さ） */
}
.footer_link_area{
max-width:1200px;
width:100%;
margin:0 auto 50px;
overflow:hidden;
line-height:1.6;
}
#footer_calender{
float:right;
width:380px;
}
@media only screen and (max-width:680px){
#footer_calender{
float:none;
width: 90%;
margin: 0 auto;
}
}


#footer_calender h2{
text-align: center;
margin-bottom:20px;
font-weight:700;
}
#footer_calender iframe{
background-color:#fff;
border:0;
}
.footer_linklist{
float:left;
width:786px;
}
@media only screen and (max-width:680px){
.footer_linklist{
display: none;
}
}

ul.footer_linklist_a,
ul.footer_linklist_b,
ul.footer_linklist_c{
width:30%;
float:left;
margin-right:3.333%;
}

.footer_linklist > ul > li{
margin-bottom:20px;
}
.footer_linklist > ul > li > a{
font-size:16px;
font-weight:700;
border-bottom:#ccc solid 1px;
display: block;
padding:4px 4px;
margin-bottom:6px;
}

.footer_linklist li ul{
margin:0 0 20px 4px;
}
.footer_linklist li ul li a{
font-size:14px;
font-weight:400;
}

/*　copyright　area ---------- */

.footer_copyarea{
width:96%;
margin:0 auto;
border-top:#b8b0ad solid 1px;
padding:20px 0;
}

.footer_copyarea_inner{
max-width:1200px;
width:100%;
margin:20px auto;
overflow:hidden;
}
@media only screen and (max-width:680px){
.footer_copyarea{
width:90%;
}
.footer_copyarea_inner{
margin:0 auto;
}
}

.footer_copyarea_summery{
  float: right;
  width: 760px;
  text-align: left;
  margin: 0 0 0 30px;
  font-size: 15px;
}
.footer_copyarea_summery p{
	margin-bottom:20px;
}
.footer_copyarea_summery ul{
  display: flex;
  gap: 10px;
  flex-wrap: wrap; 
}

.footer_copyarea_summery ul li a{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center; 
  padding: 12px 16px; 
  color: #fff;
  font-weight: 900;
  font-size: 22px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center; 
  aspect-ratio: 374 / 130;
  width: 374px; 
  max-width: 100%; 
  height: auto; 
  box-sizing: border-box;
}

.footer_copyarea_summery ul li:first-child a{
  background-image: url("../images/common/footer_bana_repair.jpg");
}
.footer_copyarea_summery ul li:last-child a{
  background-image: url("../images/common/footer_bana_hem.jpg");
}

/* スマホ */
@media only screen and (max-width: 680px){
  .footer_copyarea_summery{
    float: none;
    max-width: 400px;
			width:100%;
    margin: 40px auto ;
  }
	.footer_copyarea_summery p{
	margin-bottom:40px;
}
  .footer_copyarea_summery ul{
    display: grid; 
    grid-template-columns: minmax(0, 1fr); /* ← 親幅いっぱいの1列 */
    gap: 20px;
			justify-items: center;
  }
	  .footer_copyarea_summery ul li{
    min-width: 0;                           /* ← グリッド内のはみ出し抑制 */
    width: 100%;
  }
  .footer_copyarea_summery ul li a{
   display: flex;
    width: 100%;                            /* ← liの幅に追従 */
    max-width: none;                        /* ← ここでは上限を外す（上限は親で管理） */
    margin: 0;
    aspect-ratio: 374 / 130;
    height: auto;
    background-size: cover;
    background-position: center;
			font-size:19px;
  }
}

.footer_copy_area{
float:left;
width:400px;
}
@media only screen and (max-width:680px){
.footer_copyarea_link{
float:none;
width:100%;
margin-bottom:30px;
text-align:center;
}
.footer_copy_area{
float:block;
width:100%;
text-align:center;
}
}


.footer_logo_area{
line-height:1.6;
}
.footer_logo img{
width:300px;
margin-bottom:15px;
}
@media only screen and (max-width:680px){
.footer_logo_area{
display: block;
width:90%;
margin: 0 auto;
}
}
.footer_sns{
margin:10px 0 0 0;
}
@media only screen and (max-width:680px){
.footer_sns{
margin:10px 0 20px 0;
}
.footer_logo{
margin-bottom:20px;
}
.footer_logo img{
width:260px;
}
}

.footer_name{
	font-size:16px;
	font-weight:700;
	margin-bottom:8px;
}
address{
font-size: 14.5px;
letter-spacing: 0.5px;
}
@media only screen and (max-width:420px){
.footer_name{
	font-size:15px;
}
address{
font-size: 14px;
	text-align: left;
	margin-bottom:20px;
}
}

.footer_copy{
font-size:12px;
letter-spacing: 1px;
}

#topcontrol{
z-index:2;
}



/* ◆◆◆◆◆◆◆◆◆common◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆◆　 */

.arrow{
	position: relative;
	display: inline-block;
	padding: 0 0 0 16px;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
}
.arrow::before,
.arrow::after{
	position: absolute;
	top: 0;
	bottom: 0;
right: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}

.ico_ya::before{
	right: 12px;
	width: 4px;
	height: 4px;
	border-top: 2px solid #ebe7df;
	border-right: 2px solid #ebe7df;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.ico_ya_down::before{
	right: 12px;
	width: 4px;
	height: 4px;
	border-top: 2px solid #ebe7df;
	border-right: 2px solid #ebe7df;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}
@media only screen and (max-width:680px){
.ico_ya::before,
.ico_ya_down::before{
	right: 20px;
	width: 6px;
	height: 6px;
	border-top: 1px solid #ebe7df;
	border-right: 1px solid #ebe7df;
}
}



.link_but{
display:inline-block;
background-color:#fff;
text-decoration:none;
padding:20px 70px 20px 50px;
border-radius:45px;
font-weight:700;
font-size:17px;
border:#cbc3c2 solid 1px;
transition: .5s;
}

.short_link{
padding:18px 50px 18px 30px;
font-size:17px;
}

.color_link{
padding:8px 50px 8px 30px;
font-size:17px;
background-color:#ead7d3;
border:none;
}

.small_link{
padding:8px 50px 8px 30px;
font-size:17px;
border:#cbc3c2 solid 1px;
background-color:#fff;
}

.link_but:hover{
background-color:#f8e9df;
}
.link_but::before{
border-top: 2px solid #333;
border-right: 2px solid #333;
right:25px;
}
@media screen and (max-width:680px){
.link_but{
display:block;
font-size:15px;
width:90%;
max-width:340px;
margin:0 auto;
padding: 15px 30px 15px 25px;
}
.color_link,
.small_link{
font-size:15px;
padding: 8px 30px 8px 25px;
}
}

.under {
background: linear-gradient(transparent 80%, #e5ca8a 80%);
padding: 0 1px 0px;
}

.under_l {
background: linear-gradient(transparent 40%, #e5ca8a 40%);
padding: 0 1px 0px;
}



/* service　------------- */

#top_service{
max-width:1530px;
width: 90%;
margin:0 auto 200px;
}
ul.top_service_item{
display: flex;
}
ul.top_service_item li{
max-width:488px;
margin:0 1%;
text-align: center;
width:31%;
}
ul.top_service_item li img{
width:100%;
}
.top_service_name{
font-size:25px;
color:#5a4c48;
font-weight:900;
}
.top_service_text{
	text-align: left;
}
@media screen and (max-width:680px){
#top_service{
max-width:1530px;
margin:0 auto 140px;
}
ul.top_service_item{
display: block;
}
ul.top_service_item li{
max-width:488px;
margin:0 auto 70px;
width:94%;
}
.top_service_name{
font-size:20px;
}
}

/* 事例検索　------------------- */

.search_area{
max-width:800px;
width:90%;
margin:100px auto 90px;
}
h3.search_area_ttl{
font-size:24px;
font-weight:700;
text-align: center;
}
@media screen and (max-width:680px){
.search_area{
margin:60px auto 90px;
}
h3.search_area_ttl{
font-size:20px;
}
}

ul.search_area_but{
overflow:hidden;
}

ul.search_area_but li{
float:left;
margin:10px;
}
ul.search_area_but li a{
border:#b1a8a6 solid 1px;
padding:12px 50px 12px 30px;
width:242px;
transition: .5s;
}
@media screen and (max-width:680px){
ul.search_area_but{
max-width:440px;
margin:0 auto 20px;
}
ul.search_area_but li{
margin:10px 2px;
width:48%;
}
ul.search_area_but li a{
padding:12px 15px;
width:100%;
}
ul.search_area_but .basic_link{
font-size: 14px;
max-width: 100%;
}
ul.search_area_but .basic_link::before {
right: 15px;
}
}

ul.search_area_but li a:hover{
background-color:#dbd7d2;
}

.top_search_box{
overflow:hidden;
max-width:460px;
width:90%;
margin:0 auto;
}
input.search {
float: left;
display: block;
width: 83%;
margin-right: 2%;
padding: 25px;
border:#b1a8a6 solid 1px;
font-size:20px;
}
input::placeholder {
font-family: "Noto Sans JP";
}

@media screen and (max-width:680px){
input.search {
padding: 15px;
font-size:16px;
}
}
.search_area button {
width: 15%;
float: right;
padding: 26px 10px;
line-height:23px;
display: block;
background-color:#dfdbd9;
background-image:url("../images/common/ico_search.svg");
background-size:40px;
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
transition: .5s;
}
@media screen and (max-width:680px){
.search_area button {
background-size:25px;
padding: 15px 10px;
line-height:20px;
}
}
.search_area button:hover{
background-color:#c3bbb7;
}


/* お客様の声　------------------- */

#top_voice{
background-image:url("../images/top/top_voice_bg.webp");
background-repeat: no-repeat;
background-size:cover;
background-position:bottom left;
}
@media only screen and (max-width:680px){
#top_voice{
background-image:url("../images/top/top_voice_bg_sp.jpg");
background-repeat:repeat;
background-size:auto;
background-position:bottom left;
}
}
.top_voice_inner{
max-width:1040px;
width:90%;
margin:0 auto;
text-align: center
}
.top_voice_intro_box{
display: flex;
align-items: flex-end;
margin-bottom:50px;
letter-spacing: -0.1px;
text-align: left;
}
@media screen and (max-width:680px){
.top_voice_intro_box{
display: block;
margin-bottom:30px;
}
}

#top_voice .common_ttl{
width:260px;
text-align: left;
}
@media only screen and (max-width:680px){
#top_voice .common_ttl{
width: 90%;
 margin: 0 auto 40px;
	text-align: center;
}
}
#top_voice .common_ttl_en{
color:#b3ada7;
}
#top_voice .top_case_intro{
width:calc(100% - 260px);
text-align: left;
}
#top_voice .common_ttl_jp:before,
#top_voice .common_ttl_jp:after{
height:0;
display: block;
position: relative;
}
#top_voice .common_ttl_jp {
padding:0;
vertical-align: bottom;
}
ul.top_voice_box{
overflow:hidden;
}
ul.top_voice_box li{
background-color:#fff9;
width:49%;
float:left;
padding:25px;
text-align: left;
}
ul.top_voice_box li:nth-child(odd){
margin:0 2% 20px 0;
}
ul.top_voice_box li:nth-child(even){
margin:0 0 20px 0;
}
@media screen and (max-width:680px){
ul.top_voice_box li{
width:100%;
float:none;
padding:25px;
}
}

.dot_top{
background-image:url("../images/common/dot_line.png");
background-repeat: repeat-x;
background-position:top 10px left 0;
padding:120px 0 0;
}
.dot_bottom{
background-image:url("../images/common/dot_line.png");
background-repeat: repeat-x;
background-position:bottom 10px left 0;
padding:0 0 200px 0;
}
@media screen and (max-width:680px){
.dot_top{
padding:80px 0 0;
}
.dot_bottom{
padding:0;
}
}


/* 実店舗のご案内　------------------ */

#top_shop{
max-width:1200px;
width:90%;
margin:0 auto;
padding:100px 0 150px;
}
@media only screen and (max-width:680px){
#top_shop{
padding:70px 0 80px;
}
}
.top_shop_pict{
position:relative;
margin-bottom:30px;
}

.shop_yoyaku{
position:absolute;
left:60px;
top:-25px;
display:block;
width:210px;
height:210px;
background-color: #1d2335;
color:#dfae0b;
font-weight:700;
font-size:30px;
text-align:center;
padding-top:50px;
}
.shop_yoyaku span{
color:#fff;
display:block;
font-size:18px;
}
@media only screen and (max-width:680px){
.shop_yoyaku{
position:relative;
left:0;
top:0;
width:100%;
height:auto;
font-size:18px;
padding:10px;
}
.shop_yoyaku span{
display:inline;
}
}
ul.link2{
justify-content: center; 
gap: 10px;
width:100%;
margin:0 auto ;
display: flex;
}
ul.link2 li{
margin:0 15px;
}
@media only screen and (max-width:680px){
ul.link2{
display: block;
}
ul.link2 li{
margin:0 15px 20px;
}
}



.top_adress{
max-width:530px;
width:90%;
margin:0 auto 40px;
}

.top_adress dl{
display: flex;
}
.top_adress dt{
width:118px;
}
.top_adress dd{
width:calc(100% - 118px);
}
@media only screen and (max-width:680px){
.top_adress dt{
width:25%;
}
.top_adress dd{
width:75%;
}
}



/* 20240914追加　-------------- */
.l-header{
min-width: 1260px;
}
@media screen and (max-width:680px){
.l-header{
min-width:auto;
}
}

.basic_text{
max-width:1000px;
margin:0 auto;
width:90%;
padding:90px 0;
}
@media screen and (max-width:680px){
.basic_text{
padding:50px 0;
}
}

.basic_heading{
background-color:#cdc7c2;
padding:10px 20px;
font-weight:700;
font-size:22px;
margin-bottom:30px;
}
.sub_heading{
background-color:#cdc7c2;
padding:10px 20px;
font-weight:700;
font-size:20px;
color:#463633;
border-bottom:#3f352c solid 1px;
margin-bottom:30px;
}
@media screen and (max-width:680px){
.basic_heading{
font-size:16px;
}
.sub_heading{
font-size:17px;
}
}



.page_inlink{
padding-top: 140px;
margin-top: -140px;
}
@media screen and (max-width:680px){
.page_inlink{
padding-top: 80px;
margin-top: -80px;
}
}

/* サービスメインビジュアルエリア　--------------------- */


.servicetop_mainpict{
width: 100%;
overflow:hidden;
position: relative;
padding:0 0 120px 0;
margin-bottom:60px;
}
.servicetop_mainpict::after {
content: '';
position: absolute;
background: #e9e7e4;

width:85%;
height: 85%;
top: 40px;
left: 0;
z-index:-1;
}
@media only screen and (max-width:680px){
.servicetop_mainpict{
padding:0 0 140px 0;
margin-bottom:0;
}
.servicetop_mainpict::after {
width:100%;
height: 90%;
}
}

.servicetop_pictarea{
width: 63%;
max-width:1162px;
float: right;
margin:10px 20px 0 0;
}
@media only screen and (max-width:1480px){
.servicetop_pictarea{
width: 60%;
}
}
@media only screen and (max-width:680px){
.servicetop_pictarea{
width: 100%;
margin:10px 0 20px 0;
}
}
.servicetop_pictarea img{
width:100%;
height:auto;
}
.servicetop_maintext_area{
position: absolute;
left:4.5%;
top:20%;
}
@media only screen and (max-width:1600px){
.servicetop_maintext_area{
left:3%;
top:17%;
}
}
@media only screen and (max-width:680px){
.servicetop_maintext_area{
position: relative;
left:auto;
top:auto;
width:90%;
margin:0 auto;
text-align:center;
}
}

/*　オンライン見積　------------------ */

.online_mitumori{
width:100%;
color:#fff;
position: relative;
background-image: url("../images/repair/online_mitumori_bg.jpg");
background-repeat:no-repeat;
background-size:cover;
padding:90px 0;
}
@media only screen and (max-width:680px){
.online_mitumori{
background-position:left 0 top 0;
}
}
@media only screen and (max-width:380px){
.online_mitumori{
background-position:left -50px top 0;
}
}

.online_mitumori_ttl{
font-size:30px;
border-top:#fff solid 1px;
border-bottom:#fff solid 1px;
width:474px;
margin:0 auto 35px;
padding:18px;
text-align:center;
font-weight:700;
}
.online_mitumori_copy{
font-size:24px;
font-weight:700;
text-align:center;
margin:0 auto 35px;
}
.online_mitumori a{
display:block;
width:494px;
margin:0 auto;
background-color:#ca5d13;
font-size:24px;
font-weight:700;
padding:12px;
border-radius:15px;
text-align:center;
color:#fff;
transition:.5s;
}
.online_mitumori a:hover{
background-color:#e59158;
}
.online_mitumori span{
position: absolute;
right:180px;
top:-30px;
z-index:1;
}
.online_mitumori span img{
width:376px;
height:auto;
}
@media only screen and (max-width:1700px){
.online_mitumori span{
position: absolute;
right:50px;
}
.online_mitumori span img{
width:300px;
}
}
@media only screen and (max-width:680px){
.online_mitumori_ttl{
font-size:22px;
width:86%;
margin:0 auto 35px;
}
.online_mitumori_copy{
font-size:18px;
}
.online_mitumori a{
width:84%;
font-size:17px;
}
.online_mitumori span{
display: none;
}
}


/* お見積り・ご依頼方法はこちら　*/
a.go_mitsumori{
background-color:#ca5d13;
color:#fff;
text-align:center;
font-weight:700;
font-size:22px;
text-decoration:none;
border-radius:8px;
display:block;
width:560px;
margin:0 auto 30px;
padding:20px;
}
@media only screen and (max-width:680px){
a.go_mitsumori{
font-size: 16px;
width: 86%;
padding: 8px;
line-height: 1.6;
}
}

/* お客様の声　------------------- */

div#page-top{
display: none !important;
}


/* アニメーション　---------------- */
.fadeIn {
opacity: 0;
transition: 0.3s;
}
.fadeIn.is-show {
opacity: 1;
}

.fadeIn_up {
opacity: 0;
transform: translate(0, 50%);
transition: 2s;
}

.fadeIn_up.is-show {
transform: translate(0, 0);
opacity: 1;
}
.fadeIn_right {
  opacity: 0;
  transform: translate(50%, 0);
  transition: 2s;
}
.fadeIn_right.is-show {
  transform: translate(0, 0);
  opacity: 1;
}
.fadeInUp {
  opacity: 0;
  transform: translate(0, 10%);
}
.fadeInUp.is-show {
  animation: fadeInUp forwards 0.8s 1 ease 0.2s normal;
}
@keyframes fadeInUp {
 0% {
   opacity: 0;
   transform: translate(0, 10%);
 }
 100% {
   opacity: 1;
   transform: translate(0, 0);
 }
}
.anmdly_01s {
  animation-delay: 0.1s !important;
}
.anmdly_02s {
  animation-delay: 0.2s !important;
}
.anmdly_03s {
  animation-delay: 0.3s !important;
}
.anmdly_04s {
  animation-delay: 0.4s !important;
}
.anmdly_05s {
  animation-delay: 0.5s !important;
}
.anmdly_06s {
  animation-delay: 0.6s !important;
}
.anmdly_07s {
  animation-delay: 0.7s !important;
}
.anmdly_08s {
  animation-delay: 0.8s !important;
}
.anmdly_09s {
  animation-delay: 0.9s !important;
}
.anmdly_10s {
  animation-delay: 1.0s !important;
}
.anmdly_15s {
  animation-delay: 1.5s !important;
}
.anmdly_20s {
  animation-delay: 2.0s !important;
}
.anmdly_25s {
  animation-delay: 2.5s !important;
}
.anmdly_30s {
  animation-delay: 3.0s !important;
}
.anmdly_45s {
  animation-delay: 4.5s !important;
}


/* マーカー */
.marker {
position: relative;
display: inline;
background: linear-gradient(to right, #e5ca8a 0%, #e5ca8a 100%);
background-size: 0% 50%; /* 最初はマーカーがない状態 */
background-repeat: no-repeat;
background-position: left bottom; /* 文字の背面に配置 */
animation: highlight 1s ease-out forwards;
box-decoration-break: clone; /* 複数行に対応 */
-webkit-box-decoration-break: clone;
}
@keyframes highlight {
from {
background-size: 0% 50%;
}
to {
background-size: 100% 50%;
}
}


/* 点滅 */
.blinking{
	-webkit-animation:blink 0.8s ease-in-out infinite alternate;
    -moz-animation:blink 0.8s ease-in-out infinite alternate;
    animation:blink 0.8s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

/* 404エラー　*/

.error_text{
max-width:700px;
margin:150px auto 180px;
width:90%;
text-align: center;
}
@media only screen and (max-width:680px){
.error_text{
margin:60px auto;
text-align: left;
}
}