@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');


:root {
	--white-1 : #ffffff;
	--white-2 : #f9f9f9;
	--white-3 : linear-gradient(90deg, #f5f0e9, #ffffff);
	--black-1 : #111;
	--black-2 : #62696e;
	--gray-1 : #788085;
	--gray-2 : #d9d9d9;
	--gray-3 : #eeebe5;
	--green-1 :#005243;
	--green-2 :linear-gradient(50deg, rgba(15,40,35,1) 0%, rgba(0,82,67,1) 75%);
	--red-1 : #c33;
	--font-gothic : "Noto Sans JP",sans-serif;
	--font-mincho : "Noto Serif JP",serif;
	--font-size-l : 16px;
	--font-size-m : 13px;
	--font-size-s : 12px;
	--width: 1040px;
}

/* reset */
/* -------------------------------------------------------------------------------- */
* {
	
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,textarea,p,blockquote,th,td{
	margin:0;
	padding:0;
}

html{
/*	contain: paint;*/
	overflow-x:hidden;
	scroll-behavior: smooth;
}
body{
	font-family: var(--font-gothic);
	font-weight: 400;
}

h1,h2,h3,h4,h5,h6{
	font-size:100%;
}

*html th,
*html td{
	font-size:1em;
	line-height:1.5;
}

table{
	border-collapse:collapse;
	border-spacing:0;
}

fieldset,img{
	border:0;
}
img{
	width:100%;
	height:auto;
	border-radius:3px;
}

	@media screen and (min-width:768px){
		.pc-hidden{
			display:none;
		}
	}
	@media screen and (max-width:767px){
		.sp-hidden{
			display:none;
		}
	}


/* display none */
/* -------------------------------------------------------------------------------- */



/* common */
/* -------------------------------------------------------------------------------- */

/* common layout */
/* ---------------------------------------- */

body{
	font-size:var(--font-size-m);
	line-height:1.75em;
	color:#666;
	background:var(--white-1);
	overflow-x:hidden;
}

.borderA{
	border-bottom:1px dotted #CCCCCC;
	margin-bottom:25px;
	padding-bottom:25px;
}

.borderB{
	border-bottom:1px dotted #CCCCCC;
	margin-bottom:25px;
	padding-bottom:15px;
}

.textArea01{
	padding:15px 15px;
	background:#F9EEEE;
	text-align:center;
	font-weight:bold;
	color:#F00;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	-ms-border-radius:4px;
}

.textArea02{
	padding:10px 15px;
	background:#F9EEEE;
	text-align:center;
	font-weight:bold;
	color:#F00;
	border-radius:4px;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	-ms-border-radius:4px;
}

/* header */
/* ---------------------------------------- */
header{
	width:100%;
	height:100px;
}
header.index{
	position:absolute;
	z-index:10;
}
.header-wrapper{
	width:var(--width);
	height:100%;
	margin:0 auto;
	display:flex;
	align-items:center;
	justify-content:space-between;
}
.header-wrapper .title-1,
.header-wrapper .title-2{
	display:flex;
	align-items:flex-end;
	gap:35px;
}
.header-wrapper .title-1 a,
.header-wrapper .title-2 a{
	font-size:20px;
	font-weight:bold;
	letter-spacing:1px;
	text-decoration:none;
}
.header-wrapper .title-1 a{
	color:var(--white-1);
	text-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.header-wrapper .title-1 .logo,
.header-wrapper .title-2 .logo{
	width:194px;
	height:62px;
}
.header-wrapper .title-1 .logo a img,
.header-wrapper .title-2 .logo a img{
	width:100%;
	height:auto;
}
.header-wrapper .title-1 .logo a img{
	filter: drop-shadow(0 0 5px rgba(0,0,0,0.5));
}

.header-wrapper .nav{
	width:auto;
	height:62px;
}

.nav{
	display:flex;
	flex-direction:column;
}

.nav-1 ul{
	margin-top:20px;
	display:flex;
	gap:0;
	justify-content:flex-end;
}
.nav-1 ul li{
	list-style:none;
	font-size:var(--font-size-m);
	font-weight:bold;
	letter-spacing:1px;
}
.nav-1 ul li a{
	padding:5px 15px;
	border-left: 1px solid var(--gray-2);
	text-decoration:none;
	transition:0.5s;
}
.nav-1 ul li:last-child a{
	border-right: 1px solid var(--gray-2);
}
.nav-1 ul li a:hover{
	opacity:0.5;
}
.nav-2 ul{
	display:flex;
	gap:35px;
	justify-content:flex-end;
}
.nav-2 ul li{
	list-style:none;
	font-size:var(--font-size-m);
}
.nav-2 ul li a{
	text-decoration:none;
	position:relative;
	transition:0.5s;
}
.nav-2 ul li a::before{
	content:"";
	display:block;
	width:2px;
	height:2px;
	margin: auto;
	border-top: 1px solid var(--black-1);
	border-left: 1px solid var(--black-1);
	position:absolute;
	top:0;
	bottom:0;
	left:-10px;
	rotate:135deg;
}
.nav-2 ul li a:hover{
	opacity:0.5;
}


#menu {
    width: 100%;
    height: 100%;
    background: var(--black-1);
    opacity: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    visibility: hidden;
    transition: all 0.7s ease-in-out;
    z-index: 99;
}
#menu.open {
    opacity: 1;
    visibility: visible;
}
#menu .main-nav {
	width:calc(100% - 100px);
	height:80vh;
	margin: 10vh auto;
	display:flex;
	gap: 15px 50px;
	justify-content:center;
}
#menu .main-nav .heading{
	margin:0 0 5px 0;
	border-bottom: 1px solid var(--gray-1);
	color:var(--white-1);
	font-size:var(--font-size-m);
	font-weight:bold;
	text-align:left;
}
#menu .main-nav ul {
	margin:0 0 35px 15px;
	padding: 0;
}
#menu .main-nav ul li{
	list-style: none;
	position:relative;
}
#menu .main-nav ul li::before{
	width:6px;
	height:6px;
	content:"";
	display:block;
	margin:auto;
	background:var(--gray-2);
	border-radius:100vh;
	position:absolute;
	top:2px;
	bottom:0;
	left:5px;
}
#menu .main-nav a {
	padding: 5px 25px;
	color: var(--white-1);
	font-size:var(--font-size-m);
	font-weight: bold;
	display:inline-block;
	text-decoration:none;
}

