@charset "UTF-8";
/*
Theme Name: SLIPSHIELD-LP
Description: テーマの説明
Author: KNOT
Version: 20250529
*/

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0;
	font-family: "Noto Sans JP", sans-serif;
}

a {
	width: 100%;
}

a:hover {
	opacity: .6;
}

img {
	width: 100%;
	  height: auto;
	vertical-align: bottom;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.pc_view {
	width: 100%;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
}

.top_btn_box {
	display: flex;
	align-items: center;
	width: 90%;
	max-width: 472px;
	position: fixed;
	top: 60px;
	right: clamp(10px, 6vw, 80px);
	z-index: 999;
}
.pc_tel {width:100%;max-width:216px;}
.form_2{width:100%;max-width:236px;}
.pc_tel img,
.form_2 img {
	height: auto;
	max-height: 46px;
	width: auto;
	display: block;
}

/* 画像間の余白 */
.form_2 {
	margin-left: 20px;
}
.goto_form img {
	position: fixed;
	width: 100%;
	max-width: 275px;
	right: 80px;
	top: 60px;
	z-index: 999;
}
.gotop img {
	position: fixed;
	width: 100%;
	max-width: 52px;
	right: 80px;
	bottom: 60px;
	z-index: 999;
}

.gotop {
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s;
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 1000;
}

.gotop.show {
	opacity: 1;
	pointer-events: auto;
}

.line-banner-wrapper {
	position: fixed;
	top: 20%;
	right: clamp(10px, 6vw, 80px);
	z-index: 99998;
}

.close-banner-checkbox {
	display: none;
}

.line-banner {
	position: relative;
}

.line-banner img {
	width: 100%;
	max-width: clamp(100px, 18vw, 200px);
}

/* 閉じるボタン */
.line-banner-close {
	position: absolute;
	top: -30px;
	right: -30px;
	cursor: pointer;
}

.line-banner-close img {
	width: 90%;
	max-width:28px;
	height: 90%;
}
.line-banner-close img:hover{opacity:.6;}

/* バナーを非表示にする条件 */
.close-banner-checkbox:checked + .line-banner {
	display: none;
}

.intro_box{
	padding-top:65px;
}

.intro_box p{
	margin:0;
	font-size:clamp(18px,1.8vw,22px);
	font-weight:500;
	text-align:center;
	line-height:1.7;
}

.intro_box span{
	font-weight:800;
	color:#ee7345;
}

.video-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
}

.video-container {
	position: relative;
	width: 88vw;
	/* 基準幅880pxに近い割合 */
	max-width: 880px;
	aspect-ratio: 16 / 9;
	/* 高さ自動算出（880:495 = 16:9） */
}

.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.website {
	margin: 0 auto;
	width: 90%;
	max-width: 680px;
	margin-bottom: 100px;
}

.website_2 {
	margin: 0 auto;
	width: 90%;
	max-width: 680px;
	margin-top:4.6vw;
}
.go_urata{margin-top:4.167vw; position:relative;}
.go_urata_url {
  position: absolute;
  bottom: 3.167vw;
  right: 17.75vw;
  width: 45.833vw;     /* 1200px換算で550px相当 */
      /* 上限550px */
}

.go_urata_url a {
  display: block;
  width: 100%;         /* 親幅いっぱい */
}

.go_urata_url a img {
  width: 100%;
  height: auto;
  display: block;
}


.pc_02 {
	background-color: #f5f0e7;
}
.pc_02a {
	background-color: #f5f0e7;
padding-bottom:8.3vw;
}

.pc_contact_item {
	width: 90%;
	max-width: 680px;
	padding: 100px 0;
	margin: 0 auto;
}

.pc_contact_item_01 {
	width: 90%;
	max-width: 680px;
	padding: 100px 0;
	margin: 0 auto;
	padding-top:70px;
}
.line_bnr_pc{width:80%;margin:0 auto;}
.line_bnr_pc a{
	display:block;margin-top:40px;text-align:center;
}
.sp_bnr_link{
	display:block;
	width:242px;margin:0 auto;margin-top:30px;
}
.pc_formlink img {
	margin-bottom: 15px;
}

.pc_03 {
	width: 100%;
}

.pc_04 {
	background-color: #f5f0e7;
}

.pc_04_youtube {
	text-align: center;
}

.pc_04_youtube img {
	width: 90%;
	max-width: 500px;
	margin: 40px auto 60px auto;
}

.contact_box {
	background-color: #f3e9db;
	padding-bottom: 130px;
}

.form_box {
	width: 90%;
	max-width: 880px;
	margin: 0 auto;
}

.pc_footer {
	width: 100%;
	background-image: url(images/footer.png);
	background-repeat: no-repeat;
}

.company {
	padding: 50px 0;
	text-align: center;
	width: 100%;
	max-width: 470px;
	margin: 0 auto;
}

