@charset "utf-8";
@import "https://use.fontawesome.com/releases/v5.13.0/css/all.css";

/*** other ***/

html,
body {
	margin:0;
	padding:0;
}

.site-body,
.site-body-container,
h2,
h3,
h4 {
padding:0 !important;
margin:0 !important;
width:100% !important;
max-width:100% !important;
}

.site-header,
.site-body-bottom,
.admin-bar .vk-mobile-nav-menu-btn,
.vk-mobile-nav-menu-btn,
.wp-block-columns,
.wp-block-cover,
.wp-block-spacer,
.wp-block-heading,
.wp-block-latest-posts__list,
.footer-nav,
.site-footer-copyright,
.page-header,
.breadcrumb,
.wpcf7 form.init .wpcf7-response-output,
.vk-mobile-nav-menu-outer {
display:none !important;
}

.site-footer {
	border:none !important;
}

html,
body,
header {
overflow-x:hidden !important;
overflow-y:visible !important;
}

h2,
h3,
h3:after,
h4,
h4:after {
border:none;
background:rgba(255, 255, 255, 0.0);
}

h3:after,
h4:after {
display:none;
}

ul,
p {
margin:0;
padding:0;
}

ul li {
list-style:none;
margin:0;
padding:0;
}

/*** /other ***/

/*** font ***/

.font-weigth {
font-weight:bold;
}

.font-mincho,
.shop-view-month-container .star-kuchikomi-box h3 {
font-family:"游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

span.orenge {
	color:#FF6900 !important;
	/*color:#000000;*/
	border-bottom:1px solid #FF6900;
}

/*** /font ***/

/*** #loading ***/

#loading {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#FFFFFF;
	z-index:9999;
	display:flex;
	align-items:center;
	justify-content:center;
}

.loading-inner {
	text-align:center;
	
	img {
		width:50%;
		opacity:0.1;
		animation: imgFade 2s ease forwards 1s;
	}
	
	p {
		font-size:1.3rem;
		font-weight:bold;
		background:linear-gradient(90deg, #000000 0%, #000000 50%, #ECECEC 50%, #ECECEC 100%);
		background-size:200% 100%;
		background-position:100% 0;
		-webkit-background-clip:text;
		-webkit-text-fill-color:transparent;
		animation:textFill 2s ease forwards 1s;
	}
}

@keyframes imgFade {
	0% {
		opacity:0.3;
	}
	100% {
		opacity:1;
	}
}

@keyframes textFill {
	0% {
		background-position:100% 0;
	}
	100% {
		background-position:0 0;
	}
}

#loading.fade-out {
	opacity:0;
	transition:opacity 0.8s ease;
	pointer-events:none;
}

/*** /#loading ***/

/*** スクロールall ***/

.fade-in {
opacity:0;
transition-duration:2000ms;
transition-property:opacity, transform;
}

.fade-in-up {
transform:translate(0, 50px);
}

.fade-in-down {
transform:translate(0, -50px);
}

.fade-in-left {
transform:translate(-50px, 0);
}

.fade-in-right {
transform:translate(50px, 0);
}

.scroll-in {
opacity:1;
transform:translate(0, 0);
}

/*** /スクロールall ***/

/*** .slider ***/

.slide {
	position:relative;
	overflow:hidden;
}

.top-view-container .fade {
	height:95vh;
	width:100%;
	overflow:hidden;
}

.top-page-view-container .fade .slick-dots {
	display:none !important;
}

.fade .slick-item {
	position:relative;
	overflow:hidden;
	
	.img-wrap {
		overflow:hidden;
		height:95vh;
		width:100%;
		
		img {
			width:100%;
			height:100%;
			object-fit:cover;
		}
	}
}

.fade .slick-item {
	.ab-text {
		position:absolute;
		bottom:4rem;
		left:10%;
		z-index:100;
		width:max-content;
		
		p {
			font-size:1.1rem;
			font-weight:bold;
			letter-spacing:0.3em;
			color:#FFFFFF;
			/*text-shadow:0 0 3px #000000;*/
			text-shadow:
			0 2px 6px rgba(0,0,0,0.7),
			0 0 12px rgba(0,0,0,4);
			
			/*padding:1rem;*/
			/* うっすら黒背景で品よく視認性UP */
			/*background: rgba(255, 255, 255, 0.15);*/
			/* ぼかしすぎないシャープな影 */
			/*text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);*/

			/* 控えめな柔らかい縁の光 */
			/*box-shadow: 0 10px 30px rgba(255, 255, 255, 0.08);
			backdrop-filter: blur(3px);*/
		}
		
		.title {
			font-size:1.3rem;
			padding-bottom:1rem;
		}
	}

}

@keyframes zoomUp {
	0% {
		transform: scale(1);
	}
	100% {
		transform: scale(1.15);
	}
	
}

.add-animation img {
	animation: zoomUp 10s linear 0s normal both;
}

/*** /.slider ***/

/*** nav ***/

nav {
	display:block;
	position:fixed;
	top:0;
	left:-350px;
	bottom:0;
	width:350px;
	background:#FFFFFF;
	overflow-x:hidden;
	overflow-y:auto;
	-webkit-overflow-scrolling:touch;
	transition:all .5s;
	z-index:1000;
	opacity:0;
}

.open nav {
  left: 0;
  opacity: 1;
}
nav .inner {
  padding: 25px;
}
nav .inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

nav .inner ul li {
	position:relative;
	margin:0;
	/*border-bottom:1px solid #999999;*/
	font-weight:bold;
	font-size:1rem;
}

nav .inner ul li span {
	padding-left:0.5rem;
}

nav .inner ul li.sub {
	margin-left:1rem;
	font-weight:normal;
	font-size:0.8rem;
}