.toggle-menu {
    width: 50px;
    height: 50px;
	margin-right:10px;
    padding: 0;
	background:transparent;
	border:none;
    cursor: pointer;
    position: relative;
	z-index:100;
}
.toggle-menu span {
    width: 26px;
    height: 2px;
    content: "";
    display: block;
    background: var(--gray-1);
    position: absolute;
    top: calc(50% - 1px);
    left: calc(50% - 13px);
	transition:0.5s;
}
.toggle-menu span:before,
.toggle-menu span:after {
    width: 26px;
    height: 2px;
    content: "";
    display: block;
    background: var(--gray-1);
	transition:0.5s;
}
.toggle-menu span:before {
    position: absolute;
    top: 7px;
}
.toggle-menu span:after {
    position: absolute;
    top: -7px;
}
.toggle-menu.active span {
    background: transparent;
}
.toggle-menu.active span:before {
    background: var(--white-1);
    top: 0;
    transform: rotate3d(0, 0, 1, -45deg);
}
.toggle-menu.active span:after {
    background: var(--white-1);
    top: 0;
    transform: rotate3d(0, 0, 1, 45deg);
}
header.index .toggle-menu span,
header.index .toggle-menu span:before,
header.index .toggle-menu span:after {
    background: var(--white-1);
}
header.index .toggle-menu.active span {
    background: transparent;
}

	@media screen and (min-width:768px) and (max-width: 1039px){
		.header-wrapper{
			width:calc(100% - 10%);
			padding:0 5%;
		}
		#menu .main-nav{
			flex-direction:column;
		}
		#menu .main-nav a {
			font-size:var(--font-size-l);
			padding: 10px 25px;
		}
	}

	@media screen and (max-width:767px){
		header{
			height:70px;
		}
		.header-wrapper{
			width:100%;
		}
		.header-wrapper .title-1,
		.header-wrapper .title-2{
			margin-left:20px;
			gap:15px;
		}
		.header-wrapper .title-1 a,
		.header-wrapper .title-2 a{
			font-size:var(--font-size-l);
		}
		.header-wrapper .title-1 .logo,
		.header-wrapper .title-2 .logo{
			width:110px;
			height:auto;
			position:relative;
			top:5px;
		}
		.header-wrapper .nav{
			display:none;
		}
		#menu .main-nav{
			flex-direction:column;
		}

	}