.com_1 {
	max-width: 470px;
	margin: 0 auto;
}

.com_2 {
	max-width: 300px;
	margin: 0 auto;
}

.com_3 p {
	font-size: 18px;
	font-weight: 500;
}

.com_4 p {
	font-size: 18px;
	font-weight: 400;
}

.com5 p {
	font-size: 16px;
	font-weight: 500;
}

footer p {
	font-size: 14px;
	color: #FFF;
	text-align: center;
	background-color: #735a3f;
	padding: 18px 0;
	margin: 0;
}

.form_img {
	margin: -6px auto;
}

.pc_only {
	display: block;
}

.sp_only {
	display: none;
}

@media (max-width: 431px) {
	a:hover {
		opacity: 1;
	}

	.pc_only {
		display: none;
	}

	.sp_only {
		display: block;
	}

	.sp_view {
		width: 100%;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		flex-wrap: nowrap;
	}
	.youtube_bubble{margin-bottom:14px;}
	
	.sp_website {
		width: 90%;
		max-width: 260px;
		margin: 30px auto;
	}

	.sp_02,
	.sp_04 {
		background-color: #f5f0e7;
		padding-bottom:50px;
	}
	.intro_box_sp{
		margin-top:30px
	}
	.intro_box_sp p{
		margin:0;
		text-align:center;
		line-height:1.6;
		font-size:14px;
		font-weight:500;
	}
	.intro_box_sp span{
		font-weight:800;
		color:#ee7345;
	}
	
	
	.contct_box_sp {
		width: 90%;
		max-width: 290px;
		margin: 50px auto;
	}
	
		.contct_box_sp_01 {
		width: 90%;
		max-width: 290px;
		margin: 50px auto;
			margin-top:30px;
	}

	.sp_youtube {
		width: 90%;
		max-width: 290px;
		margin: 25px auto;
	}

	.sp_06 {
		width: 100%;
		margin: 0;
	}

	.sp_07 {
		width: 100%;
		margin: 0;
		margin-top: -3px;
	}

	.sp_07 img {
		width: 100%;
		margin: 0;
	}

	.company {
		padding: 35px 0;
		text-align: center;
		width: 100%;
	}

	.com_1 {
		max-width: 300px;
		margin: 0 auto;
	}

	.com_2 {
		max-width: 240px;
		margin: 0 auto;
		margin-top: 28px;
	}

	.com_3 p {
		font-size: 18px;
		font-weight: 500;
	}

	.com_4 p {
		font-size: 18px;
		font-weight: 400;
	}

	.com_5 p {
		font-size: 16px;
		font-weight: 500;
	}

	footer p {
		font-size: 14px;
		color: #FFF;
		text-align: center;
		background-color: #735a3f;
		padding: 18px 0;
		margin: 0;
	}

	.gotop {
		opacity: 1;
		pointer-events: auto;
		position: fixed;
		bottom: 20px;
		right: 20px;
		z-index: 1000;
	}

	.gotop img {
		position: fixed;
		width: 100%;
		max-width: 44px;
		right: 25px;
		bottom: 80px;
	}
.goto_tel img {
		position: fixed;
		width: 100%;
		max-width: 44px;
		right: 80px;
		top: 25px;
		z-index: 999;
	}
	.goto_form img {
		position: fixed;
		width: 100%;
		max-width: 44px;
		right: 25px;
		top: 25px;
		z-index: 999;
	}
.first_contact {
	position:fixed;
	z-index:999;
	bottom:0;
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.first_contact_01,
.first_contact_02 {
	width: 49%;
}

.first_contact_01 a,
.first_contact_02 a {
	display: block;
	width: 100%;
}

.first_contact img {
	width: 100%;
	height: auto;
	display: block;
}

.line-banner-wrapper_sp {
	position: fixed;
	top: 64vw;
	right: 10%;
	z-index: 99998;
}

.close-banner-checkbox_sp {
	display: none;
}

.line-banner_sp {
	position: relative;
}

.line-banner_sp img {
	width: 100%;
	max-width:180px;
}
	
	.sp_uratacome{
		border-bottom:2px solid #ee7345;
		margin-top:40px;
		position:relative;
	}
	
	.sp_uratacome_url{
		width:78%;
		position:absolute;
		bottom:25px;
		left:50%;
		transform: translateX(-50%);
	}

/* 閉じるボタン */
.line-banner-close_sp {
	position: absolute;
	top: -25px;
	right: -20px;
	cursor: pointer;
}

.line-banner-close_sp img {
	width: 18px;
	height:18px;
}
.line-banner-close_sp img:hover{opacity:.6;}

/* バナーを非表示にする条件 */
.close-banner-checkbox_sp:checked + .line-banner_sp {
	display: none;
}
}