nav .inner ul li a {
	display:block;
	color:#333333;
	padding:0.8rem;
	text-decoration:none;
	transition-duration:0.2s;
}

nav .inner ul li.sub a {
	padding:0.5rem;
}

nav .inner ul li a:hover {
  background: #e4e4e4;
}

.toggle_btn {
	display:block;
	position:fixed;
	top:0.5rem;
	left:1.5rem;
	width:30px;
	height:30px;
	transition:all .5s;
	cursor:pointer;
	z-index:600;

	opacity:0;
	visibility:hidden;
	transition:0.5s ease;
}

.toggle_btn.show_btn {
	opacity:1;
	visibility:visible;
}

.open .toggle_btn {
	left:380px;
	top:35px;
}
.toggle_btn span {
  display: block;
  position: absolute;
  left: 0;
  width: 30px;
  height: 2px;
  background-color: #333;
  border-radius: 4px;
  transition: all .5s;
}
.toggle_btn span:nth-child(1) {
  top: 4px;
}
.toggle_btn span:nth-child(2) {
  top: 14px;
}
.toggle_btn span:nth-child(3) {
  bottom: 4px;
}
.open .toggle_btn span {
  background-color: #fff;
}
.open .toggle_btn {
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}
.open .toggle_btn span:nth-child(1), .open .toggle_btn span:nth-child(3) {
  width: 16px;
}
.open .toggle_btn span:nth-child(1) {
  -webkit-transform: translate(-1px,4px) rotate(-45deg);
  transform: translate(-1px,4px) rotate(-45deg);
}
.open .toggle_btn span:nth-child(3) {
  -webkit-transform: translate(-1px,-4px) rotate(45deg);
  transform: translate(-1px,-4px) rotate(45deg);
}
@media screen and (max-width: 767px) {
  .open .toggle_btn {
    left: 250px;
  }
}
/*============
#mask
=============*/
#mask {
  display: none;
  transition: all .5s;
}
.open #mask {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  z-index: 500;
  cursor: pointer;
}

/*** /nav ***/

/*** .fix-contact-box ***/

.fix-contact-box.is-show {
	opacity:1;
	visibility:visible;
}

.fix-contact-box:hover {
	opacity:0.6;
	transition:0.5s ease;
}

.fix-contact-box {
	position:fixed;
	bottom:1rem;
	right:0;
	padding:0;
	/*background-color:#333;*/
	color:white;
	z-index:100;
	
	opacity:0;
	visibility:hidden;
	transition:0.5s ease;
	
	a {
		p {
			background:#FF6900;
			color:#FFFFFF;
			padding:1rem 0.7rem;
			writing-mode:vertical-rl;
            text-orientation:upright;
            text-shadow: 0 0 6px #000000;
            letter-spacing:0.2em;
			box-shadow:0 10px 20px rgba(255,255,255,0.2);
		}
		
		p:hover {
			
		}
	}
}

/*** /.fix-contact-box ***/

/*** btn ***/

.btn-box {
	text-align:center;
}

a.btn {
	font-size:1rem;
	font-weight:bold;
	line-height:1.5;
	position:relative;
	display:inline-block;
	padding:1rem 4rem;
	cursor:pointer;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	-webkit-transition:all 0.3s;
	transition:all 0.3s;
	text-align:center;
	vertical-align:middle;
	text-decoration:none;
	letter-spacing:0.1em;
	color:#212529;
	border-radius:0.5rem;
}

a.btn-svg {
  font-weight:700;
  line-height:54px;

  width:204px;
  height:54px;
  padding:0;

  cursor:pointer;
  text-decoration: none;

  background-color:transparent;
}

a.btn-svg svg {
  position: absolute;
  top: 0;
  left: 0;

  width: 100%;
  height: 100%;
}

a.btn-svg svg rect {
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;

  stroke:#000000;
  stroke-width:2;
  stroke-dasharray: 200px, 16px;
  stroke-dashoffset: 70px;
}

a.btn-svg:hover svg rect {
  stroke-dashoffset: 284px;
}

a.btn-svg span {
  color: #000;
}

/*** btn ***/

/*** .top-menu-container ***/

.top-menu-container {
	padding:2rem 0;
	position:relative;
	
	.center-comment {
		position:absolute;
		top:0.5rem;
		right:1rem;
		
		p {
			font-size:0.8rem;
			color:#666666;
		}
	}
	
	.ab-logo-box {
		position:absolute;
		top:0.5rem;
		right:2rem;
		
		.divide-box {
			display:table;
			
			.left-box,
			.right-box {
				display:table-cell;
				vertical-align:middle;
				padding:0 0.2rem;
				
				img {
					width:2.3rem;
					transition:transform .6s ease;
				}
				
				img:hover {
					width:2.3rem;
					transform:scale(1.2);
				}
			}
		}
	}
	
	.top-center-logo {
		text-align:center;
		
		img {
			width:10%;
		}
	}
	
	.top-ab-logo {
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		left:1rem;
		
		img {
			width:5em;
		}
	}
	
	.menu-list-box {
		margin-top:1rem;
		text-align:center;
		
		ul {
			display:inline-flex;
			gap:1rem;
			padding:0;
			margin:0 auto;
			
			li {
				display:flex;
				position:relative;
				z-index:100;
				list-style:none;
				width:9em;
				
				
				a {
					display:flex;
					align-items:center;
					justify-content:center;
					width:100%;
					white-space:nowrap;
					text-decoration:none;
					color:#666666;
					padding:0.5rem 0 0.1rem;
				
					.ab {
						position:absolute;
						bottom:-1rem;
						left:50%;
						transform:translateX(-50%);
						color:#CCCCCC;
						font-size:0.7rem;
						z-index:0;
					}
				}
				
				a:after {
					content:'';
					position:absolute;
					left:0;
					bottom:0.2rem;
					width:0;
					height:1px;
					background-color:#999999;
					transition:width 0.3s ease;
				}
				
				a:hover {
					color:#666666;
				}
				
				a:hover::after {
					width:100%;
				}
			}
		}
	}
}