/* btn */
/* -------------------------------------------------------------------------------- */

.button-1{
	margin: auto;
	padding:15px 55px 15px 50px;
	border: 1px solid var(--black-1);
	border-radius:100vh;
	display:inline-block;
	font-size:18px;
	position:relative;
	transition:.5s;
}
.button-1:hover{
	background: var(--black-1);
	color:var(--white-1);
}
.button-1.white{
	border: 1px solid var(--white-1);
	color:var(--white-1);
}
.button-1.white:hover{
	background: var(--white-1);
	color:var(--black-1);
}


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

footer{
	width:100%;
	padding:50px 0 15px 0;
	background:var(--black-2);
	font-size:var(--font-size-m);
	color:var(--white-1);
}
.footer-wrapper{
	width:var(--width);
	margin:0 auto;
}
.footer-logo{
	width:160px;
	height:100px;
}
.footer-nav-wrapper{
	width:calc(100% - 25px);
	padding-left:25px;
	display:flex;
	flex-wrap:wrap;
	gap:25px;
}
.footer-nav-1{
	width:calc( (100% - 50px) / 3);
}
.footer-nav-1 ul{
	margin-left:25px;
}
.footer-nav-1 ul a{
	color:var(--white-1);
	text-decoration:none;
	transition:0.5s;
	position:relative;
}
.footer-nav-1 ul a::before{
	content:"";
	display:block;
	width:0;
	height:1px;
	background:var(--white-1);
	position:absolute;
	bottom:-1px;
	transition:0.5s;
}
.footer-nav-1 a:hover::before{
	width:100%;
}

#copyright{
	margin:50px auto 0;
	font-size:var(--font-size-s);
	text-align:center;
}

	@media screen and (min-width:768px) and (max-width: 1039px){
		.footer-wrapper{
			width:calc(100% - 10%);
			padding:5%;
		}
	}
	@media screen and (max-width:767px){
		footer{
			padding:15px 0;
		}
		.footer-wrapper{
			width:calc(100% - 50px);
			padding: 25px;
		}
		#copyright{
			margin:0 auto;
		}
	}

/* contents */
/* ---------------------------------------- */

#contentsArea-1{
	width:100%;
}
#contentsArea-1 .content-wrap-1{
	width:var(--width);
	margin:0 auto;
}
#contentsAreaB{
	padding-top:15px;
}


section.section-wrapper{
	width:100%;
}
section.section-wrapper .section-inner-0{
	width:100%;
	margin:0 auto;
	padding: 0;
}
section.section-wrapper .section-inner-1{
	width:var(--width);
	margin:0 auto;
	padding: 50px 0;
}
section.section-wrapper .section-inner-2{
	width:var(--width);
	margin:0 auto;
	padding: 0;
}
	@media screen and (min-width:768px) and (max-width: 1039px){
		section.section-wrapper .section-inner-1,
		section.section-wrapper .section-inner-2{
			width:calc(100% - 10%);
			padding-left:5%;
			padding-right:5%;
		}
	}
	@media screen and (max-width:767px){
		section.section-wrapper .section-inner-1{
			width:calc(100% - 50px);
			padding: 25px;
		}
		section.section-wrapper .section-inner-2{
			width:100%;
		}
	}



