body {
    height: 100%;
    margin: 0;
    font-feature-settings: 'palt';
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	background: #f8f8f7;
}
a{
	color: #000;
	text-decoration: none;
}
.item-s-sp{
	line-height: 0;
}
.item-s{
	line-height: 0;
}

/* 
FONT

Yu Gothic Pr6N R
font-family: "yu-gothic-pr6n", sans-serif;
font-weight: 400;
font-style: normal;

A-OTF Gothic MB101 Pr6N L
font-family: "a-otf-gothic-mb101-pr6n", sans-serif;
font-weight: 300;
font-style: normal;

DIN 2014 Regular
font-family: "din-2014", sans-serif;
font-weight: 400;
font-style: normal;

DIN 2014 Demi
font-family: "din-2014", sans-serif;
font-weight: 600;
font-style: normal;

Helvetica Neue LT Pro 55 Roman
font-family: "helvetica-neue-lt-pro", sans-serif;
font-weight: 400;
font-style: normal;

Source Han Sans Bold
font-family: "source-han-sans-cjk-ja", sans-serif;
font-weight: 700;
font-style: normal;

Source Han Serif JP Medium
font-family: "source-han-serif-jp-subset", sans-serif;
font-weight: 500;
font-style: normal;

DNP ShueiGoKinStd B
font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 600;
font-style: normal;

Avenir LT Pro 35 Light
font-family: "avenir-lt-pro", sans-serif;
font-weight: 200;
font-style: normal;

DNP ShueiGoKinStd M
font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 500;
font-style: normal;

Avenir LT Pro 55 Roman
font-family: "avenir-lt-pro", sans-serif;
font-weight: 400;
font-style: normal;

*/

:root {
	/* フォントサイズスケール */
	--font-size-base: 16px;
	--font-size-sm: 14px;
	--font-size-lg: 18px;
	--font-size-xl: 24px;
	--font-size-2xl: 32px;

	/* スペーシングスケール */
	--spacing-xs: 4px;
	--spacing-sm: 8px;
	--spacing-md: 16px;
	--spacing-lg: 24px;
	--spacing-xl: 32px;

	/* カラー */
	--color-text: #0071b9;
	--nav-text: #fff;
	--color-bg: #fff;
}