/*** /.top-menu-container ***/

/*** .top-page-view-container ***/

.top-page-view-container {
	position:relative;
	width:100%;
	
	.ab-top-one {
		
	}
	
	.ab-top-two {
		position:absolute;
		top:20%;
		right:20%;
		text-align:center;
		display:inline-block;
		white-space:nowrap;
		pointer-events:none;
		
		.inner {
			display:flex;
			align-items:flex-start;
			gap:1.5em;
		
			h2 {
				padding:0;
				margin:0;
				font-size:1.6rem;
				font-weight:bold;
				writing-mode:vertical-rl;
				text-orientation:upright;
				color:#FFFFFF;
				text-shadow:0 0 6px #000000;
				letter-spacing:0.2em;
				
				span {
					padding:0.1rem 0 0.5rem;
					
					img {
						width:2rem;
					}
				}
			}
			
			h2.second-ab-title {
				transform:translateY(2.5em);
			}
		}
	}
}

/*** /.top-page-view-container ***/

/*** .top-page-news-container ***/

.top-page-news-container {
	width:70%;
	margin:5rem auto;
	
	.divide-box {
		display:table;
		width:100%;
		
		.left-box,
		.right-box {
			display:table-cell;
			vertical-align:top;
		}
		
		.left-box {
			width:25%;
		}
		
		.right-box {
			width:75%;
			
			.news-lists-box {
				.news-list {
					width:100%;
					position:relative;
					display:inline-block;
					padding:1rem;
					border-bottom:1px solid #CCCCCC;
					/*margin-bottom:5px;*/
					cursor:pointer;
					text-decoration:none;
					transition:0.5s;
					
					a {
						position:absolute;
						top:0;
						left:0;
						width:100%;
						height:100%;
					}
					
					.cont {
						ul {
							.date {
								font-size:0.7rem;
								color:#999999;
							}
						}
					}
				}
				
				.news-list:first-child {
					border-top:1px solid #CCCCCC;
				}
				
				.news-list::after {
					content:"";
					display:block;
					position:absolute;
					top:calc(50% - 5px);
					right:20px;
					width:20px;
					height:5px;
					border:none;
					border-right:2px solid #000000;
					border-bottom:1px solid #000000;
					transform:skew(45deg);
					transition:0.5s;
				}
				
				.news-list:hover {
					background:#E7E7E7;
				}
				
				.news-list:hover::after {
					right:10px;
					width:30px;
				}
			}
		}
	}
}

.top-page-news-container .divide-box .left-box h3,
.top-page-example-container .inner-box .title,
.top-page-contact-container .inner-box .title,
.title-box .title,
.top-page-loop-container .title {
	font-size:1.8rem;
	font-weight:bold;
	line-height:1;
}

.title-box .title {
	font-size:2.3rem;
}

.top-page-news-container .divide-box .left-box .subtitle,
.top-page-example-container .inner-box .sub,
.top-page-contact-container .inner-box .sub,
.title-box .sub,
.top-page-loop-container .sub {
	font-size:1rem;
	color:#9DDA9B;
	line-height:1;
	margin-top:0.2rem;
}

/*** /.top-page-news-container ***/

/*** .top-page-greeting-container ***/

.top-page-greeting-container {
	.inner {
		width:100%;
		margin:5rem auto 3rem;
		
		.content-box {
			text-align:center;
		}
		
		.sub-p {
			margin-top:2rem;
			text-align:center;
			font-size:1rem;
		}
	}
}

.top-page-greeting-container .inner .content-box,
.top-page-area-container .inner .content-box {
	position:relative;
}

.top-page-greeting-container .inner .content-box .ab-cont,
.top-page-area-container .inner .content-box .ab-cont {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	width:30%;
}

.top-page-area-container .inner .content-box .ab-cont {
	width:40%;
}

.top-page-greeting-container .inner .content-box .ab-cont img,
.top-page-area-container .inner .content-box .ab-cont img {
	opacity:0.1;
	width:100%;
}


.top-page-greeting-container .inner .content-box ul li,
.top-page-area-container .inner .content-box p {
	font-size:1.5rem;
	font-weight:bold;
}

/*** /.top-page-greeting-container ***/

/*** .title-box ***/

.title-box {
	width:70%;
	margin:8rem auto 0;
}

/*** /.title-box ***/

/*** .top-service__item ***/

.top-service {
	position: relative;
	height:100vh;
	/*min-height: 100vh;*/
	margin-top:0;
	/*visibility:hidden;*/
	/*visibility:visible;*/

	overflow:hidden;
	isolation: isolate;
}

.top-service__item {
	position: absolute;
	/*top: 0;
	left: 0;*/
	width: 100%;
	height: 100%;
	background-position:center;
	background-size:cover;
	/*overflow:hidden;*/
	inset:0;
}

.top-service__item:first-child {
	transform:translateY(0);
}

.top-service__fixed-heading {
	position:fixed;
	top:3rem;
	left:51%;
	transform:translateX(-50%);
	font-size:4rem;
	z-index:10;
	color:#666666;
	pointer-events: none;
	opacity:0;
}