/* pnavi */
.pnavi{
	width:100%;
	margin:15px 0;
	font-size:var(--font-size-m);
	line-height:1;
	text-align:right;
}
.pnavi ul{
	margin-left:-4px;
}
.pnavi ul li{
	list-style:none;
	display:inline;
}
.pnavi ul li:after{
	content:" ";
}
.pnavi a{
	padding-left:5px;
	padding-right:13px;
	background:url(../img/arrow_pnavi01.gif) no-repeat right center;
	text-decoration:none;
	color:#666;
}
.pnavi a:hover{
	text-decoration:underline;
	color:#999;
}
.pnavi a:visited{
	text-decoration:none;
}
.pnavi a.current{
	padding-left:5px;
	padding-right:0;
	background:none;
}
	@media screen and (max-width:767px){
		.pnavi{
			display:none;
		}

	}

/* layout */
/* ---------------------------------------- */

.align-c{
	text-align:center;
}
.align-r{
	text-align:right;
}



/* text */
/* ---------------------------------------- */
.Mincho{
	font-family: var(--font-mincho);
	font-weight:300;
}

.heading-1{
	margin:0;
	color:#788085;
	font-size:40px;
	font-weight:bold;
	line-height:140%;
}
.heading-2{
	margin:0;
	color:#788085;
	font-family: var(--font-mincho);
	font-size:32px;
	font-weight:300;
	line-height:140%;
	position:relative;
	z-index:5;
}
.heading-3{
	margin:0;
	padding:15px 15px 15px 20px;
	background:var(--black-1);
	border-radius: 3px;
	color:var(--white-1);
	font-family: var(--font-mincho);
	font-size:24px;
	font-weight:300;
	line-height:140%;
}
.heading-4{
	margin:0;
	padding:8px 0 8px 15px;
	border-left:5px solid var(--gray-2);
	color:var(--gray-1);
	font-size:20px;
	font-weight:bold;
	line-height:140%;
}
.heading-5{
	margin:0;
	padding:3px 15px;
	background: var(--white-1);
	border:1px solid var(--gray-2);
	border-radius:5px;
	display:inline-block;
	font-size:16px;
	font-weight:bold;
	line-height:140%;
}
.heading-5.red-1{
	border:1px solid var(--red-1);
	color:var(--red-1);
}
.heading-6{
	margin:0;
	padding: 0 0 0 10px;
	border-left:2px solid;
	font-size:14px;
	font-weight:bold;
	line-height:130%;
}


.red-1{	color:var(--red-1);}


.list-note-1{
	list-style:none;
}
.list-note-1 li{
	margin: 0 0 0 1.0em;
	position:relative;
}
.list-note-1 li::before{
	content:"※";
	display:block;
	position:absolute;
	top:0;
	left:-1.1em;
}


/* table */
/* ---------------------------------------- */
.table-1{
	width:auto;
}
.table-1 th,
.table-1 td{
	padding:5px;
	border:none;
}
.table-1 tr{
	border-bottom:1px solid var(--gray-2);
}
.table-1 tr:last-child{
	border:none;
}

/* tab */
/* ---------------------------------------- */
.tab-menu-section{
	width:100%;
	border-bottom: 2px solid var(--black-1);
}

.tab-menu{
	width:var(--width);
	display:flex;
	flex: 1;
	justify-content:center;
}
.tab-menu li{
	min-width: 70px;
	margin:0;
	list-style: none;
}
.tab-menu li a{
	padding: 10px 30px;
	border-right: 2px solid var(--white-1);
	background-color: var(--gray-3);
	color: var(--gray-1);
	display:block;
	font-weight:bold;
	text-align: center;
	text-decoration:none;
	transition:0.5s;
}
.tab-menu li a:hover{
	background-color: var(--black-1);
	color: var(--white-1);
}
.tab-menu li.is-active a {
	background: var(--black-1);
	color: var(--white-1);
}