/*//////////////////////////////// for pc /////////////////////////////*/
@media (min-width: 1281px) {
	.sp-on { display: none !important; }

	/* fix-bg */
	.fix-bg{
		width: 100%;
		height: 100%;
		position: relative;
		z-index: -10;
	}
	.fix-bg-logo {
		position: fixed;
	}
	.fix-bg-logo svg {
		width: 100%;
		height: auto;
		display: block;
	}
	.fix-bg-on{
		width: 100%;
		height: 100%;
		position: fixed;
		background-color: rgba(255, 255, 255, 0.8);
		backdrop-filter: blur(60px);
		-webkit-backdrop-filter: blur(60px);
		top: 0;
		left: 0;
	}

	/* load */
	.loading-screen-index {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen-index.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen-index .loading-list {
		width: 40%;
		position: relative;
		animation: fadeIn 1.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	.loading-screen-index .loading-list li:nth-child(2){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(3){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(4){
		width: 60%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		margin: 0;
	}
	.loading-screen-index .loading-list li:nth-child(5){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	/* fix-logo */
	.fix-logo {
		width: 13%;
		position: fixed;
		top: 20px;
		left: 20px;
		line-height: 0;
		z-index: 100;
		visibility: visible;
		transition: opacity 0.6s ease, visibility 0.6s ease;
	}
	.fix-logo.hide {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
	.fix-logo a {
		display: block;
	}
	.fix-logo svg {
		width: 100%;
		height: auto;
	}
	.fix-logo .cls-1 {
		transition: fill 0.3s ease-in-out;
		fill: #231815;
	}
	.fix-logo .cls-3 {
		transition: fill 0.3s ease-in-out;
		fill: #00a059;
	}
	.fix-logo:hover .cls-1,
	.fix-logo:hover .cls-3 {
		fill: #0071b9;
	}

	/* nav */
	.hamburger {
		position: fixed;
		top: 20px;
		right: 20px;
		background: none;
		border: none;
		z-index: 1001;
		background: #0071b8;
		height: 30px;
	}
	.hamburger .txt{
		width: 100%;
		position: relative;
		top: 27px;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: .9em;
		letter-spacing: .1em;
		color: #0071b8;
		text-align: center;
	}
	.hamburger.active .txt{
		color: #fff;
	}
	.btn-trigger {
		width: 50px;
		height: 30px;
		cursor: pointer;
		border-radius: 12px;
	}
	.btn-trigger span {
		position: absolute;
		left: 0;
		width: 60%;
		height: 1px;
		background-color: #fff;
		border-radius: 4px;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	.btn-trigger, .btn-trigger span {
		display: inline-block;
		transition: all .5s;
		box-sizing: border-box;
	}
	.btn-trigger span:nth-of-type(1) {
		top: 11px;
	}
	.btn-trigger span:nth-of-type(3) {
		bottom: 11px;
	}
	#hamburgerBtn {
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.5s ease-in-out;
	}
	#hamburgerBtn.show {
		opacity: 1;
		pointer-events: auto;
	}
	#hamburgerBtn span:nth-of-type(1) {
	-webkit-animation: btn07-bar01 .75s forwards;
	animation: btn07-bar01 .75s forwards;
	}
	@-webkit-keyframes btn07-bar01 {
		0% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar01 {
		0% {
			transform: translateY(5px) rotate(45deg);
		}
		50% {
			transform: translateY(5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn span:nth-of-type(3) {
		-webkit-animation: btn07-bar03 .75s forwards;
		animation: btn07-bar03 .75s forwards;
	}
	@-webkit-keyframes btn07-bar03 {
		0% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar03 {
		0% {
			transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			transform: translateY(-5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn.active span:nth-of-type(1) {
		-webkit-animation: active-btn07-bar01 .75s forwards;
		animation: active-btn07-bar01 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar01 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
	}
	@keyframes active-btn07-bar01 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(4px) rotate(0);
		}
		100% {
			transform: translateY(4px) rotate(25deg);
		}
	}
	#hamburgerBtn.active span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn.active span:nth-of-type(3) {
		-webkit-animation: active-btn07-bar03 .75s forwards;
		animation: active-btn07-bar03 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar03 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
	}
	@keyframes active-btn07-bar03 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(-3px) rotate(0);
		}
		100% {
			transform: translateY(-3px) rotate(-25deg);
		}
	}
	.fullscreen-menu {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #0071b8;
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.4s ease, visibility 0.4s ease;
	}
	.fullscreen-menu.active {
		opacity: 1;
		visibility: visible;
	}
	.menu-content {
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.menu-content .nav{
		width: max-content;
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		left: 15%;
	}
	.menu-content .nav li{
		display: block;
		margin: 0 0 7% 0;
	}
	.menu-content .nav li:nth-child(5){
		display: block;
		margin: 0 0 30% 0;
	}
	.menu-content .nav li:last-child{
		width: 400px;
		display: block;
		margin: 0 0 0% 0;
		overflow: hidden;
		position: relative;
		background: #fff;
	}
	.menu-content .nav li:last-child a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.menu-content .nav li:last-child a .on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.menu-content .nav li:last-child a .re-txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1){
		width: 48%;
		height: 1px;
		background: #fff;
		margin: 0 !important;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(2){
		width: 48%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 2.3em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
		background: transparent;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li .link{
		color: var(--nav-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1em;
		letter-spacing: .1em;
		line-height: 1.5em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #fff, 0 0 0 #fff;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.menu-content .nav li .link:hover {
	text-shadow: 0 0 0 #fff, 0 1.5em 0 #fff;
	}
	.menu-content .nav-logo{
		width: 10%;
		position: absolute;
		right: 3%;
		bottom: 5%;
	}
	.nav {
		list-style: none;
	}
	.nav li {
		opacity: 0;
		transform: translateX(-20px);
	}
	@keyframes slideInUp {
		from {
			opacity: 0;
			transform: translateX(-20px);
		}
		to {
			opacity: 1;
			transform: translateX(0);
		}
	}
	.fullscreen-menu.active .nav li {
		animation: slideInUp 0.6s ease-out forwards !important;
	}
	.fullscreen-menu.active .nav li:nth-child(1) { animation-delay: 0.1s !important; }
	.fullscreen-menu.active .nav li:nth-child(2) { animation-delay: 0.2s !important; }
	.fullscreen-menu.active .nav li:nth-child(3) { animation-delay: 0.3s !important; }
	.fullscreen-menu.active .nav li:nth-child(4) { animation-delay: 0.4s !important; }
	.fullscreen-menu.active .nav li:nth-child(5) { animation-delay: 0.5s !important; }
	.fullscreen-menu.active .nav li:nth-child(6) { animation-delay: 0.6s !important; }
	.fullscreen-menu.active .nav li:nth-child(7) { animation-delay: 0.7s !important; }
	.fullscreen-menu.active .nav li:nth-child(8) { animation-delay: 0.8s !important; }
	.fullscreen-menu.active .nav li:nth-child(9) { animation-delay: 0.9s !important; }


	/* header */
	header{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 7% 0;
	}
	header .title{
		width: 25%;
		line-height: 0;
		position: absolute;
		bottom: 20%;
		left: 10%;
	}
	.slideshow-wrapper {
		width: 100%;
		position: relative;
	}
	.slideshow-container {
		position: relative;
		background: #fff;
		overflow: hidden;
	}
	.slide-counter {
		position: absolute;
		bottom: 15%;
		right: 11%;
		color: white;
		font-size: 1em;
		letter-spacing: .5em;
		z-index: 10;
	}
	.slide-counter span{
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 200;
		font-style: normal;
	}
	.progress-bar-wrap {
		position: absolute;
		height: 1px;
		bottom: 14%;
		left: calc(97% - 200px);
		background: rgba(255, 255, 255, .5);
		max-width: 200px;
		z-index: 30;
		overflow: hidden;
		width: 300px;
	}
	.progress-bar {
		height: 1px;
		background: #0071b9;
		width: 0%;
		z-index: 11;
		max-width: 200px;
	}
	.slick-slide {
		opacity: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		transition: opacity 0.6s ease-in-out;
	}
	.slick-active {
		opacity: 1;
	}
	.slide-controls {
		position: absolute;
		bottom: 15%;
		right: 3%;
		display: flex;
		gap: 10px;
		z-index: 20;
	}
	.slide-prev,
	.slide-next {
		width: 20px;
		line-height: 0;
		border: none;
		background: transparent;
		color: white;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: background 0.3s ease;
		-webkit-appearance: none; /* 追加 */
		appearance: none;         /* 追加 */
	}
	.slide-prev:hover,
	.slide-next:hover {
		opacity: .5;
		transition: .3s;
	}

	/* footer */
	footer{
		width: 100%;
		color: var(--color-text);
		position: relative;
		padding: 5% 0 0% 0;
		background: #fff;
	}
	footer .vimeo{
		width: 75%;
		margin: 0 auto 0% auto;
		position: relative;
		overflow: hidden;
	}
	footer .vimeo::before {
		content: "";
		display: block;
		padding-top: 35%; /* この値で高さを調整（元は56.25%が16:9） */
	}
	.f-data{
		width: 70%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
	}
	.f-data .data{
		width: 45%;
	}
	.f-data .data .title{
		font-size: 1.5em;
		letter-spacing: .1em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
		margin: 0 0 5% 0;
	}
	.f-data .data .post{
		font-size: .9em;
		letter-spacing: .1em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
	}
	.f-data .data .tell{
		display: flex;
		justify-content: flex-start;
		margin: 0 0 5% 0;
	}
	.f-data .data .tell li{
		width: max-content;
	}
	.f-data .data .tell li:nth-child(2){
		margin: 0 0 0 14px;
	}
	.f-data .data .tell li a{
		width: 100%;
		font-size: .9em;
		letter-spacing: .1em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
		color: var(--color-text);
	}
	.f-data .data .f-nav{
		width: 100%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 2% auto;
		border-bottom: 1px solid #0071b9;
		box-sizing: border-box;
		padding: 0 10px;
	}
	.f-data .data .f-nav li a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: .8em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.f-data .data .f-nav li a:hover {
		text-shadow: 0 0 0 #0071b9, 0 1.5em 0 #0071b9;
	}
	.f-data .data02{
		width: 40%;
	}
	.f-data .data02 a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
		margin: 0 0 5% 0;
	}
	.f-data .data02 a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.f-data .data02 a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.f-data .data02 a .on{
		width: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		line-height: 0;
	}
	.f-data .data02 a .txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.f-data .data02 a .txt li:nth-child(1){
		width: 53%;
		height: 1px;
		background: #fff;
	}
	.f-data .data02 a .txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.f-data .data02 a .txt li:nth-child(2){
		width: 45%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 2.6em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.f-data .data02 .copy{
		font-size: .6em;
		letter-spacing: .05em;
		line-height: 2.5em;
		text-align: right;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}


	/* read */
	.read{
		width: 60%;
		color: var(--color-text);
		margin: 0 auto 10% auto;
	}
	.read .txt{
		width: 100%;
		font-size: 2.3em;
		letter-spacing: .05em;
		line-height: 1.7em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		text-align: justify;
		margin: 0 0 5% 0;
	}
	.read .txt span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt span.active {
		color: #0071b9;
	}
	.read .txt02{
		width: 50%;
		line-height: 0;
	}
	/* 1文字ずつのspan */
	.read .txt02 span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt02 span.active {
		color: #0071b9;
	}

	/* about */
	.about{
		width: 100%;
		margin: 0 auto;
		position: relative;
		padding: 5% 0 0 0;
		margin: 0 0 10% 0;
	}
	.cont-warp{
		width: 100%;
		margin: 0 auto;
		height: 2500px;
		margin-top: 0;
		position: relative;
		z-index: 10;
	}
	.cont-warp .img{
		width: 14%;
		position: sticky;
		top: 10%;
		left: 0;
		right: 0;
		margin: 0 auto;
		padding: 0 0 20% 0;
	}
	.cont-warp .img .slide {
		display: none;
		width: 100%;
	}
	.cont-warp .img .slide.active {
		display: block;
	}
	.cont-warp02{
		width: 100%;
		height: 95%;
		position: absolute;
		top: 2%;
		left: 0;
	}
	.cont-warp02 .txt {
		width: 45%;
		position: sticky;
		top: 0%;
		padding: 40% 0 0 0;
		margin: 0 auto;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		color: var(--color-text);
		text-align: justify;
	}
	.cont-warp03{
		width: 100%;
		height: 75%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.cont-warp03 .icon {
		width: 15%;
		position: sticky;
		top: 5%;
		left: 26%;
	}
	.cont-warp03 .icon .txt{
		width: max-content;
		font-size: 1.3em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		left: 4%;
		right: 0;
		margin: 0 auto;
	}
	.cont-warp03 .icon .img{
		width: 100%;
		animation: rotate360 30s linear infinite;
	}
	@keyframes rotate360 {
		0% {
			transform: rotate(0deg);
		}
		100% {
			transform: rotate(360deg);
		}
	}

	/* business-list */
	.business{
		width: 100%;
		margin: 0 auto 7% auto;
	}
	.business .title-box{
		width: 100%;
		margin: 0 auto 5% auto;
	}
	.business .title-box .title{
		font-family: "din-2014", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		font-size: 1.4em;
		letter-spacing: .2em;
		line-height: 1em;
		text-align: center;
		margin: 0 auto 1.5% auto;
	}
	.business .title-box .sub-title{
		width: max-content;
		text-align: center;
		color: var(--color-text);
		font-size: 1.8em;
		letter-spacing: .2em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 auto 2% auto;
		position: relative;
		left: .1%;
	}
	.business .title-box .icon{
		width: 15px;
		line-height: 0;
		display: block;
		margin: 0 auto;
	}
	.business-list{
		width: 70%;
		margin: 0 auto;
	}
	.business-list li{
		width: 100%;
		margin: 0 auto 8% auto;
	}
	.business-list li:last-child{
		width: 100%;
		margin: 0 auto 0 auto;
	}
	.business-list li a{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
		color: var(--color-text);
	}
	.business-list li a .img{
		width: 50%;
		overflow: hidden;
		border-radius: 15px;
	}
	.business-list li a .data{
		width: 50%;
		padding: 5% 0 0 5%;
		box-sizing: border-box;
	}
	.business-list li a .data .num{
		width: 60%;
		line-height: 0;
		margin: 0 0 10% 0;
	}
	.business-list li a .data .txt{
		font-size: 1em;
		letter-spacing: .2em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.business-list li a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	.business-list li a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .9em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.business-list li a .data .ar .icon{
		width: 33px;
		background: #0071b9;
		border-radius: 10px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.business-list li a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.business-list li a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.business-list li a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.business-list li a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* project */
	.project{
		width: 60%;
		margin: 0 auto 10% auto;
		position: relative;
		z-index: 10;
		background-color: rgba(255, 255, 255, 0.8);
	}
	.project a{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
		box-sizing: border-box;
		padding: 5% 5%;
	}
	.project a .img{
		width: 55%;
		overflow: hidden;
		border-radius: 15px;
		transition: .3s;
	}
	.project a .data{
		width: 45%;
		color: var(--color-text);
		padding: 5% 0 0 5%;
		box-sizing: border-box;
	}
	.project a .data .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 auto 5% auto;
	}
	.project a .data .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.project a .data .txt{
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.project a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	.project a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .9em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.project a .data .ar .icon{
		width: 33px;
		background: #0071b9;
		border-radius: 10px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.project a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.project a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.project a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.project a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* news-box */
	.news-box{
		width: 70%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 7% auto;
	}
	.news-box .title-box{
		width: 20%;
		box-sizing: border-box;
		padding: 0 0 0 5%;
	}
	.news-box .title-box .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.news-box .title-box .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
        color: var(--color-text);
	}
	.news-box .data-box{
		width: 70%;
	}
	#news-list{
		width: 100%;
	}
	#news-list li{
		width: 100%;
		margin: 0 0 0% 0;
	}
	#news-list li a{
		width: 100%;
        color: var(--color-text);
		display: block;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 3% 0 0 0;
		position: relative;
		text-indent: 1.5em;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	#news-list li a .news-day{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: .8em;
		margin: 0 0 0 auto;
		padding: 0 3% 0 0;
	}
	#news-list li a .line{
		width: 100%;
		height: 1px;
		background: rgba(0, 91, 170, .2);
		margin: 3% 0 0 0;
		position: relative;
	}
	#news-list li a .line .line-in{
		width: 50%;
		height: 1px;
		background: rgba(0, 91, 170, 1);
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
	}
	#news-list li a:hover .line .line-in{
		width: 100%;
		transition: .3s;
	}
	#news-list li a .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	#news-list li a:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}

	/* un-common --------------------------------------------------------*/
	.loading-screen {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen img {
		width: 20%;
		height: auto;
		animation: fadeIn 0.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	/* un-common */
	.un-common{
		width: 100%;
		position: relative;
		z-index: 110;
		margin: 0 auto 10% auto;
	}
	.fix-img-wrap{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.fix-img-wrap .fix-img{
		width: 100%;
		height: 100vh;
		position: sticky;
		top: 0;
		z-index: -1;
	}
	.un-header{
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.un-header .title{
		width: 3%;
		line-height: 0;
		position: absolute;
		left: 4%;
		top: 5%;
	}
	.un-header .num{
		width: 10%;
		line-height: 0;
		position: absolute;
		right: 2%;
		bottom: 5%;
		overflow: hidden;
	}
	.un-read{
		width: 100%;
		color: #fff;
		position: relative;
	}
	.un-read .bg{
		width: 100%;
		height: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		background-image: url(../img/un-bg.png);
		background-repeat: repeat-x;
		background-size: contain;
		opacity: 0;
		transition: opacity 1.2s ease;
	}
	.un-read .bg.show {
		opacity: .3;
	}
	.un-read .title{
		width: 100%;
        font-size: 2.1em;
        letter-spacing: .2em;
        line-height: 1.8em;
        text-align: center;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
        margin: 0 0 3% 0;
		padding: 30% 0 0 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt{
		width: 38%;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt02{
		width: 45%;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: center;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-cont{
		width: 100%;
		margin: 0 auto;
	}
	.un-cont-list{
		width: 70%;
		margin: 0 auto 15% auto;
	}
	.un-cont-list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
        color: var(--color-text);
		margin: 0 0 10% 0;
	}
	.un-cont-list li:last-child{
		margin: 0 0 0 0;
	}
	.un-cont-list li .img{
		width: 50%;
	}
	.un-cont-list li .img .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
	}
	.un-cont-list li .img .img-in02{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 5% 0 0 0;
	}
	.img-bg{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		background: #0071b9;
		z-index: 10;
	}
	.un-cont-list li .img .txt{
		width: 80%;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 5% auto 0 auto;
	}
	.un-cont-list li .data{
		width: 45%;
	}
	.un-cont-list li .data .data-in{
		width: 100%;
		display: flex;
		justify-content: flex-start;
		position: sticky;
		top: 10%;
		padding: 5% 0 10% 5%;
	}
	.un-cont-list li .data .data-in .num{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.8em;
        letter-spacing: .1em;
        line-height: 1.9em;
		margin: 0 30px 0 0;
	}
	.un-cont-list li .data .data-in .title{
		width: max-content;
		font-size: 1.6em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
	}
	.un-cont-list li .data .data-in .title span{
        letter-spacing: .05em;
	}
	.un-f-img {
		width: 100%;
		height: 80vh;
		margin: 0 auto 10% auto;
		overflow: hidden;
		background: #000;
	}

	/* un-f-nav */
	.un-f-nav{
		width: 80%;
		margin: 0 auto 10% auto;
		position: relative;
		z-index: 10;
	}
	.un-f-nav-list{
		width: 100%;
		display: flex;
		justify-content: flex-start;
	}
	.un-f-nav-list li{
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
	}
	.un-f-nav-list li:nth-child(2){
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
		border-right: 1px solid #0071b9;
	}
	.un-f-nav-list a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.un-f-nav-list a .img{
		width: 70%;
		margin: 0 auto;
		transform: scale(1);
		transition: .5s;
	}
	.un-f-nav-list a:hover .img{
		transform: scale(1.3);
		transition: .5s;
	}
	.un-f-nav-list a .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
		transform: scale(1.05);
		transition: 1s;
	}
	.un-f-nav-list a:hover .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 1;
		transform: scale(1);
		transition: 1s;
	}
	.un-f-nav-list a .title{
		width: 100%;
		margin: 0 auto;
		text-align: center;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: 1.3em;
		letter-spacing: .2em;
        color: var(--color-text);
		margin: 3% 0 0 0;
	}
	.un-f-nav-list a .num{
		width: 6%;
		position: relative;
		left: 15%;
		margin: 0 0 5% 0;
	}

	/* civil_works --------------------------------------------------------*/
	.fix-img-civi{
		width: 100%;
		background: url(../img/civil00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* constr_uction --------------------------------------------------------*/
	.fix-img-constr{
		width: 100%;
		background: url(../img/constr00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* surveying_work --------------------------------------------------------*/
	.fix-img-surveying{
		width: 100%;
		background: url(../img/surveying00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}
	
	/* other_duties --------------------------------------------------------*/
	.fix-img-other{
		width: 100%;
		background: url(../img/other00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* message-box --------------------------------------------------------*/
	.message-box{
		width: 70%;
		margin: 10% auto 10% auto;
		display: flex;
		justify-content: space-between;
	}
	.message-box .title-box{
		width: 20%;
	}
	.message-box .title-in{
		width: 100%;
		position: relative;
		left: 15%;
	}
	.message-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.message-box .title-in .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.message-box .data-box{
		width: 60%;
	}
	.message-box .data-box .img{
		width: 100%;
		margin: 0 0 7% 0;
	}
	.message-box .data-box .name{
		width: 90%;
        color: var(--color-text);
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 auto 5% auto;
	}
	.message-box .data-box .name span{
		width: 90%;
        color: var(--color-text);
		font-size: 1.9em;
        letter-spacing: .2em;
        line-height: 2.5em;
		margin: 0 0 0 30px;
	}
	.message-box .data-box .txt{
		width: 90%;
        color: var(--color-text);
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 auto;
	}

	/* message-box --------------------------------------------------------*/
	.company-box{
		width: 70%;
		margin: 0% auto 10% auto;
		display: flex;
		justify-content: space-between;
	}
	.company-box .title-box{
		width: 20%;
	}
	.company-box .title-in{
		width: 100%;
		position: relative;
		left: 15%;
	}
	.company-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.company-box .title-in .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.company-box .data-box{
		width: 60%;
	}
	.company-list{
		width: 100%;
	}
	.company-list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		margin: 0 0 3% 0;
		padding: 0 0 3% 0;
	}
	.company-list li:last-child{
		margin: 0 0 0% 0;
		border-bottom: none;
	}
	.company-list li .logo{
		width: 40%;
		line-height: 0;
		margin: 3% 0 0 0;
	}
	.company-list li .title{
		width: 25%;
		color: var(--color-text);
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 0 0 5%;
	}
	.company-list li .data{
		width: 70%;
		color: var(--color-text);
		font-size: .9em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 5% 0 0;
	}
	.company-list li .data a{
		color: var(--color-text);
	}
	/* map-box */
	.map-box{
		width: 100%;
		margin: 0 auto 0% auto;
		position: relative;
		z-index: 10;
	}
	.map-box .title-box {
        width: 100%;
        margin: 0 auto 5% auto;
    }
	.map-box .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
    }
	.map-box .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
    }
	.map-box .title-box .icon {
        width: 15px;
        line-height: 0;
        display: block;
        margin: 0 auto;
    }
	.map {
		position: relative;
		width: 100%;
		padding-top: 40%;
		height: 0;
	}
	.map iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* works --------------------------------------------------------*/
	.works{
		width: 100%;
		position: relative;
		z-index: 10;
		margin: 10% auto 0 auto;
		background: #f8f8f7;
	}
	.works-bg{
		width: 100%;
		height: 200px;
		position: relative;
		z-index: 8;
		background: linear-gradient(to bottom, #f8f8f7 0%, rgba(248, 248, 247, 0.7) 30%, rgba(248, 248, 247, 0.3) 70%, transparent 100%);
	}
	.works .title-box {
        width: 100%;
        margin: 0 auto 5% auto;
    }
	.works .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
    }
	.works .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
    }
	.works .title-box .icon {
        width: 15px;
        line-height: 0;
        display: block;
        margin: 0 auto;
    }
	.filter-buttons {
		width: 55%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 auto 5% auto;
	}
	.filter-btn {
		width: 18%;
		padding: 2px 5px;
		border: 1px solid #0071b9;
		text-align: center;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		cursor: pointer;
		transition: all 0.3s ease;
        color: var(--color-text);
		background: #f8f8f7;
	}
	.filter-btn:hover {
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.filter-btn.active {
		background-color: #0071b9;
		border-color: #0071b9;
		color: #fff;
	}
	.items-grid {
		width: 65%;
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
		gap: 7%;
		list-style: none;
		margin: 0 auto 10% auto;
	}
	.item a{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		transition: all 0.3s ease;
		animation: fadeIn 0.4s ease;
	}
	.item.hidden {
		display: none;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
			transform: translateY(10px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}
	.item-img{
		width: 100%;
		overflow: hidden;
		margin: 0 0 20px 0;
	}
	.item-category {
		width: 40%;
        color: var(--color-text);
		padding: 0px 10px;
		border: 1px solid #0071b9;
		box-sizing: border-box;
		text-align: center;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10px 0;
	}
	.item-day {
		width: 55%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: left;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-description {
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-id {
		font-size: 12px;
		color: #999;
	}
	.no-results {
		text-align: center;
		color: #999;
		padding: 40px 20px;
		font-size: 16px;
	}
	@media (max-width: 768px) {
		.filter-buttons {
			flex-direction: column;
			align-items: stretch;
		}

		.filter-btn {
			width: 100%;
		}

		.items-grid {
			grid-template-columns: 1fr;
		}
	}

	/* works-un */
	.works-un{
		width: 80%;
		display: flex;
		justify-content: space-between;
		margin: 10% auto 0 auto;
		position: relative;
		z-index: 10;
		background: #f8f8f7;
	}
	.works-un .data{
		width: 25%;
	}
	.works-un .data .data-list{
		width: 100%;
		color: var(--color-text);
	}
	.works-un .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li .title{
		width: 100%;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 3em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 600;
font-style: normal;
		white-space: nowrap;
		margin: 0 0 2% 0;
	}
	.works-un .data .data-list li .txt{
		width: 100%;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.works-un .data .data-list li:nth-child(1){
		width: 100%;
		border: 1px solid #0071b9;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 0 0 5%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li:nth-child(2){
		width: 100%;
        font-size: 1.3em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.works-un .cont{
		width: 65%;
	}
	.works-un .cont .main-list{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 5%;
		margin: 0 auto 7% auto;
	}
	.works-un .cont .main-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .main-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.works-un .cont .sub-list{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 3%;
		margin: 0 auto 20% auto;
	}
	.works-un .cont .sub-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .sub-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .bottom-btn{
		width: max-content;
		margin: 0 0 0% auto;
	}
	.works-un .cont .bottom-btn a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.works-un .cont .bottom-btn a:hover {
		text-shadow: 0 0 0 #0071b9, 0 1.5em 0 #0071b9;
	}
	.works-un .cont .bottom-btn a .line{
		width: 100%;
		height: 1px;
		display: block;
		background: #0071b9;
	}

	/* CONTACT --------------------------------------------------------*/
	.contact_title{
		width: 100%;
		margin: 10% auto 7% auto;
	}
	.contact_title .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
	}
	.contact_title .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .2%;
	}

	/* FORM ------------------------ */
	#formWrap{
		width: 50%;
		margin: 0% auto 10% auto;
		box-sizing: border-box;
	}
	#formWrap .main-title{
		width: 100%;
        font-size: 21px;
        letter-spacing: 4px;
        text-align: center;
        line-height: 2.5em;
        font-weight: 600;
        margin: 0 auto 10% auto;
		border-bottom: 1px solid #0071b9;
	}
	.form-row{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.form-label-txt{
		font-size: 1em;
		letter-spacing: .1em;
        line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		margin: 0 0 10px 0;
		display: block;
		color: #0071b9;
	}
	.input-txt{
		width: 100%;
		line-height: 3em;
		box-sizing: border-box;
		padding: 0 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	.select-txt{
		width: 100%;
		padding: 15px 10px 15px 20px;
		border-radius: 5px;
		border: 1px solid #0071b9;
		color: #0071b9;
		letter-spacing: .1em;
        line-height: 1em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		font-size: 1em;
	}
	.input-sub{
		font-size: 9px;
		letter-spacing: 1px;
		margin: 0 0 0 10px;
		display: inline-block;
		white-space: nowrap;
		background: #0071b9;
		color: #fff;
		line-height: 1em;
		padding: 5px 10px;
		border-radius: 3px;
		position: relative;
		top: -3px;
	}
	textarea{
		width: 100%;
		min-height: 300px;
		box-sizing: border-box;
		padding: 10px 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	select {
		padding: 10px 35px 10px 10px;
		background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005baa' stroke-width='2'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
		background-repeat: no-repeat;
		background-position: right 10px center;
		background-size: 20px;
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		cursor: pointer;
	}

	/* Firefoxの矢印を非表示 */
	select::-moz-appearance {
		appearance: none;
	}
	.submit-link{
		width: 25%;
		font-size: .9em;
        letter-spacing: .1em;
		display: inline-block;
		background: #0071b9;
		color: #fff;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link:hover{
		background: #fff;
		color: #0071b9;
		transition: .3s;
	}
	.submit-link02{
		width: 25%;
		font-size: .9em;
        letter-spacing: .1em;
		display: inline-block;
		background: #fff;
		color: #0071b9;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link02:hover{
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.form-row-btn{
		display: block;
		font-size: 12px;
		letter-spacing: 2px;
		margin: 15px 0 0 0;
	}
	.honey-pot {
		display: none !important;
		visibility: hidden !important;
	}

	/* RECRUIT --------------------------------------------------------*/
	.recruit-box{
		width: 100%;
		position: relative;
		margin: 0 auto 5% auto;
	}
	.recruit-box .title{
		width: 25%;
        position: absolute;
        bottom: 7%;
        left: 8%;
        line-height: 0;
		overflow: hidden;
	}
	.recruit-box .txt{
		width: max-content;
		position: absolute;
		bottom: 5%;
		right: 3%;
		color: #fff;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_top{
		width: 100%;
        margin: 0 auto 5% auto;
	}
	.recruit_top .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
	}
	.recruit_top .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
	}
	.recruit_top .icon{
		width: 15px;
        line-height: 0;
        display: block;
        margin: 0 auto 5% auto;
        animation: arrowBounce 2s infinite;
	}
	.recruit_top .top-link{
		width: 60%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto;
	}
	.recruit_top .top-link li{
		width: 30%;
	}
	.recruit_top .top-link li a{
		width: 100%;
		display: block;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		padding: 0 10px;
		box-sizing: border-box;
		text-align: center;
		color: #0071b9;
		transition: .3s;
	}
	.recruit_top .top-link li a:hover{
		color: #fff;
		background: #0071b9;
		transition: .3s;
	}
	.recruit_01{
		width: 60%;
		margin: 0 auto 10% auto;
	}
	.recruit_01_list{
		width: 100%;
	}
	.recruit_01_list li:first-child{
		width: 100%;
		border-top: 1px solid #b2cee5;
		border-bottom: 1px solid #b2cee5;
	}
	.recruit_01_list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid #b2cee5;
		color: var(--color-text);
		padding: 5% 0 5% 0;
	}
	.recruit_01_list li .title-box{
		width: 35%;
	}
	.recruit_01_list li .title-box .title-in {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        padding: 0% 0 10% 0;
    }
	.recruit_01_list li .title-box .title-in .num {
        width: max-content;
        font-family: "avenir-lt-pro", sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 1.8em;
        letter-spacing: .1em;
        line-height: 1.9em;
        margin: 0 30px 0 0;
    }
	.recruit_01_list li .title-box .title-in .title {
        width: max-content;
        font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		white-space: nowrap;
    }
	.recruit_01_list li .data{
		width: 55%;
		padding: 1% 0 0 0;
	}
	.recruit_01_list li .data .txt{
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        text-align: justify;
		margin: 0 0 5% 0;
	}
	.recruit_01_list li .data .sub-title{
		width: max-content;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		border-radius: 100px;
		box-sizing: border-box;
		padding: 0 20px;
		margin: 0 0 2% 0;
	}
	.recruit_01_list li .data .list-txt{
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}

	.recruit_02{
		width: 60%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 10% auto;
		color: var(--color-text);
	}
	.recruit_02 .title-box{
		width: 35%;
	}
	.recruit_02 .title-box .title-in {
        width: 100%;
        position: sticky;
        top: 10%;
        padding: 0% 0 10% 0;
    }
	.recruit_02 .title-box .title-in .title {
        font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        white-space: nowrap;
		margin: 0 0 10% 0;
    }
	.recruit_02 .title-box .title-in .img-in {
		width: 100%;
		margin: 0 0 5% 0;
    }
	.recruit_02 .title-box .title-in .txt {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list .cou{
        font-size: .7em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .data{
		width: 55%;
		padding: 1% 0 0 0;
	}
	.recruit_02 .data .data-list{
		width: 100%;
	}
	.recruit_02 .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li:last-child{
		width: 100%;
		margin: 0;
	}
	.recruit_02 .data .data-list li .title{
		width: 100%;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 3.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border-bottom: 1px solid #b2cee5;
		margin: 0 0 2% 0;
	}
	.recruit_02 .data .data-list li .txt{
		width: 100%;
		font-size: .9em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
	}
	.recruit_02 .data .data-list li .main-title{
		width: 100%;
		background: #0071b9;
		color: #fff;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		box-sizing: border-box;
		padding: 0 0 0 20px;
		margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: end;
	}
	.recruit_02 .data .data-list li .end-box .end-box01{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .end-title{
		width: max-content;
        font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border: 1px solid #0071b9;
        border-radius: 100px;
        box-sizing: border-box;
        padding: 0 20px;
        margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: .9em;
        letter-spacing: .2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen span{
		width: max-content;
        letter-spacing: 0em;
	}
	.recruit_02 .data .data-list li .end-box .end-box02{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt01{
		width: 100%;
        font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border-bottom: 1px solid #b2cee5;
        margin: 0 0 5% 0;
		padding: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: end;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02 span{
		width: max-content;
		font-size: 1.2em;
        letter-spacing: 0em;
	}
	.recruit_02 .data .data-list li .cou{
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 5% 0 0 0;
	}

	.recruit-btn{
		width: 30%;
		display: block;
		position: relative;
		margin: 0 auto 10% auto;
		border: 1px solid #0071b9;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        color: var(--color-text);
		text-align: center;
		padding: 2% 0;
		background: #fff;
	}
	.recruit-btn .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	.recruit-btn:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}
	
}

/*//////////////////////////////// notepc ////////////////////////////*/
@media (min-width: 1025px) and (max-width: 1280px) {
	.sp-on { display: none !important; }

	/* fix-bg */
	.fix-bg{
		width: 100%;
		height: 100%;
		position: relative;
		z-index: -10;
	}
	.fix-bg-logo {
		position: fixed;
	}
	.fix-bg-logo svg {
		width: 100%;
		height: auto;
		display: block;
	}
	.fix-bg-on{
		width: 100%;
		height: 100%;
		position: fixed;
		background-color: rgba(255, 255, 255, 0.8);
		backdrop-filter: blur(60px);
		-webkit-backdrop-filter: blur(60px);
		top: 0;
		left: 0;
	}

	/* load */
	.loading-screen-index {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen-index.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen-index .loading-list {
		width: 40%;
		position: relative;
		animation: fadeIn 1.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	.loading-screen-index .loading-list li:nth-child(2){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(3){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(4){
		width: 60%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		margin: 0;
	}
	.loading-screen-index .loading-list li:nth-child(5){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	/* fix-logo */
	.fix-logo {
		width: 13%;
		position: fixed;
		top: 20px;
		left: 20px;
		line-height: 0;
		z-index: 100;
		visibility: visible;
		transition: opacity 0.6s ease, visibility 0.6s ease;
	}
	.fix-logo.hide {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
	.fix-logo a {
		display: block;
	}
	.fix-logo svg {
		width: 100%;
		height: auto;
	}
	.fix-logo .cls-1 {
		transition: fill 0.3s ease-in-out;
		fill: #231815;
	}
	.fix-logo .cls-3 {
		transition: fill 0.3s ease-in-out;
		fill: #00a059;
	}
	.fix-logo:hover .cls-1,
	.fix-logo:hover .cls-3 {
		fill: #0071b9;
	}

	/* nav */
	.hamburger {
		position: fixed;
		top: 20px;
		right: 20px;
		background: none;
		border: none;
		z-index: 1001;
		background: #0071b8;
		height: 30px;
	}
	.hamburger .txt{
		width: 100%;
		position: relative;
		top: 27px;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: .9em;
		letter-spacing: .1em;
		color: #0071b8;
		text-align: center;
	}
	.hamburger.active .txt{
		color: #fff;
	}
	.btn-trigger {
		width: 50px;
		height: 30px;
		cursor: pointer;
		border-radius: 12px;
	}
	.btn-trigger span {
		position: absolute;
		left: 0;
		width: 60%;
		height: 1px;
		background-color: #fff;
		border-radius: 4px;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	.btn-trigger, .btn-trigger span {
		display: inline-block;
		transition: all .5s;
		box-sizing: border-box;
	}
	.btn-trigger span:nth-of-type(1) {
		top: 11px;
	}
	.btn-trigger span:nth-of-type(3) {
		bottom: 11px;
	}
	#hamburgerBtn {
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.5s ease-in-out;
	}
	#hamburgerBtn.show {
		opacity: 1;
		pointer-events: auto;
	}
	#hamburgerBtn span:nth-of-type(1) {
	-webkit-animation: btn07-bar01 .75s forwards;
	animation: btn07-bar01 .75s forwards;
	}
	@-webkit-keyframes btn07-bar01 {
		0% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar01 {
		0% {
			transform: translateY(5px) rotate(45deg);
		}
		50% {
			transform: translateY(5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn span:nth-of-type(3) {
		-webkit-animation: btn07-bar03 .75s forwards;
		animation: btn07-bar03 .75s forwards;
	}
	@-webkit-keyframes btn07-bar03 {
		0% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar03 {
		0% {
			transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			transform: translateY(-5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn.active span:nth-of-type(1) {
		-webkit-animation: active-btn07-bar01 .75s forwards;
		animation: active-btn07-bar01 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar01 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
	}
	@keyframes active-btn07-bar01 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(4px) rotate(0);
		}
		100% {
			transform: translateY(4px) rotate(25deg);
		}
	}
	#hamburgerBtn.active span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn.active span:nth-of-type(3) {
		-webkit-animation: active-btn07-bar03 .75s forwards;
		animation: active-btn07-bar03 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar03 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
	}
	@keyframes active-btn07-bar03 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(-3px) rotate(0);
		}
		100% {
			transform: translateY(-3px) rotate(-25deg);
		}
	}
	.fullscreen-menu {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #0071b8;
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.4s ease, visibility 0.4s ease;
	}
	.fullscreen-menu.active {
		opacity: 1;
		visibility: visible;
	}
	.menu-content {
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.menu-content .nav{
		width: max-content;
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		left: 15%;
	}
	.menu-content .nav li{
		display: block;
		margin: 0 0 7% 0;
	}
	.menu-content .nav li:nth-child(5){
		display: block;
		margin: 0 0 30% 0;
	}
	.menu-content .nav li:last-child{
		width: 400px;
		display: block;
		margin: 0 0 0% 0;
		overflow: hidden;
		position: relative;
		background: #fff;
	}
	.menu-content .nav li:last-child a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.menu-content .nav li:last-child a .on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.menu-content .nav li:last-child a .re-txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1){
		width: 53%;
		height: 1px;
		background: #fff;
		margin: 0 !important;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(2){
		width: 45%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 2.3em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
		background: transparent;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li .link{
		color: var(--nav-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1em;
		letter-spacing: .1em;
		line-height: 1.5em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #fff, 0 0 0 #fff;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.menu-content .nav li .link:hover {
	text-shadow: 0 0 0 #fff, 0 1.5em 0 #fff;
	}
	.menu-content .nav-logo{
		width: 10%;
		position: absolute;
		right: 3%;
		bottom: 5%;
	}
	.nav {
		list-style: none;
	}
	.nav li {
		opacity: 0;
		transform: translateX(-20px);
	}
	@keyframes slideInUp {
		from {
			opacity: 0;
			transform: translateX(-20px);
		}
		to {
			opacity: 1;
			transform: translateX(0);
		}
	}
	.fullscreen-menu.active .nav li {
		animation: slideInUp 0.6s ease-out forwards !important;
	}
	.fullscreen-menu.active .nav li:nth-child(1) { animation-delay: 0.1s !important; }
	.fullscreen-menu.active .nav li:nth-child(2) { animation-delay: 0.2s !important; }
	.fullscreen-menu.active .nav li:nth-child(3) { animation-delay: 0.3s !important; }
	.fullscreen-menu.active .nav li:nth-child(4) { animation-delay: 0.4s !important; }
	.fullscreen-menu.active .nav li:nth-child(5) { animation-delay: 0.5s !important; }
	.fullscreen-menu.active .nav li:nth-child(6) { animation-delay: 0.6s !important; }
	.fullscreen-menu.active .nav li:nth-child(7) { animation-delay: 0.7s !important; }
	.fullscreen-menu.active .nav li:nth-child(8) { animation-delay: 0.8s !important; }
	.fullscreen-menu.active .nav li:nth-child(9) { animation-delay: 0.9s !important; }


	/* header */
	header{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 7% 0;
	}
	header .title{
		width: 25%;
		line-height: 0;
		position: absolute;
		bottom: 20%;
		left: 10%;
	}
	.slideshow-wrapper {
		width: 100%;
		position: relative;
	}
	.slideshow-container {
		position: relative;
		background: #fff;
		overflow: hidden;
	}
	.slide-counter {
		position: absolute;
		bottom: 6%;
		right: 14%;
		color: white;
		font-size: 1em;
		letter-spacing: .5em;
		z-index: 10;
	}
	.slide-counter span{
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 200;
		font-style: normal;
	}
	.progress-bar-wrap {
		position: absolute;
		height: 1px;
		bottom: 5%;
		left: calc(97% - 200px);
		background: rgba(255, 255, 255, .5);
		max-width: 200px;
		z-index: 30;
		overflow: hidden;
		width: 300px;
	}
	.progress-bar {
		height: 1px;
		background: #0071b9;
		width: 0%;
		z-index: 11;
		max-width: 200px;
	}
	.slick-slide {
		opacity: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		transition: opacity 0.6s ease-in-out;
	}
	.slick-active {
		opacity: 1;
	}
	.slide-controls {
		position: absolute;
		bottom: 6%;
		right: 3%;
		display: flex;
		gap: 10px;
		z-index: 20;
	}
	.slide-prev,
	.slide-next {
		width: 20px;
		line-height: 0;
		border: none;
		background: transparent;
		color: white;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: background 0.3s ease;
		-webkit-appearance: none; /* 追加 */
    	appearance: none;         /* 追加 */
	}
	.slide-prev:hover,
	.slide-next:hover {
		opacity: .5;
		transition: .3s;
	}

	/* footer */
	footer{
		width: 100%;
		color: var(--color-text);
		position: relative;
		padding: 5% 0 5% 0;
		background: #fff;
	}
	footer .vimeo{
		width: 75%;
		margin: 0 auto 0% auto;
		position: relative;
		overflow: hidden;
	}
	footer .vimeo::before {
		content: "";
		display: block;
		padding-top: 35%; /* この値で高さを調整（元は56.25%が16:9） */
	}
	.f-data{
		width: 70%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
	}
	.f-data .data{
		width: 45%;
	}
	.f-data .data .title{
		font-size: 1.5em;
		letter-spacing: .1em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
		margin: 0 0 5% 0;
	}
	.f-data .data .post{
		font-size: .9em;
		letter-spacing: .1em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
	}
	.f-data .data .tell{
		display: flex;
		justify-content: flex-start;
		margin: 0 0 5% 0;
	}
	.f-data .data .tell li{
		width: max-content;
	}
	.f-data .data .tell li:nth-child(2){
		margin: 0 0 0 14px;
	}
	.f-data .data .tell li a{
		width: 100%;
		font-size: .9em;
		letter-spacing: .1em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
		color: var(--color-text);
	}
	.f-data .data .f-nav{
		width: 100%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 2% auto;
		border-bottom: 1px solid #0071b9;
		box-sizing: border-box;
		padding: 0 10px;
	}
	.f-data .data .f-nav li a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: .8em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.f-data .data .f-nav li a:hover {
		text-shadow: 0 0 0 #0071b9, 0 1.5em 0 #0071b9;
	}
	.f-data .data02{
		width: 40%;
	}
	.f-data .data02 a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
		margin: 0 0 5% 0;
	}
	.f-data .data02 a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.f-data .data02 a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.f-data .data02 a .on{
		width: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		line-height: 0;
	}
	.f-data .data02 a .txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.f-data .data02 a .txt li:nth-child(1){
		width: 53%;
		height: 1px;
		background: #fff;
	}
	.f-data .data02 a .txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.f-data .data02 a .txt li:nth-child(2){
		width: 45%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 2.6em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.f-data .data02 .copy{
		font-size: .6em;
		letter-spacing: .05em;
		line-height: 2.5em;
		text-align: right;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}


	/* read */
	.read{
		width: 60%;
		color: var(--color-text);
		margin: 0 auto 10% auto;
	}
	.read .txt{
		width: 100%;
		font-size: 1.7em;
		letter-spacing: .05em;
		line-height: 1.7em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		text-align: justify;
		margin: 0 0 5% 0;
	}
	.read .txt span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt span.active {
		color: #0071b9;
	}
	.read .txt02{
		width: 50%;
		line-height: 0;
	}
	/* 1文字ずつのspan */
	.read .txt02 span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt02 span.active {
		color: #0071b9;
	}

	/* about */
	.about{
		width: 100%;
		margin: 0 auto;
		position: relative;
		padding: 5% 0 0 0;
	}
	.cont-warp{
		width: 100%;
		margin: 0 auto;
		height: 2500px;
		margin-top: 0;
		position: relative;
		z-index: 10;
	}
	.cont-warp .img{
		width: 14%;
		position: sticky;
		top: 10%;
		left: 0;
		right: 0;
		margin: 0 auto;
		padding: 0 0 27% 0;
	}
	.cont-warp .img .slide {
		display: none;
		width: 100%;
	}
	.cont-warp .img .slide.active {
		display: block;
	}
	.cont-warp02{
		width: 100%;
		height: 95%;
		position: absolute;
		top: 2%;
		left: 0;
	}
	.cont-warp02 .txt {
		width: 50%;
		position: sticky;
		top: 0%;
		padding: 40% 0 0 0;
		margin: 0 auto;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		color: var(--color-text);
		text-align: justify;
	}
	.cont-warp03{
		width: 100%;
		height: 75%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.cont-warp03 .icon {
		width: 15%;
		position: sticky;
		top: 5%;
		left: 26%;
	}
	.cont-warp03 .icon .txt{
		width: max-content;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		left: 4%;
		right: 0;
		margin: 0 auto;
	}
	.cont-warp03 .icon .img{
		width: 100%;
		animation: rotate360 30s linear infinite;
	}
	@keyframes rotate360 {
		0% {
			transform: rotate(0deg);
		}
		100% {
			transform: rotate(360deg);
		}
	}

	/* business-list */
	.business{
		width: 100%;
		margin: 0 auto 7% auto;
	}
	.business .title-box{
		width: 100%;
		margin: 0 auto 5% auto;
	}
	.business .title-box .title{
		font-family: "din-2014", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		font-size: 1.4em;
		letter-spacing: .2em;
		line-height: 1em;
		text-align: center;
		margin: 0 auto 1.5% auto;
	}
	.business .title-box .sub-title{
		width: max-content;
		text-align: center;
		color: var(--color-text);
		font-size: 1.8em;
		letter-spacing: .2em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 auto 2% auto;
		position: relative;
		left: .1%;
	}
	.business .title-box .icon{
		width: 15px;
		line-height: 0;
		display: block;
		margin: 0 auto;
	}
	.business-list{
		width: 70%;
		margin: 0 auto;
	}
	.business-list li{
		width: 100%;
		margin: 0 auto 8% auto;
	}
	.business-list li:last-child{
		width: 100%;
		margin: 0 auto 0 auto;
	}
	.business-list li a{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
		color: var(--color-text);
	}
	.business-list li a .img{
		width: 50%;
		overflow: hidden;
		border-radius: 15px;
	}
	.business-list li a .data{
		width: 50%;
		padding: 5% 0 0 5%;
		box-sizing: border-box;
	}
	.business-list li a .data .num{
		width: 60%;
		line-height: 0;
		margin: 0 0 10% 0;
	}
	.business-list li a .data .txt{
		font-size: .9em;
		letter-spacing: .2em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.business-list li a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	.business-list li a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .9em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.business-list li a .data .ar .icon{
		width: 33px;
		background: #0071b9;
		border-radius: 10px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.business-list li a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.business-list li a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.business-list li a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.business-list li a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* project */
	.project{
		width: 60%;
		margin: 0 auto 10% auto;
		position: relative;
		z-index: 10;
		background-color: rgba(255, 255, 255, 0.8);
	}
	.project a{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
		box-sizing: border-box;
		padding: 5% 5%;
	}
	.project a .img{
		width: 55%;
		overflow: hidden;
		border-radius: 15px;
		transition: .3s;
	}
	.project a .data{
		width: 45%;
		color: var(--color-text);
		padding: 5% 0 0 5%;
		box-sizing: border-box;
	}
	.project a .data .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 auto 5% auto;
	}
	.project a .data .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.project a .data .txt{
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.project a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	.project a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .9em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.project a .data .ar .icon{
		width: 33px;
		background: #0071b9;
		border-radius: 10px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.project a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.project a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.project a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.project a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* news-box */
	.news-box{
		width: 70%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 7% auto;
	}
	.news-box .title-box{
		width: 20%;
		box-sizing: border-box;
		padding: 0 0 0 5%;
	}
	.news-box .title-box .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.news-box .title-box .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.news-box .data-box{
		width: 70%;
	}
	#news-list{
		width: 100%;
	}
	#news-list li{
		width: 100%;
		margin: 0 0 0% 0;
	}
	#news-list li a{
		width: 100%;
        color: var(--color-text);
		display: block;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 3% 0 0 0;
		position: relative;
		text-indent: 1.5em;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	#news-list li a .news-day{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: .7em;
		margin: 0 0 0 auto;
		padding: 0 3% 0 0;
	}
	#news-list li a .line{
		width: 100%;
		height: 1px;
		background: rgba(0, 91, 170, .2);
		margin: 3% 0 0 0;
		position: relative;
	}
	#news-list li a .line .line-in{
		width: 50%;
		height: 1px;
		background: rgba(0, 91, 170, 1);
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
	}
	#news-list li a:hover .line .line-in{
		width: 100%;
		transition: .3s;
	}
	#news-list li a .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	#news-list li a:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}

	/* un-common --------------------------------------------------------*/
	.loading-screen {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen img {
		width: 20%;
		height: auto;
		animation: fadeIn 0.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	/* un-common */
	.un-common{
		width: 100%;
		position: relative;
		z-index: 110;
		margin: 0 auto 10% auto;
	}
	.fix-img-wrap{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.fix-img-wrap .fix-img{
		width: 100%;
		height: 100vh;
		position: sticky;
		top: 0;
		z-index: -1;
	}
	.un-header{
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.un-header .title{
		width: 3%;
		line-height: 0;
		position: absolute;
		left: 4%;
		top: 5%;
	}
	.un-header .num{
		width: 10%;
		line-height: 0;
		position: absolute;
		right: 2%;
		bottom: 5%;
		overflow: hidden;
	}
	.un-read{
		width: 100%;
		color: #fff;
		position: relative;
	}
	.un-read .bg{
		width: 100%;
		height: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		background-image: url(../img/un-bg.png);
		background-repeat: repeat-x;
		background-size: contain;
		opacity: 0;
		transition: opacity 1.2s ease;
	}
	.un-read .bg.show {
		opacity: .3;
	}
	.un-read .title{
		width: 100%;
        font-size: 2.1em;
        letter-spacing: .2em;
        line-height: 1.8em;
        text-align: center;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
        margin: 0 0 3% 0;
		padding: 30% 0 0 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt{
		width: 38%;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt02{
		width: 45%;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: center;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-cont{
		width: 100%;
		margin: 0 auto;
	}
	.un-cont-list{
		width: 70%;
		margin: 0 auto 15% auto;
	}
	.un-cont-list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
        color: var(--color-text);
		margin: 0 0 10% 0;
	}
	.un-cont-list li:last-child{
		margin: 0 0 0 0;
	}
	.un-cont-list li .img{
		width: 50%;
	}
	.un-cont-list li .img .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
	}
	.un-cont-list li .img .img-in02{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 5% 0 0 0;
	}
	.img-bg{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		background: #0071b9;
		z-index: 10;
	}
	.un-cont-list li .img .txt{
		width: 80%;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 5% auto 0 auto;
	}
	.un-cont-list li .data{
		width: 45%;
	}
	.un-cont-list li .data .data-in{
		width: 100%;
		display: flex;
		justify-content: flex-start;
		position: sticky;
		top: 10%;
		padding: 5% 0 10% 5%;
	}
	.un-cont-list li .data .data-in .num{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.5em;
        letter-spacing: .1em;
        line-height: 2.2em;
		margin: 0 30px 0 0;
	}
	.un-cont-list li .data .data-in .title{
		width: max-content;
		font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
	}
	.un-cont-list li .data .data-in .title span{
        letter-spacing: .05em;
	}
	.un-f-img {
		width: 100%;
		height: 80vh;
		margin: 0 auto 10% auto;
		overflow: hidden;
		background: #000;
	}

	/* un-f-nav */
	.un-f-nav{
		width: 80%;
		margin: 0 auto 10% auto;
		position: relative;
		z-index: 10;
	}
	.un-f-nav-list{
		width: 100%;
		display: flex;
		justify-content: flex-start;
	}
	.un-f-nav-list li{
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
	}
	.un-f-nav-list li:nth-child(2){
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
		border-right: 1px solid #0071b9;
	}
	.un-f-nav-list a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.un-f-nav-list a .img{
		width: 70%;
		margin: 0 auto;
		transform: scale(1);
		transition: .5s;
	}
	.un-f-nav-list a:hover .img{
		transform: scale(1.3);
		transition: .5s;
	}
	.un-f-nav-list a .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
		transform: scale(1.05);
		transition: 1s;
	}
	.un-f-nav-list a:hover .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 1;
		transform: scale(1);
		transition: 1s;
	}
	.un-f-nav-list a .title{
		width: 100%;
		margin: 0 auto;
		text-align: center;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: 1.3em;
		letter-spacing: .2em;
        color: var(--color-text);
		margin: 3% 0 0 0;
	}
	.un-f-nav-list a .num{
		width: 6%;
		position: relative;
		left: 15%;
		margin: 0 0 5% 0;
	}

	/* civil_works --------------------------------------------------------*/
	.fix-img-civi{
		width: 100%;
		background: url(../img/civil00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* constr_uction --------------------------------------------------------*/
	.fix-img-constr{
		width: 100%;
		background: url(../img/constr00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* surveying_work --------------------------------------------------------*/
	.fix-img-surveying{
		width: 100%;
		background: url(../img/surveying00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}
	
	/* other_duties --------------------------------------------------------*/
	.fix-img-other{
		width: 100%;
		background: url(../img/other00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* message-box --------------------------------------------------------*/
	.message-box{
		width: 70%;
		margin: 10% auto 10% auto;
		display: flex;
		justify-content: space-between;
	}
	.message-box .title-box{
		width: 20%;
	}
	.message-box .title-in{
		width: 100%;
		position: relative;
		left: 15%;
	}
	.message-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.message-box .title-in .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.message-box .data-box{
		width: 60%;
	}
	.message-box .data-box .img{
		width: 100%;
		margin: 0 0 7% 0;
	}
	.message-box .data-box .name{
		width: 100%;
        color: var(--color-text);
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 5% 0;
	}
	.message-box .data-box .name span{
		width: 100%;
        color: var(--color-text);
		font-size: 1.9em;
        letter-spacing: .2em;
        line-height: 2.5em;
		margin: 0 0 0 30px;
	}
	.message-box .data-box .txt{
		width: 100%;
        color: var(--color-text);
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
	}

	/* message-box --------------------------------------------------------*/
	.company-box{
		width: 70%;
		margin: 0% auto 10% auto;
		display: flex;
		justify-content: space-between;
	}
	.company-box .title-box{
		width: 20%;
	}
	.company-box .title-in{
		width: 100%;
		position: relative;
		left: 15%;
	}
	.company-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.company-box .title-in .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.company-box .data-box{
		width: 60%;
	}
	.company-list{
		width: 100%;
	}
	.company-list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		margin: 0 0 3% 0;
		padding: 0 0 3% 0;
	}
	.company-list li:last-child{
		margin: 0 0 0% 0;
		border-bottom: none;
	}
	.company-list li .logo{
		width: 40%;
		line-height: 0;
		margin: 3% 0 0 0;
	}
	.company-list li .title{
		width: 25%;
		color: var(--color-text);
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 0 0 5%;
	}
	.company-list li .data{
		width: 70%;
		color: var(--color-text);
		font-size: .9em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 5% 0 0;
	}
	.company-list li .data a{
		color: var(--color-text);
	}
	/* map-box */
	.map-box{
		width: 100%;
		margin: 0 auto 0% auto;
		position: relative;
		z-index: 10;
	}
	.map-box .title-box {
        width: 100%;
        margin: 0 auto 5% auto;
    }
	.map-box .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
    }
	.map-box .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
    }
	.map-box .title-box .icon {
        width: 15px;
        line-height: 0;
        display: block;
        margin: 0 auto;
        animation: arrowBounce 2s infinite;
    }
	.map {
		position: relative;
		width: 100%;
		padding-top: 40%;
		height: 0;
	}
	.map iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* works --------------------------------------------------------*/
	.works{
		width: 100%;
		position: relative;
		z-index: 10;
		margin: 10% auto 0 auto;
		background: #f8f8f7;
	}
	.works-bg{
		width: 100%;
		height: 200px;
		position: relative;
		z-index: 8;
		background: linear-gradient(to bottom, #f8f8f7 0%, rgba(248, 248, 247, 0.7) 30%, rgba(248, 248, 247, 0.3) 70%, transparent 100%);
	}
	.works .title-box {
        width: 100%;
        margin: 0 auto 5% auto;
    }
	.works .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
    }
	.works .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
    }
	.works .title-box .icon {
        width: 15px;
        line-height: 0;
        display: block;
        margin: 0 auto;
    }
	.filter-buttons {
		width: 55%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 auto 5% auto;
	}
	.filter-btn {
		width: 18%;
		padding: 2px 5px;
		border: 1px solid #0071b9;
		text-align: center;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		cursor: pointer;
		transition: all 0.3s ease;
        color: var(--color-text);
		background: #f8f8f7;
	}
	.filter-btn:hover {
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.filter-btn.active {
		background-color: #0071b9;
		border-color: #0071b9;
		color: #fff;
	}
	.items-grid {
		width: 65%;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 5%;
		list-style: none;
		margin: 0 auto 10% auto;
	}
	.item a{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		transition: all 0.3s ease;
		animation: fadeIn 0.4s ease;
	}
	.item.hidden {
		display: none;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
			transform: translateY(10px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}
	.item-img{
		width: 100%;
		overflow: hidden;
		margin: 0 0 20px 0;
	}
	.item-category {
		width: 40%;
        color: var(--color-text);
		padding: 0px 10px;
		border: 1px solid #0071b9;
		box-sizing: border-box;
		text-align: center;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10px 0;
	}
	.item-day {
		width: 55%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: left;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-description {
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-id {
		font-size: 12px;
		color: #999;
	}
	.no-results {
		text-align: center;
		color: #999;
		padding: 40px 20px;
		font-size: 16px;
	}
	@media (max-width: 768px) {
		.filter-buttons {
			flex-direction: column;
			align-items: stretch;
		}

		.filter-btn {
			width: 100%;
		}

		.items-grid {
			grid-template-columns: 1fr;
		}
	}

	/* works-un */
	.works-un{
		width: 80%;
		display: flex;
		justify-content: space-between;
		margin: 10% auto 0 auto;
		position: relative;
		z-index: 10;
		background: #f8f8f7;
	}
	.works-un .data{
		width: 25%;
	}
	.works-un .data .data-list{
		width: 100%;
		color: var(--color-text);
	}
	.works-un .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li .title{
		width: 100%;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 3em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 600;
font-style: normal;
		white-space: nowrap;
		margin: 0 0 2% 0;
	}
	.works-un .data .data-list li .txt{
		width: 100%;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.works-un .data .data-list li:nth-child(1){
		width: 100%;
		border: 1px solid #0071b9;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 0 0 5%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li:nth-child(2){
		width: 100%;
        font-size: 1.3em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.works-un .cont{
		width: 65%;
	}
	.works-un .cont .main-list{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 5%;
		margin: 0 auto 7% auto;
	}
	.works-un .cont .main-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .main-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.works-un .cont .sub-list{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 3%;
		margin: 0 auto 20% auto;
	}
	.works-un .cont .sub-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .sub-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .bottom-btn{
		width: max-content;
		margin: 0 0 0% auto;
	}
	.works-un .cont .bottom-btn a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.works-un .cont .bottom-btn a:hover {
		text-shadow: 0 0 0 #0071b9, 0 1.5em 0 #0071b9;
	}
	.works-un .cont .bottom-btn a .line{
		width: 100%;
		height: 1px;
		display: block;
		background: #0071b9;
	}

	/* CONTACT --------------------------------------------------------*/
	.contact_title{
		width: 100%;
		margin: 10% auto 7% auto;
	}
	.contact_title .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
	}
	.contact_title .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .2%;
	}

	/* FORM ------------------------ */
	#formWrap{
		width: 50%;
		margin: 0% auto 10% auto;
		box-sizing: border-box;
	}
	#formWrap .main-title{
		width: 100%;
        font-size: 21px;
        letter-spacing: 4px;
        text-align: center;
        line-height: 2.5em;
        font-weight: 600;
        margin: 0 auto 10% auto;
		border-bottom: 1px solid #0071b9;
	}
	.form-row{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.form-label-txt{
		font-size: 1em;
		letter-spacing: .1em;
        line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		margin: 0 0 10px 0;
		display: block;
		color: #0071b9;
	}
	.input-txt{
		width: 100%;
		line-height: 3em;
		box-sizing: border-box;
		padding: 0 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	.select-txt{
		width: 100%;
		padding: 15px 10px 15px 20px;
		border-radius: 5px;
		border: 1px solid #0071b9;
		color: #0071b9;
		letter-spacing: .1em;
        line-height: 1em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		font-size: 1em;
	}
	.input-sub{
		font-size: 9px;
		letter-spacing: 1px;
		margin: 0 0 0 10px;
		display: inline-block;
		white-space: nowrap;
		background: #0071b9;
		color: #fff;
		line-height: 1em;
		padding: 5px 10px;
		border-radius: 3px;
		position: relative;
		top: -3px;
	}
	textarea{
		width: 100%;
		min-height: 300px;
		box-sizing: border-box;
		padding: 10px 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	select {
		padding: 10px 35px 10px 10px;
		background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005baa' stroke-width='2'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
		background-repeat: no-repeat;
		background-position: right 10px center;
		background-size: 20px;
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		cursor: pointer;
	}

	/* Firefoxの矢印を非表示 */
	select::-moz-appearance {
		appearance: none;
	}
	.submit-link{
		width: 25%;
		font-size: .9em;
        letter-spacing: .1em;
		display: inline-block;
		background: #0071b9;
		color: #fff;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link:hover{
		background: #fff;
		color: #0071b9;
		transition: .3s;
	}
	.submit-link02{
		width: 25%;
		font-size: .9em;
        letter-spacing: .1em;
		display: inline-block;
		background: #fff;
		color: #0071b9;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link02:hover{
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.form-row-btn{
		display: block;
		font-size: 12px;
		letter-spacing: 2px;
		margin: 15px 0 0 0;
	}
	.honey-pot {
		display: none !important;
		visibility: hidden !important;
	}

	/* RECRUIT --------------------------------------------------------*/
	.recruit-box{
		width: 100%;
		position: relative;
		margin: 0 auto 5% auto;
	}
	.recruit-box .title{
		width: 25%;
        position: absolute;
        bottom: 7%;
        left: 8%;
        line-height: 0;
		overflow: hidden;
	}
	.recruit-box .txt{
		width: max-content;
		position: absolute;
		bottom: 5%;
		right: 3%;
		color: #fff;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_top{
		width: 100%;
        margin: 0 auto 5% auto;
	}
	.recruit_top .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
	}
	.recruit_top .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
	}
	.recruit_top .icon{
		width: 15px;
        line-height: 0;
        display: block;
        margin: 0 auto 5% auto;
        animation: arrowBounce 2s infinite;
	}
	.recruit_top .top-link{
		width: 60%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto;
	}
	.recruit_top .top-link li{
		width: 30%;
	}
	.recruit_top .top-link li a{
		width: 100%;
		display: block;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		padding: 0 10px;
		box-sizing: border-box;
		text-align: center;
		color: #0071b9;
		transition: .3s;
	}
	.recruit_top .top-link li a:hover{
		color: #fff;
		background: #0071b9;
		transition: .3s;
	}
	.recruit_01{
		width: 60%;
		margin: 0 auto 10% auto;
	}
	.recruit_01_list{
		width: 100%;
	}
	.recruit_01_list li:first-child{
		width: 100%;
		border-top: 1px solid #b2cee5;
		border-bottom: 1px solid #b2cee5;
	}
	.recruit_01_list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid #b2cee5;
		color: var(--color-text);
		padding: 5% 0 5% 0;
	}
	.recruit_01_list li .title-box{
		width: 35%;
	}
	.recruit_01_list li .title-box .title-in {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        padding: 0% 0 10% 0;
    }
	.recruit_01_list li .title-box .title-in .num {
        width: max-content;
        font-family: "avenir-lt-pro", sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 1.8em;
        letter-spacing: .1em;
        line-height: 1.9em;
        margin: 0 30px 0 0;
    }
	.recruit_01_list li .title-box .title-in .title {
        width: max-content;
        font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		white-space: nowrap;
    }
	.recruit_01_list li .data{
		width: 55%;
		padding: 1% 0 0 0;
	}
	.recruit_01_list li .data .txt{
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        text-align: justify;
		margin: 0 0 5% 0;
	}
	.recruit_01_list li .data .sub-title{
		width: max-content;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		border-radius: 100px;
		box-sizing: border-box;
		padding: 0 20px;
		margin: 0 0 2% 0;
	}
	.recruit_01_list li .data .list-txt{
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}

	.recruit_02{
		width: 60%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 10% auto;
		color: var(--color-text);
	}
	.recruit_02 .title-box{
		width: 35%;
	}
	.recruit_02 .title-box .title-in {
        width: 100%;
        position: sticky;
        top: 10%;
        padding: 0% 0 10% 0;
    }
	.recruit_02 .title-box .title-in .title {
        font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        white-space: nowrap;
		margin: 0 0 10% 0;
    }
	.recruit_02 .title-box .title-in .img-in {
		width: 100%;
		margin: 0 0 5% 0;
    }
	.recruit_02 .title-box .title-in .txt {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list .cou{
        font-size: .7em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .data{
		width: 55%;
		padding: 1% 0 0 0;
	}
	.recruit_02 .data .data-list{
		width: 100%;
	}
	.recruit_02 .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li:last-child{
		width: 100%;
		margin: 0;
	}
	.recruit_02 .data .data-list li .title{
		width: 100%;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 3.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border-bottom: 1px solid #b2cee5;
		margin: 0 0 2% 0;
	}
	.recruit_02 .data .data-list li .txt{
		width: 100%;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
	}
	.recruit_02 .data .data-list li .main-title{
		width: 100%;
		background: #0071b9;
		color: #fff;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		box-sizing: border-box;
		padding: 0 0 0 20px;
		margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: end;
	}
	.recruit_02 .data .data-list li .end-box .end-box01{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .end-title{
		width: max-content;
        font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border: 1px solid #0071b9;
        border-radius: 100px;
        box-sizing: border-box;
        padding: 0 20px;
        margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen span{
		width: max-content;
        letter-spacing: 0em;
	}
	.recruit_02 .data .data-list li .end-box .end-box02{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt01{
		width: 100%;
        font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border-bottom: 1px solid #b2cee5;
        margin: 0 0 5% 0;
		padding: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: end;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02 span{
		width: max-content;
		font-size: 1.2em;
        letter-spacing: 0em;
	}
	.recruit_02 .data .data-list li .cou{
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 5% 0 0 0;
	}

	.recruit-btn{
		width: 30%;
		display: block;
		position: relative;
		margin: 0 auto 10% auto;
		border: 1px solid #0071b9;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        color: var(--color-text);
		text-align: center;
		padding: 2% 0;
		background: #fff;
	}
	.recruit-btn .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	.recruit-btn:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}

}

/*//////////////////////////////// for pad ////////////////////////////*/
@media (min-width: 767px) and (max-width: 1024px) {
	.sp-on { display: none !important; }

	/* fix-bg */
	.fix-bg{
		width: 100%;
		height: 100%;
		position: relative;
		z-index: -10;
	}
	.fix-bg-logo {
		position: fixed;
	}
	.fix-bg-logo svg {
		width: 100%;
		height: auto;
		display: block;
	}
	.fix-bg-on{
		width: 100%;
		height: 100%;
		position: fixed;
		background-color: rgba(255, 255, 255, 0.8);
		backdrop-filter: blur(60px);
		-webkit-backdrop-filter: blur(60px);
		top: 0;
		left: 0;
	}

	/* load */
	.loading-screen-index {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen-index.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen-index .loading-list {
		width: 40%;
		position: relative;
		animation: fadeIn 1.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	.loading-screen-index .loading-list li:nth-child(2){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(3){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(4){
		width: 60%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		margin: 0;
	}
	.loading-screen-index .loading-list li:nth-child(5){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	/* fix-logo */
	.fix-logo {
		width: 20%;
		position: fixed;
		top: 20px;
		left: 20px;
		line-height: 0;
		z-index: 100;
		visibility: visible;
		transition: opacity 0.6s ease, visibility 0.6s ease;
	}
	.fix-logo.hide {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
	.fix-logo a {
		display: block;
	}
	.fix-logo svg {
		width: 100%;
		height: auto;
	}
	.fix-logo .cls-1 {
		transition: fill 0.3s ease-in-out;
		fill: #231815;
	}
	.fix-logo .cls-3 {
		transition: fill 0.3s ease-in-out;
		fill: #00a059;
	}
	.fix-logo:hover .cls-1,
	.fix-logo:hover .cls-3 {
		fill: #0071b9;
	}

	/* nav */
	.hamburger {
		position: fixed;
		top: 20px;
		right: 20px;
		background: none;
		border: none;
		z-index: 1001;
		background: #0071b8;
		height: 30px;
	}
	.hamburger .txt{
		width: 100%;
		position: relative;
		top: 27px;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: .9em;
		letter-spacing: .1em;
		color: #0071b8;
		text-align: center;
	}
	.hamburger.active .txt{
		color: #fff;
	}
	.btn-trigger {
		width: 50px;
		height: 30px;
		cursor: pointer;
		border-radius: 12px;
	}
	.btn-trigger span {
		position: absolute;
		left: 0;
		width: 60%;
		height: 1px;
		background-color: #fff;
		border-radius: 4px;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	.btn-trigger, .btn-trigger span {
		display: inline-block;
		transition: all .5s;
		box-sizing: border-box;
	}
	.btn-trigger span:nth-of-type(1) {
		top: 11px;
	}
	.btn-trigger span:nth-of-type(3) {
		bottom: 11px;
	}
	#hamburgerBtn {
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.5s ease-in-out;
	}
	#hamburgerBtn.show {
		opacity: 1;
		pointer-events: auto;
	}
	#hamburgerBtn span:nth-of-type(1) {
	-webkit-animation: btn07-bar01 .75s forwards;
	animation: btn07-bar01 .75s forwards;
	}
	@-webkit-keyframes btn07-bar01 {
		0% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar01 {
		0% {
			transform: translateY(5px) rotate(45deg);
		}
		50% {
			transform: translateY(5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn span:nth-of-type(3) {
		-webkit-animation: btn07-bar03 .75s forwards;
		animation: btn07-bar03 .75s forwards;
	}
	@-webkit-keyframes btn07-bar03 {
		0% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar03 {
		0% {
			transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			transform: translateY(-5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn.active span:nth-of-type(1) {
		-webkit-animation: active-btn07-bar01 .75s forwards;
		animation: active-btn07-bar01 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar01 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
	}
	@keyframes active-btn07-bar01 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(4px) rotate(0);
		}
		100% {
			transform: translateY(4px) rotate(25deg);
		}
	}
	#hamburgerBtn.active span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn.active span:nth-of-type(3) {
		-webkit-animation: active-btn07-bar03 .75s forwards;
		animation: active-btn07-bar03 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar03 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
	}
	@keyframes active-btn07-bar03 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(-3px) rotate(0);
		}
		100% {
			transform: translateY(-3px) rotate(-25deg);
		}
	}
	.fullscreen-menu {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #0071b8;
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.4s ease, visibility 0.4s ease;
	}
	.fullscreen-menu.active {
		opacity: 1;
		visibility: visible;
	}
	.menu-content {
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.menu-content .nav{
		width: max-content;
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		left: 10%;
	}
	.menu-content .nav li{
		display: block;
		margin: 0 0 7% 0;
	}
	.menu-content .nav li:nth-child(5){
		display: block;
		margin: 0 0 30% 0;
	}
	.menu-content .nav li:last-child{
		width: 400px;
		display: block;
		margin: 0 0 0% 0;
		overflow: hidden;
		position: relative;
		background: #fff;
	}
	.menu-content .nav li:last-child a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.menu-content .nav li:last-child a .on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.menu-content .nav li:last-child a .re-txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1){
		width: 53%;
		height: 1px;
		background: #fff;
		margin: 0 !important;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(2){
		width: 45%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 2.3em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
		background: transparent;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li .link{
		color: var(--nav-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1em;
		letter-spacing: .1em;
		line-height: 1.5em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #fff, 0 0 0 #fff;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.menu-content .nav li .link:hover {
	text-shadow: 0 0 0 #fff, 0 1.5em 0 #fff;
	}
	.menu-content .nav-logo{
		width: 15%;
		position: absolute;
		right: 5%;
		bottom: 5%;
	}
	.nav {
		list-style: none;
	}
	.nav li {
		opacity: 0;
		transform: translateX(-20px);
	}
	@keyframes slideInUp {
		from {
			opacity: 0;
			transform: translateX(-20px);
		}
		to {
			opacity: 1;
			transform: translateX(0);
		}
	}
	.fullscreen-menu.active .nav li {
		animation: slideInUp 0.6s ease-out forwards !important;
	}
	.fullscreen-menu.active .nav li:nth-child(1) { animation-delay: 0.1s !important; }
	.fullscreen-menu.active .nav li:nth-child(2) { animation-delay: 0.2s !important; }
	.fullscreen-menu.active .nav li:nth-child(3) { animation-delay: 0.3s !important; }
	.fullscreen-menu.active .nav li:nth-child(4) { animation-delay: 0.4s !important; }
	.fullscreen-menu.active .nav li:nth-child(5) { animation-delay: 0.5s !important; }
	.fullscreen-menu.active .nav li:nth-child(6) { animation-delay: 0.6s !important; }
	.fullscreen-menu.active .nav li:nth-child(7) { animation-delay: 0.7s !important; }
	.fullscreen-menu.active .nav li:nth-child(8) { animation-delay: 0.8s !important; }
	.fullscreen-menu.active .nav li:nth-child(9) { animation-delay: 0.9s !important; }


	/* header */
	header{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 7% 0;
	}
	header .title{
		width: 25%;
		line-height: 0;
		position: absolute;
		bottom: 20%;
		left: 10%;
	}
	.slideshow-wrapper {
		width: 100%;
		position: relative;
	}
	.slideshow-container {
		position: relative;
		background: #fff;
		overflow: hidden;
	}
	.slide-counter {
		position: absolute;
		bottom: 6%;
		right: 11%;
		color: white;
		font-size: 1em;
		letter-spacing: .5em;
		z-index: 10;
	}
	.slide-counter span{
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 200;
		font-style: normal;
	}
	.progress-bar-wrap {
		position: absolute;
		height: 1px;
		bottom: 5%;
		left: calc(97% - 200px);
		background: rgba(255, 255, 255, .5);
		max-width: 200px;
		z-index: 30;
		overflow: hidden;
		width: 300px;
	}
	.progress-bar {
		height: 1px;
		background: #0071b9;
		width: 0%;
		z-index: 11;
		max-width: 200px;
	}
	.slick-slide {
		opacity: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		transition: opacity 0.6s ease-in-out;
	}
	.slick-active {
		opacity: 1;
	}
	.slide-controls {
		position: absolute;
		bottom: 6%;
		right: 3%;
		display: flex;
		gap: 10px;
		z-index: 20;
	}
	.slide-prev,
	.slide-next {
		width: 20px;
		line-height: 0;
		border: none;
		background: transparent;
		color: white;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: background 0.3s ease;
	}
	.slide-prev:hover,
	.slide-next:hover {
		opacity: .5;
		transition: .3s;
	}

	/* footer */
	footer{
		width: 100%;
		color: var(--color-text);
		position: relative;
		padding: 7% 0 5% 0;
		background: #fff;
	}
	footer .vimeo{
		width: 75%;
		margin: 0 auto 0% auto;
		position: relative;
		overflow: hidden;
	}
	footer .vimeo::before {
		content: "";
		display: block;
		padding-top: 35%; /* この値で高さを調整（元は56.25%が16:9） */
	}
	.f-data{
		width: 90%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
	}
	.f-data .data{
		width: 45%;
	}
	.f-data .data .title{
		font-size: 1.5em;
		letter-spacing: .1em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
		margin: 0 0 5% 0;
	}
	.f-data .data .post{
		font-size: .9em;
		letter-spacing: .1em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
	}
	.f-data .data .tell{
		display: flex;
		justify-content: flex-start;
		margin: 0 0 5% 0;
	}
	.f-data .data .tell li{
		width: max-content;
	}
	.f-data .data .tell li:nth-child(2){
		margin: 0 0 0 14px;
	}
	.f-data .data .tell li a{
		width: 100%;
		font-size: .9em;
		letter-spacing: .1em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
		color: var(--color-text);
	}
	.f-data .data .f-nav{
		width: 100%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 2% auto;
		border-bottom: 1px solid #0071b9;
		box-sizing: border-box;
		padding: 0 10px;
	}
	.f-data .data .f-nav li a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: .9em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.f-data .data .f-nav li a:hover {
		text-shadow: 0 0 0 #0071b9, 0 1.5em 0 #0071b9;
	}
	.f-data .data02{
		width: 45%;
	}
	.f-data .data02 a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
		margin: 0 0 5% 0;
	}
	.f-data .data02 a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.f-data .data02 a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.f-data .data02 a .on{
		width: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		line-height: 0;
	}
	.f-data .data02 a .txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.f-data .data02 a .txt li:nth-child(1){
		width: 53%;
		height: 1px;
		background: #fff;
	}
	.f-data .data02 a .txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.f-data .data02 a .txt li:nth-child(2){
		width: 45%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 2.6em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.f-data .data02 .copy{
		font-size: .6em;
		letter-spacing: .05em;
		line-height: 2.5em;
		text-align: right;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}


	/* read */
	.read{
		width: 70%;
		color: var(--color-text);
		margin: 0 auto 10% auto;
	}
	.read .txt{
		width: 100%;
		font-size: 1.8em;
		letter-spacing: .05em;
		line-height: 1.7em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		text-align: justify;
		margin: 0 0 5% 0;
	}
	.read .txt span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt span.active {
		color: #0071b9;
	}
	.read .txt02{
		width: 50%;
		line-height: 0;
	}
	/* 1文字ずつのspan */
	.read .txt02 span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt02 span.active {
		color: #0071b9;
	}

	/* about */
	.about{
		width: 100%;
		margin: 0 auto;
		position: relative;
		padding: 5% 0 0 0;
	}
	.cont-warp{
		width: 100%;
		margin: 0 auto;
		height: 2500px;
		margin-top: 0;
		position: relative;
		z-index: 10;
	}
	.cont-warp .img{
		width: 20%;
		position: sticky;
		top: 10%;
		left: 0;
		right: 0;
		margin: 0 auto;
		padding: 0 0 30% 0;
	}
	.cont-warp .img .slide {
		display: none;
		width: 100%;
	}
	.cont-warp .img .slide.active {
		display: block;
	}
	.cont-warp02{
		width: 100%;
		height: 95%;
		position: absolute;
		top: 2%;
		left: 0;
	}
	.cont-warp02 .txt {
		width: 65%;
		position: sticky;
		top: 0%;
		padding: 65% 0 0 0;
		margin: 0 auto;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		color: var(--color-text);
		text-align: justify;
	}
	.cont-warp03{
		width: 100%;
		height: 75%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.cont-warp03 .icon {
		width: 20%;
        position: sticky;
        top: 7%;
        left: 17%;
	}
	.cont-warp03 .icon .txt{
		width: max-content;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		left: 4%;
		right: 0;
		margin: 0 auto;
	}
	.cont-warp03 .icon .img{
		width: 100%;
		animation: rotate360 30s linear infinite;
	}
	@keyframes rotate360 {
		0% {
			transform: rotate(0deg);
		}
		100% {
			transform: rotate(360deg);
		}
	}

	/* business-list */
	.business{
		width: 100%;
		margin: 0 auto 15% auto;
	}
	.business .title-box{
		width: 100%;
		margin: 0 auto 5% auto;
	}
	.business .title-box .title{
		font-family: "din-2014", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		font-size: 1.4em;
		letter-spacing: .2em;
		line-height: 1em;
		text-align: center;
		margin: 0 auto 1.5% auto;
	}
	.business .title-box .sub-title{
		width: max-content;
		text-align: center;
		color: var(--color-text);
		font-size: 1.8em;
		letter-spacing: .2em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 auto 2% auto;
		position: relative;
		left: .1%;
	}
	.business .title-box .icon{
		width: 15px;
		line-height: 0;
		display: block;
		margin: 0 auto;
	}
	.business-list{
		width: 90%;
		margin: 0 auto;
	}
	.business-list li{
		width: 100%;
		margin: 0 auto 8% auto;
	}
	.business-list li:last-child{
		width: 100%;
		margin: 0 auto 0 auto;
	}
	.business-list li a{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
		color: var(--color-text);
	}
	.business-list li a .img{
		width: 50%;
		overflow: hidden;
		border-radius: 15px;
	}
	.business-list li a .data{
		width: 50%;
		padding: 5% 0 0 5%;
		box-sizing: border-box;
	}
	.business-list li a .data .num{
		width: 60%;
		line-height: 0;
		margin: 0 0 10% 0;
	}
	.business-list li a .data .txt{
		font-size: .9em;
		letter-spacing: .2em;
		line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.business-list li a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	.business-list li a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .9em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.business-list li a .data .ar .icon{
		width: 33px;
		background: #0071b9;
		border-radius: 10px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.business-list li a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.business-list li a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.business-list li a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.business-list li a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* project */
	.project{
		width: 80%;
		margin: 0 auto 15% auto;
		position: relative;
		z-index: 10;
		background-color: rgba(255, 255, 255, 0.8);
	}
	.project a{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
		box-sizing: border-box;
		padding: 5% 5%;
	}
	.project a .img{
		width: 55%;
		overflow: hidden;
		border-radius: 15px;
		transition: .3s;
	}
	.project a .data{
		width: 45%;
		color: var(--color-text);
		padding: 5% 0 0 5%;
		box-sizing: border-box;
	}
	.project a .data .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 auto 5% auto;
	}
	.project a .data .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.project a .data .txt{
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.project a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	.project a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .9em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.project a .data .ar .icon{
		width: 33px;
		background: #0071b9;
		border-radius: 10px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.project a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.project a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.project a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.project a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* news-box */
	.news-box{
		width: 90%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 15% auto;
	}
	.news-box .title-box{
		width: 20%;
		box-sizing: border-box;
		padding: 0 0 0 5%;
	}
	.news-box .title-box .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.news-box .title-box .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
        color: var(--color-text);
	}
	.news-box .data-box{
		width: 70%;
	}
	#news-list{
		width: 100%;
	}
	#news-list li{
		width: 100%;
		margin: 0 0 0% 0;
	}
	#news-list li a{
		width: 100%;
        color: var(--color-text);
		display: block;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 3% 0 0 0;
		position: relative;
		text-indent: 1.5em;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	#news-list li a .news-day{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: .7em;
		margin: 0 0 0 auto;
		padding: 0 5% 0 0;
	}
	#news-list li a .line{
		width: 100%;
		height: 1px;
		background: rgba(0, 91, 170, .2);
		margin: 3% 0 0 0;
		position: relative;
	}
	#news-list li a .line .line-in{
		width: 50%;
		height: 1px;
		background: rgba(0, 91, 170, 1);
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
	}
	#news-list li a:hover .line .line-in{
		width: 100%;
		transition: .3s;
	}
	#news-list li a .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	#news-list li a:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}

	/* un-common --------------------------------------------------------*/
	.loading-screen {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen img {
		width: 40%;
		height: auto;
		animation: fadeIn 0.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	/* un-common */
	.un-common{
		width: 100%;
		position: relative;
		z-index: 110;
		margin: 0 auto 15% auto;
	}
	.fix-img-wrap{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.fix-img-wrap .fix-img{
		width: 100%;
		height: 100vh;
		position: sticky;
		top: 0;
		z-index: -1;
	}
	.un-header{
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.un-header .title{
		width: 4%;
		line-height: 0;
		position: absolute;
		left: 5%;
		top: 5%;
	}
	.un-header .num{
		width: 10%;
		line-height: 0;
		position: absolute;
		right: 2%;
		bottom: 5%;
		overflow: hidden;
	}
	.un-read{
		width: 100%;
		color: #fff;
		position: relative;
	}
	.un-read .bg{
		width: 100%;
		height: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		background-image: url(../img/un-bg.png);
		background-repeat: repeat-x;
		background-size: contain;
		opacity: 0;
		transition: opacity 1.2s ease;
	}
	.un-read .bg.show {
		opacity: .3;
	}
	.un-read .title{
		width: 100%;
        font-size: 2.1em;
        letter-spacing: .2em;
        line-height: 1.8em;
        text-align: center;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
        margin: 0 0 3% 0;
		padding: 50% 0 0 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt{
		width: 80%;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt02{
		width: 45%;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: center;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-cont{
		width: 100%;
		margin: 0 auto;
	}
	.un-cont-list{
		width: 90%;
		margin: 0 auto 15% auto;
	}
	.un-cont-list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
        color: var(--color-text);
		margin: 0 0 10% 0;
	}
	.un-cont-list li:last-child{
		margin: 0 0 0 0;
	}
	.un-cont-list li .img{
		width: 50%;
	}
	.un-cont-list li .img .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
	}
	.un-cont-list li .img .img-in02{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 5% 0 0 0;
	}
	.img-bg{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		background: #0071b9;
		z-index: 10;
	}
	.un-cont-list li .img .txt{
		width: 80%;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 5% auto 0 auto;
	}
	.un-cont-list li .data{
		width: 45%;
	}
	.un-cont-list li .data .data-in{
		width: 100%;
		display: flex;
		justify-content: flex-start;
		position: sticky;
		top: 10%;
		padding: 5% 0 10% 5%;
	}
	.un-cont-list li .data .data-in .num{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.5em;
        letter-spacing: .1em;
        line-height: 2.2em;
		margin: 0 30px 0 0;
	}
	.un-cont-list li .data .data-in .title{
		width: max-content;
		font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
	}
	.un-cont-list li .data .data-in .title span{
        letter-spacing: .05em;
	}
	.un-f-img {
		width: 100%;
		height: 35vh;
		margin: 0 auto 15% auto;
		overflow: hidden;
		background: #fff;
	}

	/* un-f-nav */
	.un-f-nav{
		width: 90%;
		margin: 0 auto 15% auto;
		position: relative;
		z-index: 10;
	}
	.un-f-nav-list{
		width: 100%;
		display: flex;
		justify-content: flex-start;
	}
	.un-f-nav-list li{
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
	}
	.un-f-nav-list li:nth-child(2){
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
		border-right: 1px solid #0071b9;
	}
	.un-f-nav-list a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.un-f-nav-list a .img{
		width: 70%;
		margin: 0 auto;
		transform: scale(1);
		transition: .5s;
	}
	.un-f-nav-list a:hover .img{
		transform: scale(1.3);
		transition: .5s;
	}
	.un-f-nav-list a .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
		transform: scale(1.05);
		transition: 1s;
	}
	.un-f-nav-list a:hover .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 1;
		transform: scale(1);
		transition: 1s;
	}
	.un-f-nav-list a .title{
		width: 100%;
		margin: 0 auto;
		text-align: center;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: 1.3em;
		letter-spacing: .2em;
        color: var(--color-text);
		margin: 3% 0 0 0;
	}
	.un-f-nav-list a .num{
		width: 6%;
		position: relative;
		left: 15%;
		margin: 0 0 5% 0;
	}

	/* civil_works --------------------------------------------------------*/
	.fix-img-civi{
		width: 100%;
		background: url(../img/civil00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* constr_uction --------------------------------------------------------*/
	.fix-img-constr{
		width: 100%;
		background: url(../img/constr00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* surveying_work --------------------------------------------------------*/
	.fix-img-surveying{
		width: 100%;
		background: url(../img/surveying00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}
	
	/* other_duties --------------------------------------------------------*/
	.fix-img-other{
		width: 100%;
		background: url(../img/other00_01.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* message-box --------------------------------------------------------*/
	.message-box{
		width: 80%;
		margin: 20% auto 10% auto;
		display: flex;
		justify-content: space-between;
	}
	.message-box .title-box{
		width: 20%;
	}
	.message-box .title-in{
		width: 100%;
		position: relative;
	}
	.message-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.message-box .title-in .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.message-box .data-box{
		width: 60%;
	}
	.message-box .data-box .img{
		width: 100%;
		margin: 0 0 7% 0;
	}
	.message-box .data-box .name{
		width: 100%;
        color: var(--color-text);
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 5% 0;
	}
	.message-box .data-box .name span{
		width: 100%;
        color: var(--color-text);
		font-size: 1.9em;
        letter-spacing: .2em;
        line-height: 2.5em;
		margin: 0 0 0 30px;
	}
	.message-box .data-box .txt{
		width: 100%;
        color: var(--color-text);
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
	}

	/* message-box --------------------------------------------------------*/
	.company-box{
		width: 80%;
		margin: 0% auto 10% auto;
		display: flex;
		justify-content: space-between;
	}
	.company-box .title-box{
		width: 20%;
	}
	.company-box .title-in{
		width: 100%;
		position: relative;
	}
	.company-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 10% 0;
	}
	.company-box .title-in .sub-title{
		font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.company-box .data-box{
		width: 60%;
	}
	.company-list{
		width: 100%;
	}
	.company-list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		margin: 0 0 3% 0;
		padding: 0 0 3% 0;
	}
	.company-list li:last-child{
		margin: 0 0 0% 0;
		border-bottom: none;
	}
	.company-list li .logo{
		width: 60%;
		line-height: 0;
		margin: 3% 0 0 0;
	}
	.company-list li .title{
		width: 25%;
		color: var(--color-text);
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 0 0 5%;
	}
	.company-list li .data{
		width: 70%;
		color: var(--color-text);
		font-size: .9em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 5% 0 0;
	}
	.company-list li .data a{
		color: var(--color-text);
	}
	/* map-box */
	.map-box{
		width: 100%;
		margin: 0 auto 0% auto;
		position: relative;
		z-index: 10;
	}
	.map-box .title-box {
        width: 100%;
        margin: 0 auto 5% auto;
    }
	.map-box .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
    }
	.map-box .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
    }
	.map-box .title-box .icon {
        width: 20px;
        line-height: 0;
        display: block;
        margin: 0 auto;
        animation: arrowBounce 2s infinite;
    }
	.map {
		position: relative;
		width: 100%;
		padding-top: 40%;
		height: 0;
	}
	.map iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* works --------------------------------------------------------*/
	.works{
		width: 100%;
		position: relative;
		z-index: 10;
		margin: 15% auto 0 auto;
		background: #f8f8f7;
	}
	.works-bg{
		width: 100%;
		height: 200px;
		position: relative;
		z-index: 8;
		background: linear-gradient(to bottom, #f8f8f7 0%, rgba(248, 248, 247, 0.7) 30%, rgba(248, 248, 247, 0.3) 70%, transparent 100%);
	}
	.works .title-box {
        width: 100%;
        margin: 0 auto 5% auto;
    }
	.works .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
    }
	.works .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
    }
	.works .title-box .icon {
        width: 15px;
        line-height: 0;
        display: block;
        margin: 0 auto;
    }
	.filter-buttons {
		width: 80%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 auto 5% auto;
	}
	.filter-btn {
		width: 18%;
		padding: 2px 5px;
		border: 1px solid #0071b9;
		text-align: center;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		cursor: pointer;
		transition: all 0.3s ease;
        color: var(--color-text);
		background: #f8f8f7;
	}
	.filter-btn:hover {
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.filter-btn.active {
		background-color: #0071b9;
		border-color: #0071b9;
		color: #fff;
	}
	.items-grid {
		width: 90%;
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
		gap: 3%;
		list-style: none;
		margin: 0 auto 10% auto;
	}
	.item a{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		transition: all 0.3s ease;
		animation: fadeIn 0.4s ease;
	}
	.item.hidden {
		display: none;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
			transform: translateY(10px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}
	.item-img{
		width: 100%;
		overflow: hidden;
		margin: 0 0 20px 0;
	}
	.item-category {
		width: 40%;
        color: var(--color-text);
		padding: 0px 10px;
		border: 1px solid #0071b9;
		box-sizing: border-box;
		text-align: center;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10px 0;
	}
	.item-day {
		width: 55%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: left;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-description {
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-id {
		font-size: 12px;
		color: #999;
	}
	.no-results {
		text-align: center;
		color: #999;
		padding: 40px 20px;
		font-size: 16px;
	}
	@media (max-width: 768px) {
		.filter-buttons {
			flex-direction: column;
			align-items: stretch;
		}

		.filter-btn {
			width: 100%;
		}

		.items-grid {
			grid-template-columns: 1fr;
		}
	}

	/* works-un */
	.works-un{
		width: 90%;
		display: flex;
		justify-content: space-between;
		margin: 15% auto 0 auto;
		position: relative;
		z-index: 10;
		background: #f8f8f7;
	}
	.works-un .data{
		width: 25%;
	}
	.works-un .data .data-list{
		width: 100%;
		color: var(--color-text);
	}
	.works-un .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li .title{
		width: 100%;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 3em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 600;
font-style: normal;
		white-space: nowrap;
		margin: 0 0 2% 0;
	}
	.works-un .data .data-list li .txt{
		width: 100%;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.works-un .data .data-list li:nth-child(1){
		width: 100%;
		border: 1px solid #0071b9;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 0 0 5%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li:nth-child(2){
		width: 100%;
        font-size: 1.3em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.works-un .cont{
		width: 65%;
	}
	.works-un .cont .main-list{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 5%;
		margin: 0 auto 7% auto;
	}
	.works-un .cont .main-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .main-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.works-un .cont .sub-list{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 5%;
		margin: 0 auto 20% auto;
	}
	.works-un .cont .sub-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .sub-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .bottom-btn{
		width: max-content;
		margin: 0 0 0% auto;
	}
	.works-un .cont .bottom-btn a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.works-un .cont .bottom-btn a:hover {
		text-shadow: 0 0 0 #0071b9, 0 1.5em 0 #0071b9;
	}
	.works-un .cont .bottom-btn a .line{
		width: 100%;
		height: 1px;
		display: block;
		background: #0071b9;
	}

	/* CONTACT --------------------------------------------------------*/
	.contact_title{
		width: 100%;
		margin: 15% auto 10% auto;
	}
	.contact_title .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
	}
	.contact_title .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .2%;
	}

	/* FORM ------------------------ */
	#formWrap{
		width: 80%;
		margin: 0% auto 10% auto;
		box-sizing: border-box;
	}
	#formWrap .main-title{
		width: 100%;
        font-size: 21px;
        letter-spacing: 4px;
        text-align: center;
        line-height: 2.5em;
        font-weight: 600;
        margin: 0 auto 10% auto;
		border-bottom: 1px solid #0071b9;
	}
	.form-row{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.form-label-txt{
		font-size: 1em;
		letter-spacing: .1em;
        line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		margin: 0 0 10px 0;
		display: block;
		color: #0071b9;
	}
	.input-txt{
		width: 100%;
		line-height: 3em;
		box-sizing: border-box;
		padding: 0 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	.select-txt{
		width: 100%;
		padding: 15px 10px 15px 20px;
		border-radius: 5px;
		border: 1px solid #0071b9;
		color: #0071b9;
		letter-spacing: .1em;
        line-height: 1em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		font-size: 1em;
	}
	.input-sub{
		font-size: 9px;
		letter-spacing: 1px;
		margin: 0 0 0 10px;
		display: inline-block;
		white-space: nowrap;
		background: #0071b9;
		color: #fff;
		line-height: 1em;
		padding: 5px 10px;
		border-radius: 3px;
		position: relative;
		top: -3px;
	}
	textarea{
		width: 100%;
		min-height: 300px;
		box-sizing: border-box;
		padding: 10px 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	select {
		padding: 10px 35px 10px 10px;
		background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005baa' stroke-width='2'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
		background-repeat: no-repeat;
		background-position: right 10px center;
		background-size: 20px;
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		cursor: pointer;
	}

	/* Firefoxの矢印を非表示 */
	select::-moz-appearance {
		appearance: none;
	}
	.submit-link{
		width: 25%;
		font-size: .9em;
        letter-spacing: .1em;
		display: inline-block;
		background: #0071b9;
		color: #fff;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link:hover{
		background: #fff;
		color: #0071b9;
		transition: .3s;
	}
	.submit-link02{
		width: 25%;
		font-size: .9em;
        letter-spacing: .1em;
		display: inline-block;
		background: #fff;
		color: #0071b9;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link02:hover{
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.form-row-btn{
		display: block;
		font-size: 12px;
		letter-spacing: 2px;
		margin: 15px 0 0 0;
	}
	.honey-pot {
		display: none !important;
		visibility: hidden !important;
	}

	/* RECRUIT --------------------------------------------------------*/
	.recruit-box{
		width: 100%;
		position: relative;
		margin: 0 auto 5% auto;
	}
	.recruit-box .title{
		width: 25%;
        position: absolute;
        bottom: 7%;
        left: 8%;
        line-height: 0;
		overflow: hidden;
	}
	.recruit-box .txt{
		width: max-content;
		position: absolute;
		bottom: 5%;
		right: 3%;
		color: #fff;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_top{
		width: 100%;
        margin: 0 auto 5% auto;
	}
	.recruit_top .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1.4em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 1.5% auto;
	}
	.recruit_top .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.8em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 2% auto;
        position: relative;
        left: .1%;
	}
	.recruit_top .icon{
		width: 20px;
        line-height: 0;
        display: block;
        margin: 0 auto 5% auto;
        animation: arrowBounce 2s infinite;
	}
	.recruit_top .top-link{
		width: 80%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto;
	}
	.recruit_top .top-link li{
		width: 30%;
	}
	.recruit_top .top-link li a{
		width: 100%;
		display: block;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		padding: 0 10px;
		box-sizing: border-box;
		text-align: center;
		color: #0071b9;
		transition: .3s;
	}
	.recruit_top .top-link li a:hover{
		color: #fff;
		background: #0071b9;
		transition: .3s;
	}
	.recruit_01{
		width: 90%;
		margin: 0 auto 10% auto;
	}
	.recruit_01_list{
		width: 100%;
	}
	.recruit_01_list li:first-child{
		width: 100%;
		border-top: 1px solid #b2cee5;
		border-bottom: 1px solid #b2cee5;
	}
	.recruit_01_list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid #b2cee5;
		color: var(--color-text);
		padding: 5% 0 5% 0;
	}
	.recruit_01_list li .title-box{
		width: 35%;
	}
	.recruit_01_list li .title-box .title-in {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        padding: 0% 0 10% 0;
    }
	.recruit_01_list li .title-box .title-in .num {
        width: max-content;
        font-family: "avenir-lt-pro", sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 1.8em;
        letter-spacing: .1em;
        line-height: 1.9em;
        margin: 0 30px 0 0;
    }
	.recruit_01_list li .title-box .title-in .title {
        width: max-content;
        font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		white-space: nowrap;
    }
	.recruit_01_list li .data{
		width: 55%;
		padding: 1% 0 0 0;
	}
	.recruit_01_list li .data .txt{
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        text-align: justify;
		margin: 0 0 5% 0;
	}
	.recruit_01_list li .data .sub-title{
		width: max-content;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		border-radius: 100px;
		box-sizing: border-box;
		padding: 0 20px;
		margin: 0 0 2% 0;
	}
	.recruit_01_list li .data .list-txt{
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}

	.recruit_02{
		width: 90%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 10% auto;
		color: var(--color-text);
	}
	.recruit_02 .title-box{
		width: 35%;
	}
	.recruit_02 .title-box .title-in {
        width: 100%;
        position: sticky;
        top: 10%;
        padding: 0% 0 10% 0;
    }
	.recruit_02 .title-box .title-in .title {
        font-size: 1.5em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        white-space: nowrap;
		margin: 0 0 10% 0;
    }
	.recruit_02 .title-box .title-in .img-in {
		width: 100%;
		margin: 0 0 5% 0;
    }
	.recruit_02 .title-box .title-in .txt {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list {
        font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list .cou{
        font-size: .7em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .data{
		width: 55%;
		padding: 1% 0 0 0;
	}
	.recruit_02 .data .data-list{
		width: 100%;
	}
	.recruit_02 .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li:last-child{
		width: 100%;
		margin: 0;
	}
	.recruit_02 .data .data-list li .title{
		width: 100%;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 3.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border-bottom: 1px solid #b2cee5;
		margin: 0 0 2% 0;
	}
	.recruit_02 .data .data-list li .txt{
		width: 100%;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
	}
	.recruit_02 .data .data-list li .main-title{
		width: 100%;
		background: #0071b9;
		color: #fff;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		box-sizing: border-box;
		padding: 0 0 0 20px;
		margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: end;
	}
	.recruit_02 .data .data-list li .end-box .end-box01{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .end-title{
		width: max-content;
        font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border: 1px solid #0071b9;
        border-radius: 100px;
        box-sizing: border-box;
        padding: 0 20px;
        margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen span{
		width: max-content;
        letter-spacing: 0em;
	}
	.recruit_02 .data .data-list li .end-box .end-box02{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt01{
		width: 100%;
        font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border-bottom: 1px solid #b2cee5;
        margin: 0 0 5% 0;
		padding: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: end;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02 span{
		width: max-content;
		font-size: 1.2em;
        letter-spacing: 0em;
	}
	.recruit_02 .data .data-list li .cou{
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 5% 0 0 0;
	}

	.recruit-btn{
		width: 40%;
		display: block;
		position: relative;
		margin: 0 auto 10% auto;
		border: 1px solid #0071b9;
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        color: var(--color-text);
		text-align: center;
		padding: 2.5% 0;
		background: #fff;
	}
	.recruit-btn .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	.recruit-btn:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}

}

/*//////////////////////////////// for iphone /////////////////////////*/
@media (max-width: 766px) {
	.pc-on { display: none !important; }

	/* fix-bg */
	.fix-bg{
		width: 100%;
		height: 100%;
		position: relative;
		z-index: -10;
	}
	.fix-bg-logo {
		position: fixed;
	}
	.fix-bg-logo svg {
		width: 100%;
		height: auto;
		display: block;
	}
	.fix-bg-on{
		width: 100%;
		height: 100%;
		position: fixed;
		background-color: rgba(255, 255, 255, 0.8);
		backdrop-filter: blur(20px);
		-webkit-backdrop-filter: blur(20px);
		top: 0;
		left: 0;
	}

	/* load */
	.loading-screen-index {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen-index.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen-index .loading-list {
		width: 70%;
		position: relative;
		animation: fadeIn 1.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	.loading-screen-index .loading-list li:nth-child(2){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(3){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.loading-screen-index .loading-list li:nth-child(4){
		width: 60%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		margin: 0;
	}
	.loading-screen-index .loading-list li:nth-child(5){
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}

	/* fix-logo */
	.fix-logo {
		width: 170px;
        position: fixed;
        top: 10px;
        left: 5%;
		line-height: 0;
		z-index: 100;
		visibility: visible;
		transition: opacity 0.6s ease, visibility 0.6s ease;
	}
	.fix-logo.hide {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}
	.fix-logo a {
		display: block;
	}
	.fix-logo svg {
		width: 100%;
		height: auto;
	}
	.fix-logo .cls-1 {
		transition: fill 0.3s ease-in-out;
		fill: #231815;
	}
	.fix-logo .cls-3 {
		transition: fill 0.3s ease-in-out;
		fill: #00a059;
	}
	.fix-logo:hover .cls-1,
	.fix-logo:hover .cls-3 {
		fill: #0071b9;
	}
	.fix-logo-line {
		width: 93%;
        height: 1px;
        background: #0071b9;
        position: fixed;
        top: 67px;
        left: 0;
		right: 0;
		margin: 0 auto;
		line-height: 0;
		z-index: 100;
		opacity: .2;
	}
	.fix-logo-line.hide {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
	}

	/* nav */
	.hamburger {
		position: fixed;
		top: 15px;
		right: 10px;
		background: none;
		border: none;
		z-index: 1001;
		background: #0071b8;
		height: 25px;
	}
	.hamburger .txt{
		width: 100%;
		position: relative;
		top: 23px;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: .8em;
		letter-spacing: .1em;
		color: #0071b8;
		text-align: center;
	}
	.hamburger.active .txt{
		color: #fff;
	}
	.btn-trigger {
		width: 50px;
		height: 25px;
		cursor: pointer;
		border-radius: 10px;
	}
	.btn-trigger span {
		position: absolute;
		left: 0;
		width: 60%;
		height: 1px;
		background-color: #fff;
		border-radius: 4px;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	.btn-trigger, .btn-trigger span {
		display: inline-block;
		transition: all .5s;
		box-sizing: border-box;
	}
	.btn-trigger span:nth-of-type(1) {
		top: 9px;
	}
	.btn-trigger span:nth-of-type(3) {
		bottom: 9px;
	}
	#hamburgerBtn {
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.5s ease-in-out;
	}
	#hamburgerBtn.show {
		opacity: 1;
		pointer-events: auto;
	}
	#hamburgerBtn span:nth-of-type(1) {
	-webkit-animation: btn07-bar01 .75s forwards;
	animation: btn07-bar01 .75s forwards;
	}
	@-webkit-keyframes btn07-bar01 {
		0% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar01 {
		0% {
			transform: translateY(5px) rotate(45deg);
		}
		50% {
			transform: translateY(5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn span:nth-of-type(3) {
		-webkit-animation: btn07-bar03 .75s forwards;
		animation: btn07-bar03 .75s forwards;
	}
	@-webkit-keyframes btn07-bar03 {
		0% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(0) rotate(0);
		}
	}
	@keyframes btn07-bar03 {
		0% {
			transform: translateY(-5px) rotate(-45deg);
		}
		50% {
			transform: translateY(-5px) rotate(0);
		}
		100% {
			transform: translateY(0) rotate(0);
		}
	}
	#hamburgerBtn.active span:nth-of-type(1) {
		-webkit-animation: active-btn07-bar01 .75s forwards;
		animation: active-btn07-bar01 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar01 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(5px) rotate(45deg);
		}
	}
	@keyframes active-btn07-bar01 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(4px) rotate(0);
		}
		100% {
			transform: translateY(4px) rotate(25deg);
		}
	}
	#hamburgerBtn.active span:nth-of-type(2) {
		display: none;
	}
	#hamburgerBtn.active span:nth-of-type(3) {
		-webkit-animation: active-btn07-bar03 .75s forwards;
		animation: active-btn07-bar03 .75s forwards;
		background: #fff;
	}
	@-webkit-keyframes active-btn07-bar03 {
		0% {
			-webkit-transform: translateY(0) rotate(0);
		}
		50% {
			-webkit-transform: translateY(-5px) rotate(0);
		}
		100% {
			-webkit-transform: translateY(-5px) rotate(-45deg);
		}
	}
	@keyframes active-btn07-bar03 {
		0% {
			transform: translateY(0) rotate(0);
		}
		50% {
			transform: translateY(-3px) rotate(0);
		}
		100% {
			transform: translateY(-3px) rotate(-25deg);
		}
	}
	.fullscreen-menu {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #0071b8;
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.4s ease, visibility 0.4s ease;
	}
	.fullscreen-menu.active {
		opacity: 1;
		visibility: visible;
	}
	.menu-content {
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.menu-content .nav{
		width: 80%;
		position: absolute;
		top: 14%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.menu-content .nav li{
		display: block;
		margin: 0 0 7% 0;
	}
	.menu-content .nav li:nth-child(5){
		display: block;
		margin: 0 0 60% 0;
	}
	.menu-content .nav li:last-child{
		width: 100%;
		display: block;
		margin: 0 0 0% 0;
		overflow: hidden;
		position: relative;
		background: #fff;
	}
	.menu-content .nav li:last-child a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.menu-content .nav li:last-child a .on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.menu-content .nav li:last-child a .re-txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1){
		width: 45%;
		height: 1px;
		background: #fff;
		margin: 0 !important;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.menu-content .nav li:last-child a .re-txt li:nth-child(2){
		width: 50%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 1.8em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
		background: transparent;
	}
	.menu-content .nav li:last-child a:hover .re-txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.menu-content .nav li .link{
		color: var(--nav-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: .8em;
		letter-spacing: .1em;
		line-height: 1.5em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #fff, 0 0 0 #fff;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.menu-content .nav li .link:hover {
	text-shadow: 0 0 0 #fff, 0 1.5em 0 #fff;
	}
	.menu-content .nav-logo{
		width: 25%;
        position: absolute;
        right: 10%;
        bottom: 35%;
	}
	.nav {
		list-style: none;
	}
	.nav li {
		opacity: 0;
		transform: translateX(-20px);
	}
	@keyframes slideInUp {
		from {
			opacity: 0;
			transform: translateX(-20px);
		}
		to {
			opacity: 1;
			transform: translateX(0);
		}
	}
	.fullscreen-menu.active .nav li {
		animation: slideInUp 0.6s ease-out forwards !important;
	}
	.fullscreen-menu.active .nav li:nth-child(1) { animation-delay: 0.1s !important; }
	.fullscreen-menu.active .nav li:nth-child(2) { animation-delay: 0.2s !important; }
	.fullscreen-menu.active .nav li:nth-child(3) { animation-delay: 0.3s !important; }
	.fullscreen-menu.active .nav li:nth-child(4) { animation-delay: 0.4s !important; }
	.fullscreen-menu.active .nav li:nth-child(5) { animation-delay: 0.5s !important; }
	.fullscreen-menu.active .nav li:nth-child(6) { animation-delay: 0.6s !important; }
	.fullscreen-menu.active .nav li:nth-child(7) { animation-delay: 0.7s !important; }
	.fullscreen-menu.active .nav li:nth-child(8) { animation-delay: 0.8s !important; }
	.fullscreen-menu.active .nav li:nth-child(9) { animation-delay: 0.9s !important; }


	/* header */
	header{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	header .title{
		width: 80%;
		line-height: 0;
		position: absolute;
		left: 5%;
		right: 0;
		bottom: 20%;
		margin: 0 auto;
	}
	.slideshow-wrapper {
		width: 100%;
		position: relative;
	}
	.slideshow-container {
		position: relative;
		background: #fff;
		overflow: hidden;
	}
	.slide-counter {
		position: absolute;
		bottom: 4%;
		right: 20%;
		color: white;
		font-size: .7em;
		letter-spacing: .5em;
		z-index: 10;
	}
	.slide-counter span{
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 200;
		font-style: normal;
	}
	.progress-bar-wrap {
		position: absolute;
		height: 1px;
		bottom: 3%;
		left: calc(97% - 100px);
		background: rgba(255, 255, 255, .5);
		z-index: 30;
		overflow: hidden;
		width: 100px;
	}
	.progress-bar {
		height: 1px;
		background: #0071b9;
		width: 0%;
		z-index: 11;
		max-width: 200px;
	}
	.slick-slide {
		opacity: 0;
		line-height: 0;
		margin: 0;
		padding: 0;
		transition: opacity 0.6s ease-in-out;
	}
	.slick-active {
		opacity: 1;
	}
	.slide-controls {
		position: absolute;
		bottom: 4.5%;
		right: 3%;
		display: flex;
		gap: 2px;
		z-index: 20;
	}
	.slide-prev,
	.slide-next {
		width: 20px !important;
		line-height: 0;
		border: none;
		background: transparent;
		color: white;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: background 0.3s ease;
	}
	.slide-prev:hover,
	.slide-next:hover {
		opacity: .5;
		transition: .3s;
	}

	/* footer */
	footer{
		width: 100%;
		color: var(--color-text);
		position: relative;
		padding: 15% 0 5% 0;
		background: #fff;
	}
	footer .vimeo{
		width: 100%;
		margin: 0 auto 0% auto;
		position: relative;
		overflow: hidden;
		left: 0%;
	}
	footer .vimeo::before {
		content: "";
		display: block;
		padding-top: 34%; /* この値で高さを調整（元は56.25%が16:9） */
	}
	.f-data{
		width: 90%;
		margin: 0 auto;
	}
	.f-data .data{
		width: 100%;
		margin: 0 0 10% 0;
	}
	.f-data .data .title{
		font-size: 1.2em;
		letter-spacing: .1em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
		text-align: center;
		margin: 0 0 5% 0;
	}
	.f-data .data .post{
		font-size: .8em;
		letter-spacing: .1em;
		line-height: 2em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
		text-align: center;
	}
	.f-data .data .tell{
		display: flex;
		justify-content: center;
		margin: 0 auto 7% auto;
	}
	.f-data .data .tell li{
		width: max-content;
	}
	.f-data .data .tell li:nth-child(2){
		margin: 0 0 0 11px;
	}
	.f-data .data .tell li a{
		width: 100%;
		font-size: .8em;
		letter-spacing: .1em;
		line-height: 2em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		white-space: nowrap;
		color: var(--color-text);
	}
	.f-data .data .f-nav{
		width: 100%;
		display: flex;
		justify-content: space-between;
		margin: 0 auto 2% auto;
		border-bottom: 1px solid #0071b9;
		box-sizing: border-box;
		padding: 0 10px;
	}
	.f-data .data .f-nav li a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: .7em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -2em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
		padding-bottom: 1.5em;  /* ← 追加 */
    	margin-bottom: -1.5em; /* ← 追加（レイアウトへの影響を相殺） */
	}
	.f-data .data .f-nav li a:hover {
		text-shadow: 0 0 0 #0071b9, 0 2em 0 #0071b9;
	}
	.f-data .data02{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.f-data .data02 a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
		margin: 0 0 4% 0;
	}
	.f-data .data02 a .un{
		opacity: 1;
		backdrop-filter: blur(0px);
		-webkit-backdrop-filter: blur(0px);
		transform: scale(1);
		transition: .3s;
	}
	.f-data .data02 a:hover .un{
		opacity: .5;
		filter: blur(1px);
		-webkit-filter: blur(1px);
		transform: scale(1.02);
		transition: .3s;
	}
	.f-data .data02 a .on{
		width: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		line-height: 0;
	}
	.f-data .data02 a .txt{
		width: 90%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: absolute;
		bottom: 3%;
		left: 0%;
		right: 0;
		margin: 0 auto;
	}
	.f-data .data02 a .txt li:nth-child(1){
		width: 53%;
		height: 1px;
		background: #fff;
	}
	.f-data .data02 a .txt li:nth-child(1) .line{
		width: 0%;
		height: 1px;
		background: #0071b9;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(1) .line{
		width: 100%;
		transition: .3s;
	}
	.f-data .data02 a .txt li:nth-child(2){
		width: 45%;
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
		font-size: 1.8em;
		letter-spacing: .1em;
		line-height: 1em;
		white-space: nowrap;
		text-align: right;
		color: #fff;
		transition: .3s;
	}
	.f-data .data02 a:hover .txt li:nth-child(2){
		color: #0071b9;
		transition: .3s;
	}
	.f-data .data02 .copy{
		font-size: .4em;
		letter-spacing: .05em;
		line-height: 2.5em;
		text-align: center;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}


	/* read */
	.read{
		width: 90%;
		color: var(--color-text);
		margin: 0 auto 25% auto;
	}
	.read .txt{
		width: 100%;
		font-size: 1.2em;
		letter-spacing: .05em;
		line-height: 1.7em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		text-align: justify;
		margin: 0 0 5% 0;
	}
	.read .txt span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt span.active {
		color: #0071b9;
	}
	.read .txt02{
		width: 50%;
		line-height: 0;
	}
	/* 1文字ずつのspan */
	.read .txt02 span {
		transition: color 0.3s ease;
		color: #eee;
	}
	.read .txt02 span.active {
		color: #0071b9;
	}

	/* about */
	.about{
		width: 100%;
		margin: 0 auto;
		position: relative;
		padding: 5% 0 0 0;
	}
	.cont-warp{
		width: 100%;
		margin: 0 auto;
		height: 2500px;
		margin-top: 0;
		position: relative;
		z-index: 10;
	}
	.cont-warp .img{
		width: 40%;
		position: sticky;
		top: 15%;
		left: 0;
		right: 0;
		margin: 0 auto;
		padding: 0 0 80% 0;
	}
	.cont-warp .img .slide {
		display: none;
		width: 100%;
	}
	.cont-warp .img .slide.active {
		display: block;
	}
	.cont-warp02{
		width: 100%;
		height: 95%;
		position: absolute;
		top: 2%;
		left: 0;
	}
	.cont-warp02 .txt {
		width: 80%;
		position: sticky;
		top: 0%;
		padding: 120% 0 0 0;
		margin: 0 auto;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		color: var(--color-text);
		text-align: justify;
	}
	.cont-warp03{
		width: 100%;
		height: 80%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.cont-warp03 .icon {
		width: 33%;
        position: sticky;
        top: 15%;
        left: 3%;
	}
	.cont-warp03 .icon .txt{
		width: max-content;
		font-size: .75em;
        letter-spacing: .1em;
        line-height: 1.6em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
		left: 4%;
		right: 0;
		margin: 0 auto;
	}
	.cont-warp03 .icon .img{
		width: 100%;
		animation: rotate360 30s linear infinite;
	}
	@keyframes rotate360 {
		0% {
			transform: rotate(0deg);
		}
		100% {
			transform: rotate(360deg);
		}
	}

	/* business-list */
	.business{
		width: 100%;
		margin: 0 auto 15% auto;
	}
	.business .title-box{
		width: 100%;
		margin: 0 auto 10% auto;
	}
	.business .title-box .title{
		font-family: "din-2014", sans-serif;
		font-weight: 600;
		font-style: normal;
		color: var(--color-text);
		font-size: 1em;
		letter-spacing: .2em;
		line-height: 1em;
		text-align: center;
		margin: 0 auto 3% auto;
	}
	.business .title-box .sub-title{
		width: max-content;
		text-align: center;
		color: var(--color-text);
		font-size: 1.3em;
		letter-spacing: .2em;
		line-height: 1em;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 auto 4% auto;
		position: relative;
		left: .1%;
	}
	.business .title-box .icon{
		width: 12px;
		line-height: 0;
		display: block;
		margin: 0 auto;
	}
	.business-list{
		width: 80%;
		margin: 0 auto;
	}
	.business-list li{
		width: 100%;
		margin: 0 auto 15% auto;
	}
	.business-list li:last-child{
		width: 100%;
		margin: 0 auto 0 auto;
	}
	.business-list li a{
		width: 100%;
		color: var(--color-text);
	}
	.business-list li a .img{
		width: 100%;
		overflow: hidden;
		border-radius: 10px;
		margin: 0 0 7% 0;
	}
	.business-list li a .data{
		width: 100%;
		box-sizing: border-box;
		margin: 0 auto;
	}
	.business-list li a .data .num{
		width: 70%;
		line-height: 0;
		margin: 0 0 6% 0;
	}
	.business-list li a .data .txt{
		font-size: .9em;
		letter-spacing: .1em;
		line-height: 2.2em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 0 5% 0;
	}
	.business-list li a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin: 0 0 0 auto;
	}
	.business-list li a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .7em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.business-list li a .data .ar .icon{
		width: 25px;
		background: #0071b9;
		border-radius: 5px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.business-list li a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.business-list li a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.business-list li a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.business-list li a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* project */
	.project{
		width: 100%;
		margin: 0 auto 15% auto;
		position: relative;
		z-index: 10;
		background-color: rgba(255, 255, 255, 0.8);
		box-sizing: border-box;
		padding: 5% 3%;
	}
	.project a{
		width: 95%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-direction: row-reverse;
		margin: 0 0 0 5%;
	}
	.project a .img{
		width: 60%;
		overflow: hidden;
		border-radius: 10px;
		transition: .3s;
	}
	.project a .data{
		width: 40%;
		color: var(--color-text);
		box-sizing: border-box;
	}
	.project a .data .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 auto 5% auto;
	}
	.project a .data .sub-title{
		font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		margin: 0 0 25% 0;
	}
	.project a .data .txt{
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 8% 0;
	}
	.project a .data .ar{
		width: max-content;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin: 0 0 0 0;
	}
	.project a .data .ar .ar-txt{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: .7em;
        letter-spacing: .1em;
        line-height: 1em;
		margin: 0 10px 0 0;
	}
	.project a .data .ar .icon{
		width: 25px;
		background: #0071b9;
		border-radius: 5px;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
		line-height: 0;
		overflow: hidden;
		position: relative;
	}
	.project a .data .ar .icon li:nth-child(1){
		transform: translateX(0);
		transition: .3s;
	}
	.project a:hover .ar .icon li:nth-child(1){
		transform: translateX(200%);
		transition: .3s;
	}
	.project a .data .ar .icon li:nth-child(2){
		transform: translateX(-200%);
		transition: .3s;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		box-sizing: border-box;
		padding: 5px 7px 4px 7px;
	}
	.project a:hover .ar .icon li:nth-child(2){
		transform: translateX(0%);
		transition: .3s;
	}

	/* news-box */
	.news-box{
		width: 80%;
		margin: 0 auto 15% auto;
	}
	.news-box .title-box{
		width: 100%;
		margin: 0 auto 5% auto;
	}
	.news-box .title-box .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
		font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        margin: 0 0 3% 0;
	}
	.news-box .title-box .sub-title{
		font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
        color: var(--color-text);
	}
	.news-box .data-box{
		width: 100%;
	}
	#news-list{
		width: 100%;
	}
	#news-list li{
		width: 100%;
		margin: 0 0 0% 0;
	}
	#news-list li a{
		width: 100%;
        color: var(--color-text);
		display: block;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 5% 0 0 0;
		position: relative;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	#news-list li a .news-day{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: .7em;
		margin: 0 0 0 auto;
		padding: 0 0% 0 0;
	}
	#news-list li a .line{
		width: 100%;
		height: 1px;
		background: rgba(0, 91, 170, .2);
		margin: 3% 0 0 0;
		position: relative;
	}
	#news-list li a .line .line-in{
		width: 50%;
		height: 1px;
		background: rgba(0, 91, 170, 1);
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
	}
	#news-list li a:hover .line .line-in{
		width: 100%;
		transition: .3s;
	}
	#news-list li a .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	#news-list li a:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}

	/* un-common --------------------------------------------------------*/
	.loading-screen {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}
	.loading-screen.fade-out {
		opacity: 0;
		pointer-events: none;
	}
	.loading-screen img {
		width: 40%;
		height: auto;
		animation: fadeIn 0.8s ease-in-out;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
		}
		to {
			opacity: 1;
		}
	}
	/* un-common */
	.un-common{
		width: 100%;
		position: relative;
		z-index: 110;
		margin: 0 auto 15% auto;
	}
	.fix-img-wrap{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.fix-img-wrap .fix-img{
		width: 100%;
		height: 100vh;
		position: sticky;
		top: 0;
		z-index: -1;
	}
	.un-header{
		width: 100%;
		height: 100vh;
		position: relative;
	}
	.un-header .title{
		width: 7%;
		line-height: 0;
		position: absolute;
		left: 0;
		right: 0;
		margin: 0 auto;
		bottom: 15%;
	}
	.un-header .num{
		width: 15%;
		line-height: 0;
		position: absolute;
		right: 5%;
		top: 3%;
		overflow: hidden;
	}
	.un-read{
		width: 100%;
		color: #fff;
		position: relative;
	}
	.un-read .bg{
		width: 100%;
		height: 100%;
		position: absolute;
		bottom: 0;
		left: 0;
		background-image: url(../img/un-bg.png);
		background-repeat: repeat-x;
		background-size: contain;
		opacity: 0;
		transition: opacity 1.2s ease;
	}
	.un-read .bg.show {
		opacity: .3;
	}
	.un-read .title{
		width: 100%;
        font-size: 1.3em;
        letter-spacing: .1em;
        line-height: 1.8em;
        text-align: center;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
        margin: 0 0 7% 0;
		padding: 50% 0 0 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt{
		width: 80%;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-read .txt02{
		width: 80%;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 auto;
		padding: 0 0 10% 0;
		position: relative;
		z-index: 10;
	}
	.un-cont{
		width: 100%;
		margin: 0 auto;
	}
	.un-cont-list{
		width: 80%;
		margin: 0 auto 15% auto;
	}
	.un-cont-list li{
		width: 100%;
        color: var(--color-text);
		margin: 0 0 15% 0;
	}
	.un-cont-list li:last-child{
		margin: 0 0 0 0;
	}
	.un-cont-list li .img{
		width: 100%;
	}
	.un-cont-list li .img .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
	}
	.un-cont-list li .img .img-in02{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 5% 0 0 0;
	}
	.img-bg{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		background: #0071b9;
		z-index: 10;
	}
	.un-cont-list li .img .txt{
		width: 100%;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 5% auto 0 auto;
	}
	.un-cont-list li .data{
		width: 100%;
	}
	.un-cont-list li .data .data-in{
		width: 100%;
		display: flex;
		justify-content: flex-start;
		position: sticky;
		top: 10%;
		padding: 0% 0 5% 0%;
	}
	.un-cont-list li .data .data-in .num{
		width: max-content;
		font-family: "avenir-lt-pro", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.3em;
        letter-spacing: .1em;
        line-height: 1.8em;
		margin: 0 20px 0 0;
	}
	.un-cont-list li .data .data-in .title{
		width: max-content;
		font-size: 1.2em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
	}
	.un-cont-list li .data .data-in .title span{
        letter-spacing: .1em;
	}
	.un-f-img {
		width: 100%;
		height: 31vh;
		margin: 0 auto 15% auto;
		overflow: hidden;
		background: #f8f8f7;
	}

	/* un-f-nav */
	.un-f-nav{
		width: 90%;
		margin: 0 auto 15% auto;
		position: relative;
		z-index: 10;
	}
	.un-f-nav-list{
		width: 100%;
		display: flex;
		justify-content: flex-start;
	}
	.un-f-nav-list li{
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
	}
	.un-f-nav-list li:nth-child(2){
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #0071b9;
		border-right: 1px solid #0071b9;
	}
	.un-f-nav-list a{
		width: 100%;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.un-f-nav-list a .img{
		width: 80%;
		margin: 0 auto;
		transform: scale(1);
		transition: .5s;
	}
	.un-f-nav-list a:hover .img{
		transform: scale(1.3);
		transition: .5s;
	}
	.un-f-nav-list a .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
		transform: scale(1.05);
		transition: 1s;
	}
	.un-f-nav-list a:hover .img-on{
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		opacity: 1;
		transform: scale(1);
		transition: 1s;
	}
	.un-f-nav-list a .title{
		width: 100%;
		text-align: center;
		font-family: "source-han-sans-cjk-ja", sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: .8em;
		letter-spacing: .1em;
        color: var(--color-text);
		margin: 7% auto 0 auto;
	}
	.un-f-nav-list a .num{
		width: 13%;
		position: relative;
		left: 15%;
		margin: 0 0 7% 0;
		line-height: 0;
	}

	/* civil_works --------------------------------------------------------*/
	.fix-img-civi{
		width: 100%;
		background: url(../img/civil00_01-sp.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* constr_uction --------------------------------------------------------*/
	.fix-img-constr{
		width: 100%;
		background: url(../img/constr00_01-sp.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* surveying_work --------------------------------------------------------*/
	.fix-img-surveying{
		width: 100%;
		background: url(../img/surveying00_01-sp.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}
	
	/* other_duties --------------------------------------------------------*/
	.fix-img-other{
		width: 100%;
		background: url(../img/other00_01-sp.jpg) no-repeat;
		background-size: cover;
		background-position: center center;
	}

	/* message-box --------------------------------------------------------*/
	.message-box{
		width: 100%;
		margin: 30% auto 15% auto;
	}
	.message-box .title-box{
		width: 85%;
		margin: 0 auto 10% auto;
	}
	.message-box .title-in{
		width: 100%;
		position: relative;
	}
	.message-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1em;
        letter-spacing: .1em;
        line-height: 1em;
        margin: 0 0 3% 0;
	}
	.message-box .title-in .sub-title{
		font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.message-box .data-box{
		width: 100%;
	}
	.message-box .data-box .img{
		width: 100%;
		margin: 0 0 7% 0;
	}
	.message-box .data-box .name{
		width: 85%;
        color: var(--color-text);
		font-size: .7em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 auto 5% auto;
	}
	.message-box .data-box .name span{
		width: 100%;
        color: var(--color-text);
		font-size: 2em;
        letter-spacing: .2em;
        line-height: 2.5em;
		margin: 0 0 0 20px;
	}
	.message-box .data-box .txt{
		width: 85%;
        color: var(--color-text);
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 0 auto;
	}

	/* message-box --------------------------------------------------------*/
	.company-box{
		width: 85%;
		margin: 0% auto 20% auto;
	}
	.company-box .title-box{
		width: 100%;
		margin: 0 0 10% 0;
	}
	.company-box .title-in{
		width: 100%;
		position: relative;
	}
	.company-box .title-in .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1em;
        letter-spacing: .1em;
        line-height: 1em;
        margin: 0 0 3% 0;
	}
	.company-box .title-in .sub-title{
		font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        color: var(--color-text);
		white-space: nowrap;
	}
	.company-box .data-box{
		width: 100%;
	}
	.company-list{
		width: 100%;
	}
	.company-list li{
		width: 100%;
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		margin: 0 0 5% 0;
		padding: 0 0 5% 0;
	}
	.company-list li:last-child{
		margin: 0 0 0% 0;
		border-bottom: none;
	}
	.company-list li .logo{
		width: 70%;
		line-height: 0;
		margin: 5% 0 0 0;
	}
	.company-list li .title{
		width: 30%;
		color: var(--color-text);
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.company-list li .data{
		width: 65%;
		color: var(--color-text);
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.company-list li .data a{
		color: var(--color-text);
	}
	/* map-box */
	.map-box{
		width: 100%;
		margin: 0 auto 0% auto;
		position: relative;
		z-index: 10;
	}
	.map-box .title-box {
        width: 100%;
        margin: 0 auto 10% auto;
    }
	.map-box .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1em;
        letter-spacing: .1em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 3% auto;
    }
	.map-box .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 4% auto;
        position: relative;
        left: .1%;
    }
	.map-box .title-box .icon {
        width: 12px;
        line-height: 0;
        display: block;
        margin: 0 auto;
    }
	.map {
		position: relative;
		width: 100%;
		padding-top: 80%;
		height: 0;
	}
	.map iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	/* works --------------------------------------------------------*/
	.works{
		width: 100%;
		position: relative;
		z-index: 10;
		margin: 30% auto 0 auto;
		background: #f8f8f7;
	}
	.works-bg{
		width: 100%;
		height: 80px;
		position: relative;
		z-index: 8;
		background: linear-gradient(to bottom, #f8f8f7 0%, rgba(248, 248, 247, 0.7) 30%, rgba(248, 248, 247, 0.3) 70%, transparent 100%);
	}
	.works .title-box {
        width: 100%;
        margin: 0 auto 15% auto;
    }
	.works .title-box .title {
        font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 3% auto;
    }
	.works .title-box .sub-title {
        width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 4% auto;
        position: relative;
        left: .1%;
    }
	.works .title-box .icon {
        width: 12px;
        line-height: 0;
        display: block;
        margin: 0 auto;
    }
	.filter-buttons {
		width: 90%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		margin: 0 auto 5% auto;
	}
	.filter-btn {
		width: 48%;
		padding: 2px 5px;
		border: 1px solid #0071b9;
		text-align: center;
		font-size: .7em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		cursor: pointer;
		transition: all 0.3s ease;
        color: var(--color-text);
		background: #f8f8f7;
		margin: 0 0 3% 0;
	}
	.filter-btn:hover {
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.filter-btn.active {
		background-color: #0071b9;
		border-color: #0071b9;
		color: #fff;
	}
	.items-grid {
		width: 90%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 3%;
		list-style: none;
		margin: 0 auto 35% auto;
	}
	.item a{
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		transition: all 0.3s ease;
		animation: fadeIn 0.4s ease;
	}
	.item.hidden {
		display: none;
	}
	@keyframes fadeIn {
		from {
			opacity: 0;
			transform: translateY(10px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}
	.item-img{
		width: 100%;
		overflow: hidden;
		margin: 0 0 20px 0;
	}
	.item-category {
		width: 55%;
        color: var(--color-text);
		border: 1px solid #0071b9;
		box-sizing: border-box;
		text-align: center;
		font-size: .6em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 5px 0 5px 0;
		margin: 0 0 5px 0;
	}
	.item-day {
		width: 40%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: left;
		font-size: .6em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-description {
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.item-id {
		font-size: 12px;
		color: #999;
	}
	.no-results {
		text-align: center;
		color: #999;
		padding: 40px 20px;
		font-size: 16px;
	}

	/* works-un */
	.works-un{
		width: 85%;
		margin: 30% auto 0 auto;
		position: relative;
		z-index: 10;
		background: #f8f8f7;
	}
	.works-un .data{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list{
		width: 100%;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		color: var(--color-text);
	}
	.works-un .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li:nth-child(3){
		width: 45%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li:nth-child(4){
		width: 45%;
		margin: 0 0 5% 0;
	}
	.works-un .data .data-list li .title{
		width: 100%;
		border-bottom: 1px solid rgba(0, 91, 170, .2);
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 600;
font-style: normal;
		white-space: nowrap;
		margin: 0 0 3% 0;
	}
	.works-un .data .data-list li .txt{
		width: 100%;
		font-size: .7em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.works-un .data .data-list li:nth-child(1){
		width: 100%;
		border: 1px solid #0071b9;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		padding: 0 0 0 5%;
		margin: 0 0 3% 0;
		box-sizing: border-box;
	}
	.works-un .data .data-list li:nth-child(2){
		width: 100%;
        font-size: 1em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
		margin: 0 0 5% 0;
	}
	.works-un .cont{
		width: 100%;
	}
	.works-un .cont .main-list{
		width: 100%;
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 5%;
		margin: 0 auto 15% auto;
	}
	.works-un .cont .main-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .main-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 10% 0;
	}
	.works-un .cont .txt br{
		display: none;
	}
	.works-un .cont .sub-list{
		width: 100%;
		margin: 0 auto 20% auto;
	}
	.works-un .cont .sub-list li{
		width: 100%;
		margin: 0 auto 10% auto;
	}
	.works-un .cont .sub-list li .img-in{
		width: 100%;
		overflow: hidden;
		position: relative;
		margin: 0 0 5% 0;
	}
	.works-un .cont .sub-list li .txt{
		width: 100%;
		color: var(--color-text);
		box-sizing: border-box;
		text-align: justify;
		font-size: .7em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 !important;
	}
	.works-un .cont .bottom-btn{
		width: max-content;
		margin: 0 0 0% auto;
	}
	.works-un .cont .bottom-btn a{
		color: var(--color-text);
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		font-size: .8em;
		letter-spacing: .1em;
		display: block;
		overflow: hidden;
		color: transparent;
		text-shadow: 0 -1.5em 0 #0071b9, 0 0 0 #0071b9;
		transition: text-shadow 0.4s cubic-bezier(0.76, 0, 0.24, 1);
	}
	.works-un .cont .bottom-btn a:hover {
		text-shadow: 0 0 0 #0071b9, 0 1.5em 0 #0071b9;
	}
	.works-un .cont .bottom-btn a .line{
		width: 100%;
		height: 1px;
		display: block;
		background: #0071b9;
	}

	/* CONTACT --------------------------------------------------------*/
	.contact_title{
		width: 100%;
		margin: 30% auto 15% auto;
	}
	.contact_title .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1em;
        letter-spacing: .1em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 3% auto;
	}
	.contact_title .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto;
        position: relative;
        left: .1%;
	}

	/* FORM ------------------------ */
	#formWrap{
		width: 80%;
		margin: 0% auto 15% auto;
		box-sizing: border-box;
	}
	#formWrap .main-title{
		width: 100%;
        font-size: 21px;
        letter-spacing: 4px;
        text-align: center;
        line-height: 2.5em;
        font-weight: 600;
        margin: 0 auto 10% auto;
		border-bottom: 1px solid #0071b9;
	}
	.form-row{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.form-label-txt{
		font-size: .8em;
		letter-spacing: .1em;
        line-height: 2.5em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		margin: 0 0 10px 0;
		display: block;
		color: #0071b9;
	}
	.input-txt{
		width: 100%;
		line-height: 3em;
		box-sizing: border-box;
		padding: 0 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	.select-txt{
		width: 100%;
		padding: 15px 10px 15px 20px;
		border-radius: 5px;
		border: 1px solid #0071b9;
		color: #0071b9;
		letter-spacing: .1em;
        line-height: 1em;
		font-size: .7em;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
		font-size: .8em;
	}
	.input-sub{
		font-size: 9px;
		letter-spacing: 1px;
		margin: 0 0 0 10px;
		display: inline-block;
		white-space: nowrap;
		background: #0071b9;
		color: #fff;
		line-height: 1em;
		padding: 5px 10px;
		border-radius: 3px;
		position: relative;
		top: -1px;
	}
	textarea{
		width: 100%;
		min-height: 200px;
		box-sizing: border-box;
		padding: 10px 10px;
		border-radius: 5px;
		border: 1px solid #0071b9;
	}
	select {
		padding: 10px 35px 10px 10px;
		background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005baa' stroke-width='2'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
		background-repeat: no-repeat;
		background-position: right 10px center;
		background-size: 20px;
		appearance: none;
		-webkit-appearance: none;
		-moz-appearance: none;
		cursor: pointer;
	}

	/* Firefoxの矢印を非表示 */
	select::-moz-appearance {
		appearance: none;
	}
	.submit-link{
		width: 45%;
		font-size: .8em;
        letter-spacing: .1em;
		display: inline-block;
		background: #0071b9;
		color: #fff;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link:hover{
		background: #fff;
		color: #0071b9;
		transition: .3s;
	}
	.submit-link02{
		width: 45%;
		font-size: .8em;
        letter-spacing: .1em;
		display: inline-block;
		background: #fff;
		color: #0071b9;
		border: none;
		padding: 1.5% 0;
		border: 1px solid #0071b9;
		transition: .3s;
		border-radius: 5px;
		font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.submit-link02:hover{
		background: #0071b9;
		color: #fff;
		transition: .3s;
	}
	.form-row-btn{
		display: block;
		font-size: 12px;
		letter-spacing: 2px;
		margin: 15px 0 0 0;
	}
	.honey-pot {
		display: none !important;
		visibility: hidden !important;
	}

	/* RECRUIT --------------------------------------------------------*/
	.recruit-box{
		width: 100%;
		position: relative;
		margin: 0 auto 15% auto;
	}
	.recruit-box .title{
		width: 55%;
        position: absolute;
        top: 37%;
        left: 10%;
        line-height: 0;
		overflow: hidden;
	}
	.recruit-box .txt{
		width: 80%;
		position: absolute;
		bottom: 5%;
		right: 0;
		left: 0;
		margin: 0 auto;
		color: #fff;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_top{
		width: 100%;
        margin: 0 auto 10% auto;
	}
	.recruit_top .title{
		font-family: "din-2014", sans-serif;
        font-weight: 600;
        font-style: normal;
        color: var(--color-text);
        font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        text-align: center;
        margin: 0 auto 3% auto;
	}
	.recruit_top .sub-title{
		width: max-content;
        text-align: center;
        color: var(--color-text);
        font-size: 1.3em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        margin: 0 auto 4% auto;
        position: relative;
        left: .1%;
	}
	.recruit_top .icon{
		width: 12px;
        line-height: 0;
        display: block;
        margin: 0 auto 15% auto;
        animation: arrowBounce 2s infinite;
	}
	.recruit_top .top-link{
		width: 80%;
		margin: 0 auto;
	}
	.recruit_top .top-link li{
		width: 100%;
	}
	.recruit_top .top-link li:nth-child(2){
		width: 100%;
		margin: 5% 0;
	}
	.recruit_top .top-link li a{
		width: 100%;
		display: block;
		font-size: 1em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		padding: 0 10px;
		box-sizing: border-box;
		text-align: center;
		color: #0071b9;
		transition: .3s;
	}
	.recruit_top .top-link li a:hover{
		color: #fff;
		background: #0071b9;
		transition: .3s;
	}
	.recruit_01{
		width: 80%;
		margin: 0 auto 15% auto;
	}
	.recruit_01_list{
		width: 100%;
	}
	.recruit_01_list li:first-child{
		width: 100%;
		border-top: 1px solid #b2cee5;
		border-bottom: 1px solid #b2cee5;
	}
	.recruit_01_list li{
		width: 100%;
		border-bottom: 1px solid #b2cee5;
		color: var(--color-text);
		padding: 10% 0 5% 0;
	}
	.recruit_01_list li .title-box{
		width: 100%;
	}
	.recruit_01_list li .title-box .title-in {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        padding: 0% 0 5% 0;
    }
	.recruit_01_list li .title-box .title-in .num {
        width: max-content;
        font-family: "avenir-lt-pro", sans-serif;
        font-weight: 400;
        font-style: normal;
        font-size: 1.3em;
        letter-spacing: .1em;
        line-height: 1.8em;
        margin: 0 20px 0 0;
    }
	.recruit_01_list li .title-box .title-in .title {
        width: max-content;
        font-size: 1.2em;
        letter-spacing: .1em;
        line-height: 1.8em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 600;
		font-style: normal;
    }
	.recruit_01_list li .data{
		width: 100%;
		padding: 1% 0 0 0;
	}
	.recruit_01_list li .data .txt{
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        text-align: justify;
		margin: 0 0 7% 0;
	}
	.recruit_01_list li .data .sub-title{
		width: max-content;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border: 1px solid #0071b9;
		border-radius: 100px;
		box-sizing: border-box;
		padding: 0 20px;
		margin: 0 0 4% 0;
	}
	.recruit_01_list li .data .list-txt{
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		margin: 0 0 5% 0;
		text-indent: -1.3em;
		padding-left:1.3em;
	}

	.recruit_02{
		width: 80%;
		margin: 0 auto 20% auto;
		color: var(--color-text);
	}
	.recruit_02 .title-box{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.recruit_02 .title-box .title-in {
        width: 100%;
    }
	.recruit_02 .title-box .title-in .title {
        font-size: 1em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "source-han-sans-cjk-ja", sans-serif;
        font-weight: 700;
        font-style: normal;
        white-space: nowrap;
		margin: 0 0 10% 0;
    }
	.recruit_02 .title-box .title-in .img-in {
		width: 100%;
		margin: 0 0 5% 0;
    }
	.recruit_02 .title-box .title-in .txt {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list {
        font-size: .9em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .title-box .title-in .sub-list .cou{
        font-size: .7em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
    }
	.recruit_02 .data{
		width: 100%;
	}
	.recruit_02 .data .data-list{
		width: 100%;
	}
	.recruit_02 .data .data-list li{
		width: 100%;
		margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li:last-child{
		width: 100%;
		margin: 0;
	}
	.recruit_02 .data .data-list li .title{
		width: 100%;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 3em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		border-bottom: 1px solid #b2cee5;
		margin: 0 0 2% 0;
	}
	.recruit_02 .data .data-list li .txt{
		width: 100%;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
	}
	.recruit_02 .data .data-list li .txt span{
		width: 100%;
		font-size: .7em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
	}
	.recruit_02 .data .data-list li .main-title{
		width: 100%;
		background: #0071b9;
		color: #fff;
		font-size: .8em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		box-sizing: border-box;
		padding: 0 0 0 20px;
		margin: 10% 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: end;
	}
	.recruit_02 .data .data-list li .end-box .end-box01{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .end-title{
		width: max-content;
        font-size: .7em;
        letter-spacing: .2em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border: 1px solid #0071b9;
        border-radius: 100px;
        box-sizing: border-box;
        padding: 0 20px;
        margin: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: .8em;
        letter-spacing: .1em;
        line-height: 2.5em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        font-weight: 500;
        font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box01 .yen span{
		width: max-content;
        letter-spacing: 0em;
	}
	.recruit_02 .data .data-list li .end-box .end-box02{
		width: 45%;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt01{
		width: 100%;
        font-size: .7em;
        letter-spacing: .1em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
        border-bottom: 1px solid #b2cee5;
        margin: 0 0 5% 0;
		padding: 0 0 5% 0;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02{
		width: 100%;
		font-size: .7em;
        letter-spacing: .2em;
        line-height: 2.2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
	}
	.recruit_02 .data .data-list li .end-box .end-box02 .end-txt02 span{
		width: max-content;
		font-size: 1.5em;
        letter-spacing: 0em;
		line-height: 2em;
		display: block;
	}
	.recruit_02 .data .data-list li .cou{
		font-size: .7em;
        letter-spacing: .1em;
        line-height: 2em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
		font-weight: 500;
		font-style: normal;
		text-align: justify;
		margin: 5% 0 0 0;
	}

	.recruit-btn{
		width: 80%;
		display: block;
		position: relative;
		margin: 0 auto 20% auto;
		border: 1px solid #0071b9;
		font-size: .9em;
        letter-spacing: .2em;
        line-height: 1em;
        font-family: "dnp-shuei-gothic-kin-std", sans-serif;
        color: var(--color-text);
		text-align: center;
		padding: 7% 0;
		background: #fff;
	}
	.recruit-btn .hover-bg{
		width: 0%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		transition: .3s;
		background-image: radial-gradient(circle, #0071b9 30%, transparent 30%);
		background-size: 3px 3px;
		background-position: 0 0;
		opacity: .5;
	}
	.recruit-btn:hover .hover-bg{
		width: 100%;
		transition: .3s;
	}

}