.--01 {
	background:#FFFFFF;
	position:relative;
	z-index:0;
}
.--02 {
	background:#FFFFFF;
	border-top:1px solid #EFEFEF;
}
.--03 {
	background:#FFFFFF;
	border-top:1px solid #EFEFEF;
}
.--04 {
	background:#FFFFFF;
	border-top:1px solid #EFEFEF;
}

.site-content,
.container,
main {
  overflow: visible !important;
}

.top-service {
	position: relative;
	overflow: visible;
	
	.top-service__item {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		
		.inner-box {
			width:80%;
			margin:auto;
			position:relative;
			
			.ab-bg {
				background:#EFEFEF;
				position:absolute;
				top:-2%;
				left:-2%;
				width:45%;
				height:50vh;
			}
			
			.ab-img-box {
				position:absolute;
				top:1rem;
				right:0;
				width:55%;
				z-index:100;
			}
			
			.content-box {
				width:max-content;
				margin:3.5rem 0 0;
				background:#FFFFFF;
				position:relative;
				z-index:500;
				padding:2.5rem 1.5rem;
				box-shadow:0 10px 20px rgba(0,0,0,0.2);
				
				.main {
					font-size:1.3rem;
					font-weight:bold;
					line-height:1;
				}
				
				.main-eng {
					font-size:0.9rem;
					font-weight:bold;
					color:#9DDA9B;
					line-height:1;
					margin-top:0.5em;
					margin-left:0.5em;
					display:flex;
					align-items:center;
				}
				
				.main-eng::before {
					content:'';
					display:block;
					width:3em;
					height:1px;
					background:#9DDA9B;
					margin-right:0.5em;
				}
				
				.sub-box {
					margin-left:0.2em;
					
					.sub {
						margin-top:1em;
						font-size:1rem;
					}
				}
				
				.link-box {
					position:relative;
					width:max-content;
					margin:2rem auto 0;
					
					a {
						width:100%;
						background:#000000;
						transition:0.5s;
						color:#FFFFFF;
						padding:0.7rem 5rem;
						display:block;
						text-align:center;
						text-decoration:none;
						font-size:1rem;
					}
					
					a:hover {
						opacity:0.7;
					}
				}
			}
			
			.example-box {
				width:95%;
				margin:1rem auto 0;
				position:relative;
				z-index:500;
				
				.inner {
					display:table;
					width:100%;
					padding:1rem;
					background:rgb(255 255 255 / 0.8);
					box-shadow:0 10px 20px rgba(0,0,0,0.2);
					
					.img-box {
						display:table-cell;
						width:25%;
						vertical-align:top;
						padding:0.5rem;
						
						img {
							width:100%;
							vertical-align:top;
						}
					}
				}
			}
		}
	}
	
	.--03 {
		.inner-box {
			.content-box {
				margin-top:2rem;
			}
		}
	}
}

/*** /.top-service__item ***/

/*** .top-page-area-container ***/

.top-page-area-container {
	margin-top:8rem;
	
	.inner {
		.content-box {
			text-align:center;
		}
		
		.img-box {
			width:45%;
			margin:3rem auto;
			
			img {
				width:100%;
			}
		}
		
		.reform-area-box {
			border:1px solid #CCCCCC;
			border-radius:5px;
			position:relative;
			width:max-content;
			margin:auto;
			box-shadow:0 10px 10px rgba(0,0,0,0.1);
			
			.title {
				position:absolute;
				top:-1rem;
				left:50%;
				transform:translateX(-50%);
				text-align:center;
				font-size:1.2rem;
				font-weight:bold;
				background:#FFFFFF;
				padding:0 1.5em;
				width:max-content;
			}
			
			ul {
				padding:1.5rem 7rem 2rem;
				
				li:first-child {
					text-align:center;
					padding-bottom:0.5em;
					font-weight:bold;
				}
			}
		}
	}
}

/*** /.top-page-area-container ***/

/*** .top-page-example-container ***/

.top-page-example-container {
	margin-top:5rem;
	/*background:rgba(247, 233, 197, 0.2);*/
	background-image:url("../../uploads/2026/02/example-bg.jpg");
	background-size:cover;
	background-repeat:repeat-y;
	background-position:top;
	background-color:rgba(255,255,255,0.7);
	background-blend-mode:lighten;
	width:100%;
	padding-bottom:3rem;
	
	.inner-box {
		width:95%;
		margin:auto;
		padding:3rem 0;
		
		.title,
		.sub {
			padding-left:3rem;
		}
		
		.bg-white-box {
			width:95%;
			margin:3rem auto 0;
			background:#FFFFFF;
			box-shadow:0 10px 20px rgba(0,0,0,0.2);
			padding:2.5rem 2rem;
		}
		
		.example-list-box {
			width:100%;
			display:flex;
			flex-wrap:wrap;
			gap:2rem;
			
			.example-list {
				flex:0 0 calc(25% - 1.5rem);
				box-sizing:border-box;
				display:flex;
				flex-direction:column;
				position:relative;
				transition:transform 0.5s;
				
				a {
					position:absolute;
					top:0;
					left:0;
					width:100%;
					height:100%;
					z-index:200;
				}
				
				.cont {
					position:relative;
					z-index:0;
					background:#FCFCFC;
					border:1px solid #E8E8FF;
					border-radius:5px;
					padding:1.5rem 1rem;
					box-shadow:0 5px 10px rgba(0,0,0,0.2);
					
					.ab-box {
						/*position:absolute;
						top:0;
						left:0;*/
						width:100%;
						/*height:auto;*/
						/*z-index:100;*/
						
						.term-box {
							/*padding-left:1rem;*/
							
							.tate {
								/*-ms-writing-mode: tb-rl;
								writing-mode: vertical-rl;*/
								font-size:1rem;
								font-weight:bold;
								color:#333333;
								text-align:center;
								margin-bottom:0.3em;
							}
						}
						
						.img-box {
							/*max-width: calc(100% - 2rem);*/
							/*padding-left:1rem;*/
							
							img {
								border-radius:5px;
							}
						}
					}
					
					.bg-box {
						width:100%;
						/*background:#F2F2F2;*/
						padding:0;
						position:relative;
						z-index:1;
						/*border-radius:0.5rem;*/
						
						p {
							line-height:1.3;
							font-weight:normal;
						}
						
						.cat-title {
							padding:1rem 0 0.5rem;
							font-size:0.9rem;
						}
						
						.post-content {
							font-size:0.8rem;
							font-weight:normal;
							color:#666666;
							margin-top:0;
						}
						
						.ab-arrow {
							position:absolute;
							bottom:-2.5rem;
							right:-1rem;
							
							.arrow {
								display:inline-flex;
								align-items:center;
								justify-content:center;
								width:40px;
								height:40px;
								background:#FFFFFF;
								border:1px solid #CCCCCC;
								border-radius: 50%;
								position: relative;
							}

							/* 横棒 */
							.arrow::before {
								content: "";
								position: absolute;
								width: 16px;
								height: 2px;
								background: #000;
							}

							/* 矢印の先 */
							.arrow::after {
								content: "";
								position: absolute;
								width: 8px;
								height: 8px;
								border-top: 2px solid #000;
								border-right: 2px solid #000;
								transform: rotate(45deg);
								right: 12px;   /* 微調整 */
							}
						}
					}
					
				}
			}
			
			.example-list:hover {
				transform:scale(1.05);
				cursor:pointer;
			}
		}
		
		.btn-box {
			padding-top:3rem;
		}
	}
}