.tab-content-section .tab {
  display: none;
}
.tab-content-section .tab.is-active {
  display: block;
}

	@media screen and (max-width:1039px){
		.tab-menu{
			width:100%;
			flex-wrap:wrap;
			gap:2px 0;
		}
		.tab-menu li{
			min-width:70px;
			flex:1;
		}
		.tab-menu li a{
			padding: 10px 0;
		}
	}


/* index */
/* ---------------------------------------- */

/* slick */
.title-image-1{
	width:100%;
	height:80vh;
	overflow:hidden;
	margin:0 auto;
	position:relative;
}
.add-animation {
  animation: zoomUp 10s linear 0s normal both;
}
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15); /* 拡大率 */
  }
}
.title-image-1 .tagline{
	width:95%;
	margin:0 auto;
	position:absolute;
	top:50%;
	left:0;
	transform:translateY(-50%);
}
.title-image-1 .tagline h1{
	width:var(--width);
	margin:0 auto;
}
.title-image-1 .tagline h1 span{
	padding: 0 5px;
	background:var(--white-1);
	color:var(--black-1);
	font-family: var(--font-mincho);
	font-size:40px;
	font-weight:400;
}
.slick-slide{
	height:80vh;
}
.slick-slider .slick-slide img{
	height:100%;
	object-fit:cover;
}

	@media screen and (max-width:767px){
		.title-image-1,
		.slick-slide{
			height:70vh;
		}
	}

.title-image-2{
	width:100%;
	height:50vh;
	overflow:hidden;
	margin:0 auto;
	position:relative;
}
.title-image-2 .photo{
	width:100%;
	height:100%;
	overflow:hidden;
}
.title-image-2 .photo img{
	object-fit:cover;
}
.title-image-2 .tagline{
	width:100%;
	margin:0 auto;
	position:absolute;
	top:50%;
	left:0;
	transform:translateY(-50%);
}
.title-image-2 .tagline h1{
	width:var(--width);
	margin:0 auto;
}
.title-image-2 .tagline h1{
	padding: 0;
	color:var(--white-1);
	font-family: var(--font-mincho);
	font-size:48px;
	font-weight:300;
	text-shadow:0 0 15px rgba(0,0,0,0.5);
}
.title-image-2 .tagline h1 span{
	margin-left:15px;
	font-size:24px;
	letter-spacing:2px;
}
.title-image-2 .title{
	width:100%;
	margin:0 auto;
	color:var(--white-1);
	position:absolute;
	top:45%;
	left:0;
	letter-spacing:2px;
	transform:translateY(-50%);
	text-shadow:0 0 15px rgba(0,0,0,0.5);
}
.title-image-2 + .sub{
	width:var(--width);
	margin:-50px auto 50px;
	background:var(--black-1);
	color:var(--white-1);
	position:relative;
	z-index:5;
}
.title-image-2 + .sub .sub-inner{
	padding:50px;
	display:flex;
	gap:30px;
	align-items:center;
}
.title-image-2 + .sub .sub-inner .sub-title{
	min-width:40%;
	color:var(--white-1);
	font-family: var(--font-mincho);
	font-size:28px;
	font-weight:400;
	line-height:160%;
}
.title-image-2 + .sub .sub-inner .sub-title span{
	margin-left:5px;
	font-size:20px;
	letter-spacing:1px;
}