.popup-overlay{
	position:fixed;
	inset:0;
	background:rgba(155,155,155,0.65);
	backdrop-filter:blur(6px);

	display:flex;
	align-items:center;
	justify-content:center;

	opacity:0;
	visibility:hidden;
	transition:opacity 0.3s ease;

	z-index:999999;
}

.popup-overlay.active{
	opacity:1;
	visibility:visible;
}

.popup-content{
	position: relative;
	width: 90%;
	max-width: 1040px;
	background:#F8F6F2;
	/*background-image:url("../wp-content/uploads/2026/03/about-bg.jpg");
	background-repeat:no-repeat;
	background-size:cover;*/
	padding:3rem 3.5rem;
	border-radius:0.5rem;
	box-shadow:
		0 30px 60px rgba(0,0,0,0.35),
		0 5px 15px rgba(0,0,0,0.15);
	opacity: 0;
	transition: opacity 0.8s ease;

	max-height: 90vh;
	overflow-y: auto;
}

.popup-overlay.active .popup-content{
	opacity: 1;
}

.popup-close{
	top:1.5rem;
	right:1.5rem;
	width:32px;
	height:32px;
	cursor:pointer;
	border:2px solid #222222;
	border-radius:50%;
	background:#FFFFFF;
	opacity:0.8;
	
	position:fixed;
	z-index:999;
	/*transition:0.5s ease;*/
}

.popup-close::before,
.popup-close::after{
	content:"";
	position:absolute;
	top:50%;
	left:50%;
	width:22px;
	height:1.5px;
	background:#222222;
	transform-origin:center;
}

.popup-close::before{
	transform:translate(-50%,-50%) rotate(45deg);
}

.popup-close::after{
	transform:translate(-50%,-50%) rotate(-45deg);
}

.popup-close:hover{
	opacity:1;
	/*transition:0.1s ease;*/
}

.popup-data {
	display:none;
	position:relative;
}

.popup-content-box h3 {
	font-size:1.3rem;
	font-weight:bold;
}

.popup-content-box .divide-box {
	margin-top:1rem;
	display:flex;
	gap:1.5rem;
	align-items:flex-start;
	justify-content:space-between;
	
	.value-box {
		flex:1;
		border:1px solid #CCCCCC;
		border-radius:0.5rem;
		box-shadow:0 5px 10px rgba(0,0,0,0.2);
		padding:2rem 1.5rem;
		background:#FFFFFF;
		
		.img-box {
			img {
				width:50%;
				margin:0 auto 1rem;
				height:auto;
				display:block;
			}
		}
		
		.landscape {
			img {
				width:80%;
			}
		}

		.content-box{
			/*width:70%;*/
			/*padding:1rem 0 1rem 1rem;*/
			
			.popup-title {
				font-size:1rem;
				font-weight:bold;
				color:#42C447;
				padding-bottom:0.5rem;
				margin-bottom:0.5rem;
				border-bottom:1px solid #999999;
			}
			
			.popup-sub {
				font-size:0.8rem;
			}
		}
	}
}

html.popup-open,
body.popup-open{
	overflow: hidden !important;
	height: 100%;
}

.popup-content img{
	width:100%;
	height:auto;
	display:block;
}

/*** /.top-page-example-container ***/

/*** .top-page-loop-container ***/

.top-page-loop-container {
	.title-container {
		width:90%;
		margin:5rem auto 2rem;
	}
	
	.black-bg {
		content:"";
		background:#000000;
		height:1px;
		width:90%;
		margin:0 auto 0.5rem;
	}
	
	.second {
		margin:0.5rem auto 0;
	}
	
	.loop {
		overflow: hidden;
		overflow:visible;
		width: 100%;
	}

	.loop__track {
		display: flex;
		width: max-content;
		will-change: transform;
	}

	.loop__item {
		display:flex;
		align-items:center;
		gap:1rem;
		padding-right:3rem;
		white-space:nowrap;
		position:relative;
		z-index:1;
		transition:0.5s ease;
		
		a {
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100%;
			z-index:100;
		}
		
		p {
			padding-left:0.5em;
		}
	}
	
	.loop__item:hover {
		transform:scale(1.08);
		cursor:pointer;
		transition:0.5s ease;
		
		p {
			text-decoration:#999 underline;
		}
	}

	.loop__item img {
		height:10rem;
		border-radius:5px;
	}
	
	.loop__item p {
		font-size:1rem;
		font-weight:bold;
		
		span {
			font-size:0.8rem;
		}
	}
	
	.btn-box {
		margin-top:3rem;
	}
}