.title-image-3{
	width:100%;
	height:400px;
	overflow:hidden;
	margin:0 auto 50px;
	position:relative;
}
.title-image-3 img{
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:top center;
}

	@media screen and (min-width:768px) and (max-width: 1039px){
		.title-image-2{
			height:35vh;
		}
		.title-image-2 .tagline h1{
			width:90%;
		}
		.title-image-2 + .sub{
			width:100%;
		}
	}

	@media screen and (max-width:767px){
		.title-image-2{
			height:35vh;
		}
		.title-image-2 .photo img{
			width:120%;
		}
		.title-image-2 .tagline{
			width:100%;
			left:5%;
		}
		.title-image-2 .tagline h1{
			width:100%;
			font-size:28px;
		}
		.title-image-2 .tagline h1 span{
			font-size:16px;
		}

		.title-image-2 + .sub{
			width:100%;

		}
		.title-image-2 + .sub .sub-inner{
			flex-direction:column;
			align-items:flex-start;
		}
		.title-image-2 + .sub .sub-inner .sub-title{
			font-size:20px;
		}
		.title-image-2 + .sub .sub-inner .sub-title span{
			font-size:16px;
		}


		.title-image-3{
			height:40vh;
		}
	}


.history{
	width:100%;
	position:relative;
}
.history .text{
	margin-bottom:50px;
	font-size:13px;
	line-height:300%;
	text-align:center;
}
.history .image-1,
.history .image-2{
	border-radius:5px;
	line-height:1;
	overflow:hidden;
	position:absolute;
}
.history .image-1{
	width:35%;
	top:20%;
	left:-10%;
}
.history .image-2{
	width:25%;
	bottom:10%;
	right:-10%;
}

	@media screen and (max-width:1039px){
		.history .image-1,
		.history .image-2{
			width:100%;
			position:relative;
			top:auto;
			bottom:auto;
			left:auto;
			right:auto;
		}
	}



.button-large-1{
	width:100%;
	position:relative;
	overflow:hidden;
}
.button-large-1 .box-3{
	width:40%;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	background: rgba(0,0,0,0.75);
}
.button-large-1 .box-3 p{
	color:var(--white-1);
}

	@media screen and (max-width:767px){
		.button-large-1{
			min-height:30vh;
		}
		.button-large-1 img{
			object-fit:cover;
		}
		.button-large-1 .box-3{
			width:80%;
		}
	}


.link-box-1{
	width:100%;
}
.link-box-1 .box-cell{
	position:relative;
	flex:1;
}
.link-box-1 .box-cell a .photo{
	line-height:1;
	overflow:hidden;
}
.link-box-1 .box-cell a .photo img{
	filter:blur(3px);
	transition:0.5s;
}
.link-box-1 .box-cell a .photo::before{
	content:"";
	width:100%;
	height:100%;
	background:var(--black-1);
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	transition:0.5s;
	opacity:0.6;
	z-index:10;
}
.link-box-1 .box-cell a:hover .photo img{
	filter:blur(0);
	transform:scale(1.15);
}
.link-box-1 .box-cell a:hover .photo::before{
	opacity:0;
}
.link-box-1 .box-cell .text{
	width:100%;
	color:var(--white-1);
	font-size:24px;
	font-weight:bold;
	line-height:130%;
	position:absolute;
	top:50%;
	left:50%;
	letter-spacing:1px;
	transform:translate(-50%,-50%);
	text-align:center;
	z-index:11;
}
.link-box-1 .box-cell .text span{
	font-size:var(--font-size-m);
}

	@media screen and (max-width:767px){
		.link-box-1{
			flex-wrap:wrap;
		}
		.link-box-1 .box-cell{
			width:100%;
			flex:auto;
		}
		.link-box-1 .box-cell .text{
			font-size:var(--font-size-l);
		}
		.link-box-1 .box-cell .text span{
			font-size:var(--font-size-s);
		}
		.link-box-1 .box-cell a .photo{
			max-height:12vh;
		}
	}

.link-box-2{
	width:100%;
	height:200px;
	margin-top:15px;
	overflow:hidden;
	position:relative;
}
.link-box-2 a .photo{
	line-height:1;
	transition:0.5s;
}
.link-box-2 a .photo img{
	filter:blur(3px);
}
.link-box-2 a .photo::before{
	content:"";
	width:100%;
	height:100%;
	background:var(--black-1);
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	transition:0.5s;
	opacity:0.9;
	z-index:10;
}
.link-box-2 a:hover .photo img{
	filter:blur(0);
}
.link-box-2 a:hover .photo::before{
	opacity:0;
}
.link-box-2 .text{
	width:100%;
	color:var(--white-1);
	font-size:24px;
	font-weight:bold;
	position:absolute;
	top:50%;
	left:50%;
	letter-spacing:1px;
	transform:translate(-50%,-50%);
	text-align:center;
	z-index:11;
}

	@media screen and (max-width:767px){

	}



/* sticky-nav */
/* ---------------------------------------- */
.sticky-nav-1{
	width:100%;
	padding:15px;
	line-height:1;
	background:var(--gray-3);
	position:fixed;
	bottom:0;
	z-index:100;
}
.sticky-nav-1 ul{
	display:flex;
	justify-content:center;
	gap:25px;
	list-style:none;
}
.sticky-nav-1 ul li a{
	padding:5px 30px 5px 20px;
	background:var(--black-1);
	border-radius:100vh;
	color:var(--white-1);
	text-decoration:none;
	position:relative;
}
.sticky-nav-1 ul li a::before{
	content:"";
	display:block;
	width:4px;
	height:4px;
	margin:auto;
	border-top:2px solid var(--white-1);
	border-left:2px solid var(--white-1);
	position:absolute;
	top:0;
	bottom:0;
	right:15px;
	rotate:-135deg;
}
.sticky-nav-1 ul li a,
l.sticky-nav-1 ul li a::before{
	transition:0.5s;
}
.sticky-nav-1 ul li a:hover{
	opacity:0.5;
}

	@media screen and (max-width:767px){
		.sticky-nav-1 ul{
			overflow-x:scroll;
			justify-content:flex-start;
			gap:15px;
		}
		.sticky-nav-1 ul li{
			white-space:nowrap;
		}
		.sticky-nav-1 ul li a{
			display:block;
			font-size:13px;
		}
	}


/* box */
.box-1{
	border-radius:10px;
}
.box-2{
	background:#f7eee0;
	border-radius:10px;
}
.box-3{
	background:var(--black-1);
	border-radius:5px;
}
.box-border-1{
	border: 1px solid var(--gray-2);
	border-radius:10px;
}
.box-border-2{
	border: 1px dashed var(--gray-1);
	border-radius:10px;
}
.box-caution-1{
	border: 2px solid var(--red-1);
	border-radius:10px;
}
.box-caution-1 * {
	color:var(--red-1);
}

.bg-1{	background:var(--white-1);}
.bg-2{	background:var(--white-2);}


/* box-col */
.box-col-2,
.box-col-3{
	display:flex;
	align-items:center;
}
.box-col-2.rev,
.box-col-3.rev{
	flex-direction:row-reverse;
}

.pc-order-1{ order:1;}
.pc-order-2{ order:2;}


.box-col-3{
	gap:15px;
}

.box-inner{
	padding:25px;
}
.box-inner-50{
	padding:50px;
}
.box-inner-75{
	padding:75px;
}
.box-inner-100{
	padding:100px;
}

.box-inner-1{
	width:320px;
	margin: 0 auto;
}


	@media screen and (max-width:767px){
		.box-col-2.sp-wrap{
			flex-wrap:wrap;
		}
		.box-col-2.sp-wrap .box-cell{
			width:100%;
		}
		.sp-order-1{ order:1;}
		.sp-order-2{ order:2;}

		.box-inner{
			padding:15px;
		}
		.box-inner-50{
			padding:25px;
		}
		.box-inner-75{
			padding:35px;
		}
		.box-inner-100{
			padding:50px;
		}
		.box-inner-1{
			max-width:100%;
		}
	}