/*** /.top-page-loop-container ***/

/*** .top-page-contact-container ***/

.top-page-contact-container {
	margin:5rem auto;
	background-image:url("../../uploads/2026/02/contact-img.jpg");
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	width:90%;
	padding:3rem;
	border-radius:5px;
	
	.inner-box {
		margin:3rem auto;
		width:45%;
		background:#FFFFFF;
		border-radius:5px;
		padding:3rem 5rem;
		
		.title {
			text-align:center;
		}
		
		.sub {
			text-align:center;
		}
		
		.img-box {
			margin:1.5rem auto;
			
			img {
				border-radius:5px;
			}
		}
		
		.btn-box {
			margin-top:2rem;
		}
	}
}

/*** /.top-page-contact-container ***/

/*** .footer-container ***/

.footer-container {
	border-top:1px solid #000000;
	
	.inner-box {
		width:80%;
		margin:2rem auto;
		display:flex;
		justify-content:space-between;
		gap:3rem;
		
		.box:first-child {
			flex:0 0 30%;
			width:80%;
			margin:auto;
			max-width:200px;
			
			.img-box {
				width:100%;
				text-align:center;
				
				img {
					width:60%;
					max-width:100px;
				}
			}
			
			ul {
				margin-top:1rem;
				
				li {
					text-align:center;
					line-height:1.5;
				}
				
				li:first-child {
					margin-bottom:0.5em;
				}
			}
		}
		
		.box:not(:first-child) {
			flex:1;
			padding-top:1rem;
		}
		
		.box {
			.title {
				font-size:1.1rem;
				padding-bottom:1rem;
				
				a {
					color:#000000;
					display:inline-block;
					position:relative;
					text-decoration:none;
				}
				
				a::after {
					background-color:#333333;
					bottom:8px;
					content:"";
					height:1px;
					left:0;
					position:absolute;
					transform:scale(0, 1);
					transform-origin:left top;
					transition:transform .3s;
					width:100%;
				}
				
				a:hover::after {
					transform:scale(1, 1);
				}
				
				span {
					font-size:0.8rem;
					padding-left:0.5rem;
				}
			}
			
			.subtitle {
				font-size:0.8rem;
				
				a {
					color:#000000;
					display:inline-block;
					position:relative;
					text-decoration:none;
				}
				
				a::after {
					background-color:#333333;
					bottom:5px;
					content:"";
					height:1px;
					left:0;
					position:absolute;
					transform:scale(0, 1);
					transform-origin:left top;
					transition:transform .3s;
					width:100%;
				}
				
				a:hover::after {
					transform:scale(1, 1);
				}
			}
			
			.list {
				padding-left:0.5rem;
				
				li {
					padding-bottom:0.5rem;
					font-size:0.8rem;
					
					a {
						color:#000000;
						display:inline-block;
						position:relative;
						text-decoration:none;
					}
					
					a::after {
						background-color:#333333;
						bottom:-2px;
						content:"";
						height:1px;
						left:0;
						position:absolute;
						transform:scale(0, 1);
						transform-origin:left top;
						transition:transform .3s;
						width:100%;
					}
					
					a:hover::after {
						transform:scale(1, 1);
					}
				}
			}
		}
	}
	
	.copyright-box {
		border-top:1px solid #CCCCCC;
		width:95%;
		margin:auto;
		
		p {
			padding:0.7rem 0;
			font-size:0.7rem;
			color:#666666;
			text-align:center;
		}
	}
}

/*** /.footer-container ***/

@media only screen and (max-width: 1199px) {
	
	
	
}