.flex-c{
	display:flex;
	justify-content:center;
}
.w5{	width:5%;}
.w10{	width:10%;}
.w15{	width:15%;}
.w25{	width:25%;}
.w30{	width:30%;}
.w35{	width:35%;}
.w40{	width:40%;}
.w45{	width:45%;}
.w50{	width:50%;}
.w55{	width:55%;}
.w60{	width:60%;}
.w65{	width:65%;}
.w70{	width:70%;}
.w75{	width:75%;}
.w80{	width:80%;}
.w85{	width:85%;}
.w90{	width:90%;}
.w95{	width:95%;}
.w100{ width:100%;}

	@media screen and (max-width:767px){
		.w100sp{width:100%;}
	}

.fs28{	font-size:28px;}
.fs24{	font-size:24px;}
.fs20{	font-size:20px;}
.fs18{	font-size:18px;}
.fs16{	font-size:16px;}
.fs15{	font-size:15px;}
.fs14{	font-size:14px;}
.fs13{	font-size:13px;}




/* workplace */
/* ---------------------------------------- */

.workplace-box-1,
.workplace-box-2,
.workplace-box-3{
	display:flex;
	align-items:center;
}
.workplace-box-2{
	flex-direction:row-reverse;
}
.workplace-box-3{
	gap:15px;
}
.workplace-box-1 .box-cell,
.workplace-box-2 .box-cell,
.workplace-box-3 .box-cell{
	flex:1;
}

.post-1{
	margin:5px 25px;
	text-align:center;
}

.workplace-box-2 .workplace-photo-wrapper{
	width:100%;
	height:500px;
	position:relative;
}
.workplace-box-2 .workplace-photo-wrapper .photo-1{
	width:80%;
	position:relative;
	top:-50px;
	right:-200px;
}
.workplace-box-2 .workplace-photo-wrapper .photo-2{
	width:60%;
	box-shadow:0 0 15px rgba(255,255,255,0.7);
	line-height:0;
	position:absolute;
	top: 200px;
	left:-30px;
}

	@media screen and (min-width:768px) and (max-width: 1039px){
		.workplace-box-1,
		.workplace-box-2,
		.workplace-box-3{
			flex-wrap:wrap;
			gap:25px 0;
		}
		.workplace-box-2 .workplace-photo-wrapper{
			height:300px;
		}
		.workplace-box-1 .box-cell,
		.workplace-box-2 .box-cell,
		.workplace-box-3 .box-cell{
			min-width:100%;
		}
		.workplace-box-2 .workplace-photo-wrapper .photo-1{
			width:52%;
			top:-75px;
			right:-325px;
		}
		.workplace-box-2 .workplace-photo-wrapper .photo-2{
			width:42%;
			top:75px;
			left:7%;
		}
	}

	@media screen and (max-width:767px){
		.workplace-box-1,
		.workplace-box-2,
		.workplace-box-3{
			flex-wrap:wrap;
			gap:25px 0;
		}
		.workplace-box-2 .workplace-photo-wrapper{
			height:300px;
		}
		.workplace-box-1 .box-cell,
		.workplace-box-2 .box-cell,
		.workplace-box-3 .box-cell{
			min-width:100%;
		}
		.post-1{
			width:320px;
			margin:5px auto 50px;
		}
		.workplace-box-2 .workplace-photo-wrapper .photo-1{
			width:65%;
			top:0;
			right:-110px;
		}
		.workplace-box-2 .workplace-photo-wrapper .photo-2{
			width:50%;
			top:150px;
			left:5%;
		}
	}




.scroll_fadein{
  opacity: 0;
}
.fadein_animation_start{
  animation-name: fadein_animation;
  animation-delay: 0.3s;
  animation-duration: 2s;
  animation-fill-mode: both;
}
@keyframes fadein_animation{
  0% {
    opacity: 0;
  }
  100%{
    opacity: 1;
    transform: translate(0);
  }
}
.slideup{		transform: translateY(50px);}
.slidedown{		transform: translateY(-50px);}
.slideright{	transform: translateX(50px);}
.slideleft{		transform: translateX(-50px);}