@media only screen and (max-width: 1099px) {
	.top-page-view-container {
		.ab-top-two {
			right:15%;
		}
	}
	
	.pin-spacer,
	.top-service {
		display:none !important;
		visibility:hidden !important;
		opacity:0 !important;
	}
	
	.top-service-sp {
		.top-service-item {
			width:90%;
			margin:3rem auto;
			
			.inner-box {
				display:flex;
				margin-bottom:3rem;
				
				.content-box {
					width:60%;
					display:flex;
					align-items:flex-start;
					gap:1rem;
					
					.top-service-num {
						font-size:3rem;
						color:#666666;
					}
					
					.inner {
						background:#FFFFFF;
						padding:1.5rem;
						box-shadow:0 10px 20px rgba(0,0,0,0.2);
						position:relative;
					
						.ab-bg {
							content:"";
							position:absolute;
							top:-1rem;
							left:-0.5rem;
							width:85%;
							height:70vh;
							background:#EFEFEF;
							z-index:-1;
						}
						
						.main {
							font-size:1.1rem;
							font-weight:bold;
						}
						
						.main-eng {
							font-size:0.9rem;
							color:#9DDA9B;
							line-height:1;
							display:flex;
							align-items:center;
							margin-bottom:2rem;
						}
						
						.main-eng::before {
							content:'';
							display:block;
							width:3em;
							height:1px;
							background:#9DDA9B;
							margin-right:0.5em;
						}
						
						.sub-box p {
							font-size:0.9rem;
						}
						
						.link-box {
							margin:2rem 0 0;
							width:max-content;
							position:relative;
							
							a {
								padding:0.7rem 5rem;
								color:#FFFFFF;
								background:#000000;
								display:block;
								text-align:center;
								text-decoration:none;
								transition:0.3s;
								font-size:0.9rem;
							}
						}
						
						.link-box:hover {
							opacity:0.7;
							transition:0.3s;
						}
					}
					
					.inner > *:not(.ab-bg) {
						position:relative;
						z-index:1;
					}
				}
				
				.ab-img-box {
					width:40%;
					text-align:right;
					padding-top:5rem;
					
					img {
						width:90%;
					}
				}
			}
			
			.example-box {
				width:70%;
				margin:auto;
				
				.inner {
					padding-top:5rem;
					position:relative;
					
					.img-box {
						width:45%;
						
						img {
							width:100%;
							box-shadow:0 10px 20px rgba(0,0,0,0.2);
							border:3px solid #FFFFFF;
						}
					}
					
					.ab-img-box {
						position:absolute;
						top:0;
						right:0;
					}
				}
			}
		}
		
		.top-service-item:not(:first-child) {
			margin-top:6rem;
		}
	}
	
	.top-page-contact-container {
		.inner-box {
			width:55%;
			margin:auto;
		}
	}
	
	.footer-container {
		.inner-box {
			.box:first-child {
				display:none;
			}
		}
		
		.sp-view-1100 {
			text-align:center;
			margin:3rem auto;
			
			.border-top {
				content:"";
				margin:0 auto 2rem;
				height:1px;
				background:#CCCCCC;
				width:60%;
			}
			
			.box {
				.img-box {
					width:8em;
					margin:0 auto 1em;
				}
				
				ul li:first-child {
					margin-bottom:1em;
				}
			}
		}
	}
}

@media only screen and (max-width: 999px) {
	.top-service-sp {
		.top-service-item {
			width:100%;
			
			.inner-box {
				padding:0 3rem 0 1rem;
			}
		}
	}
	
	.top-page-contact-container {
		.inner-box {
			width:65%;
		}
	}
	
	.top-page-greeting-container .inner .content-box .ab-cont,
	.top-page-area-container .inner .content-box .ab-cont {
		width:50%;
	}
}

@media only screen and (max-width: 899px) {
	.top-page-news-container,
	.title-box {
		width:80%;
	}
	
	.top-page-example-container {
		.inner-box {
			.bg-white-box {
				width:100%;
				padding:1.5rem 1rem;
			}
			
			.example-list-box {
				gap:1rem;
				
				.example-list {
					flex:0 0 calc(50% - 0.5rem);
				}
			}
		}
	}
	
	.top-page-contact-container {
		.inner-box {
			width:70%;
			padding:4rem 3rem;
		}
	}
}

@media only screen and (max-width: 799px) {
	.pc-view-800 {
		display:none !important;
	}
	
	nav {
		width:50%;
	}
	
	.toggle_btn {
		left:0.5rem;
	}
	
	.open .toggle_btn {
		left:52%;
	}
	
	.top-page-news-container {
		.divide-box {
			display:inline-block;
			width:100%;
			
			.left-box,
			.right-box {
				display:inline-block;
				width:100%;
			}
			
			.left-box {
				margin-bottom:1rem;
				padding-left:1rem;
			}
		}
	}
	
	.title-box {
		padding-left:1rem;
		margin-top:5rem;
		width:95%;
	}
	
	.top-service-sp {
        .top-service-item {
            .inner-box {
                .ab-img-box {
                    img {
						width:95%;
					}
				}
			}
		}
	}
	
	.top-page-area-container {
		.inner {
			.img-box {
				width:65%;
			}
		}
	}
	
	.top-page-area-container {
		.inner {
			.reform-area-box {
				ul {
					padding:1.5rem 5rem 2rem;
				}
			}
		}
	}
	
	.top-page-greeting-container .inner .content-box .ab-cont,
	.top-page-area-container .inner .content-box .ab-cont {
		width:65%;
	}
	
	.top-page-contact-container {
		.inner-box {
			width:75%;
		}
	}
	
	.footer-container {
        .inner-box {
			width:90%;
		}
	}
}

@media only screen and (max-width: 749px) {
	.top-page-contact-container {
		.inner-box {
			width:90%;
		}
	}
}

@media only screen and (max-width: 699px) {
	.fade {
		.slick-item {
			.ab-text {
				left:2rem;
			}
		}
	}
	
	.top-service-sp {
        .top-service-item {
            .inner-box {
				display:inline-block;
				width:100%;
				
				.content-box {
					width:100%;
					
					.inner {
                        .ab-bg {
							width:65%;
						}
						
						.link-box {
							margin:2rem auto 0;
						}
						
						.sp-img-box {
							width:70%;
							margin:2rem auto;
							
							img {
								width:100%;
							}
						}
					}
				}
				
                .ab-img-box {
					display:none;
				}
			}
		}
	}
	
	.top-page-contact-container {
		.inner-box {
			width:95%;
		}
	}
	
	.footer-container {
        .inner-box {
			display:block;
			width:max-content;
			margin:3rem auto 1rem;
		}
	}
}

@media only screen and (max-width: 649px) {
	nav {
		width:60%;
	}
	
	.open .toggle_btn {
		left:62%;
	}
	
	.top-page-view-container {
		.ab-top-two {
			right:10%;
			top:20%;
		}
	}
	
	.top-service-sp {
        .top-service-item {
            .example-box {
				width:80%;
			}
		}
	}
	
	.top-page-area-container {
		.inner {
			.reform-area-box {
				ul {
					padding:1.5rem 4rem 2rem;
				}
			}
		}
	}
}

@media only screen and (max-width: 599px) {
	.pc-view-600 {
		display:none !important;
	}
	
	.fix-contact-box {
		a {
			p {
				font-size:0.8rem;
			}
		}
	}
	
	.fade {
		.slick-item {
			.ab-text {
				left:1rem;
				
				p {
					font-size:1rem;
				}
				
				.title {
					font-size:1.2rem;
				}
			}
		}
	}
	
	.top-page-news-container {
		width:95%;
	}
	
	.top-page-example-container {
		.inner-box {
			.title,
			.sub {
				padding-left:1rem;
			}
		}
	}
	.top-page-greeting-container .inner .content-box .ab-cont,
	.top-page-area-container .inner .content-box .ab-cont {
		width:75%;
	}
	
	.top-page-greeting-container .inner .content-box ul li,
	.top-page-area-container .inner .content-box p {
		font-size:1.3rem;
	}
	
	.top-page-area-container {
		.inner {
			.img-box {
				width:75%;
			}
		}
	}
}

@media only screen and (max-width: 549px) {
	nav {
		width:70%;
	}
	
	.open .toggle_btn {
		left:72%;
	}
	
	.top-service-sp {
        .top-service-item {
            .inner-box {
                .content-box {
					display:inline-block;
					align-items:stretch;
					position:relative;
					
					.top-service-num {
						text-align:right;
						position:absolute;
						top:-0.8em;
						right:-0.5em;
						z-index:10;
					}
					
					.inner {
						.main {
							font-size:1.3rem;
						}
					}
				}
			}
		}
		
		.top-service-item:first-child {
			margin-top:2rem;
		}
	}
	
	.top-page-area-container {
		.inner {
			.img-box {
				width:80%;
			}
		}
	}
	
	.top-page-contact-container {
		.inner-box {
			width:100%;
		}
	}
}

@media only screen and (max-width: 499px) {
	.pc-view-500 {
		display:none !important;
	}
	
	nav {
		width:75%;
		
		.inner {
			padding:2rem 1rem;
		}
	}
	
	.open .toggle_btn {
		left:77%;
	}
	
	.fade {
		.slick-item {
			.ab-text {
				width:85%;
			}
		}
	}
	
	.slick-slide {
		height:70vh;
	}
	
	.fade .slick-item {
		.img-wrap {
			height:100%;
		}
		
		.ab-text {
			bottom:2rem;
		}
	}
	
	.top-page-view-container {
		.ab-top-two {
			top:3rem;
			
			.inner {
				gap:0.5em;
				
				.h2.second-ab-title {
					transform:translateY(1.5em);
				}
			}
		}
	}
	
	.top-service-sp {
        .top-service-item {
            .example-box {
				width:90%;
			}
		}
	}
	
	.top-page-example-container {
        .inner-box {
            .bg-white-box {
				padding:2.5rem 1rem;
			}
		}
	}
	
	.top-page-area-container {
		width:95%;
		
		.inner {
			.img-box {
				width:85%;
			}
		}
	}
	
	.top-page-area-container {
		.inner {
			.reform-area-box {
				ul {
					padding:1.3rem 3rem 1.8rem;
				}
			}
		}
	}
	
	.top-page-loop-container {
		.black-bg {
			width:95%;
		}
		
		.loop__item img {
			height:7rem;
		}
	}
	
	.top-page-contact-container {
		width:95%;
		padding:2rem;
		
		.inner-box {
			padding:2rem;
		}
	}
}

@media only screen and (max-width: 449px) {
	.pc-view-450 {
		display:none !important;
	}
	
	.top-page-area-container {
		.inner {
			.img-box {
				width:90%;
			}
		}
	}
}

@media only screen and (max-width: 399px) {
	nav {
		width:85%;
	}
	
	.open .toggle_btn {
		left:87%;
	}
}

@media only screen and (min-width: 450px) {
	.sp-view-450 {
		display:none !important;
	}
}

@media only screen and (min-width: 500px) {
	.sp-view-500 {
		display:none !important;
	}
}

@media only screen and (min-width: 600px) {
	.sp-view-600 {
		display:none !important;
	}
}

@media only screen and (min-width: 700px) {
	.top-service-sp {
        .top-service-item {
            .inner-box {
                .content-box {
                    .inner {
						.sp-img-box {
							display:none;
						}
					}
				}
			}
		}
	}
}

@media only screen and (min-width: 800px) {
	.sp-view-800 {
		display:none !important;
	}
}

@media only screen and (min-width: 1100px) {
	.top-service-sp,
	.sp-view-1100 {
		display:none;
	}
}

@media only screen and (min-width: 1400px) {
	.title-box {
		width:1200px;
	}
	
	.top-page-news-container {
		width:1200px;
	}
	
	.top-service .top-service__item {
		width:1200px;
		margin:auto;
		
		.inner-box {
			.content-box {
				margin-top:8rem;
			}
			
            .example-box {
				margin-top:20%;
			}
			
			.ab-img-box {
				top:10%;
			}
		}
	}
	
	.top-service {
		.--03 {
			.inner-box {
				.content-box {
					margin-top:8rem;
				}
			}
		}
	}
	
	.top-page-area-container {
		.inner {
			.img-box {
				width:600px;
			}
		}
	}
	
	.top-page-example-container {
		.inner-box {
			width:1200px;
			
			.title,
			.sub {
				padding-left:0;
			}
			
			.bg-white-box {
				width:100%;
			}
		}
	}
	
	.top-page-loop-container {
		.title-container {
			width:1200px;
		}
	}
	
	.top-page-contact-container {
		width:1200px;
	}
	
	.footer-container {
		.inner-box {
			width:1300px;
		}
	}
}