@charset "UTF-8";

/*--------------------------------------------------------------
html, body
--------------------------------------------------------------*/

html, body{
	margin: 0;
    padding: 0;
	color: #151E23;
	font-family: "Zen Kaku Gothic New", sans-serif;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-align: justify;
	text-justify: inter-ideograph;
	font-feature-settings: "pkna" 1;
	word-break: break-all;
	background: url("../images/base_bg.jpg") left top;
	-webkit-background-size: 390px 390px;
	background-size: 390px 390px;
}


/*--------------------------------------------------------------
font-family: "Bakbak One", sans-serif;
font-family: "Dela Gothic One", sans-serif;

background: url("../image/ground.jpg") top center no-repeat;
-webkit-background-size: 100% 100%;
background-size: 100% 100%;
--------------------------------------------------------------*/

/*--------------------------------------------------------------
h1,h2,h3,h4,h5,h6
ul
--------------------------------------------------------------*/

h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
}

ul {
	list-style-type: none;
}


/*--------------------------------------------------------------
img
--------------------------------------------------------------*/

img {
	width: 100%;
	height: auto;
}

/*--------------------------------------------------------------
a
--------------------------------------------------------------*/

a:link {
	color: #151E23;
	text-decoration: none;
}

a:visited {
	color: #151E23;
	text-decoration: none;
}

a:hover, a:active, a:focus {
	text-decoration: none;
}

/*--------------------------------------------------------------
#loading
--------------------------------------------------------------*/
	
@media screen and (min-width: 300px) {
	
	#loading {
		position: fixed;
		width: 100%;
		height: 100%;
		z-index: 9999;
		background: #333;
		text-align: center;
		color: #fff;
		display: block;
	}

	#loading_logo {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		animation: logoPopIn 1s ease-out;
	}

	#loading_logo img {
		width: 100%;
		opacity: 0;
		transform: scale(0.6);
		animation: logoZoomHyper 0.3s cubic-bezier(0.4, 0, 0.2, 1.4) forwards;
	}

	#loading_logo span {
		display: block;
		font-family: "Bakbak One", sans-serif;
		font-size: 16px;
		margin-top: 20px;
		opacity: 0;
		animation: blinkText 1.2s infinite ease-in-out;
		animation-delay: 0.6s;
	}
	
}
	
@media screen and (min-width: 771px) {
	
	
	
}



@media screen and (min-width: 1161px) {
	
	#loading {
		position: fixed;
		width: 100%;
		height: 100%;
		z-index: 9999;
		background: #333;
		text-align: center;
		color: #fff;
		display: block;
	}

	#loading_logo {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		animation: logoPopIn 1s ease-out;
	}

	#loading_logo img {
		width: 28.64vw;
		opacity: 0;
		transform: scale(0.6);
		animation: logoZoomHyper 0.3s cubic-bezier(0.4, 0, 0.2, 1.4) forwards;
	}

	#loading_logo span {
		display: block;
		font-family: "Bakbak One", sans-serif;
		font-size: 1.25vw;
		margin-top: 1.042vw;
		opacity: 0;
		animation: blinkText 1.2s infinite ease-in-out;
		animation-delay: 0.6s;
	}
	
}

@keyframes logoZoomHyper {
  0% {
    opacity: 0;
    transform: scale(0.6);
  }
  60% {
    opacity: 1;
    transform: scale(1.1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* テキストの点滅（上下動なし） */
@keyframes blinkText {
  0%, 100% {
    opacity: 0.3;
  }
  50% {
    opacity: 1;
  }
}

/*--------------------------------------------------------------
#container
--------------------------------------------------------------*/
	
@media screen and (min-width: 300px) {
	
	#container {
		margin: 0;
		padding: 0;
	}
	
	
}
	
@media screen and (min-width: 771px) {
	
	
	
}



@media screen and (min-width: 1161px) {
	
	#container {
		margin: 0;
		padding: 0;
	}
	
}

/*--------------------------------------------------------------
h3
p
--------------------------------------------------------------*/
	
@media screen and (min-width: 300px) {
	
	h3{
		font-size: 70px;
		line-height: 0.8;
		font-family: "Bakbak One", sans-serif;
	}
	
	h3 span {
		margin-top: 10px;
		padding-left: 0;
		font-size: 16px;
		font-weight: 900;
		display: block;
		font-family: "Zen Kaku Gothic New", sans-serif;
	}
	
	p {
		font-size: 16px;
		font-weight: 700;
		line-height: 1.6;
	}
	
	
}
	
@media screen and (min-width: 771px) {
	
	
	
}



@media screen and (min-width: 1161px) {
	
	h3{
		font-size: 10.417vw;
		line-height: 0.8;
		font-family: "Bakbak One", sans-serif;
	}
	
	h3 span {
		margin-top: 1.042vw;
		padding-left: 1.042vw;
		font-size: 1.562vw;
		font-weight: 900;
		display: block;
		font-family: "Zen Kaku Gothic New", sans-serif;
	}
	
	p {
		font-size: 1.042vw;
		font-weight: 700;
		line-height: 1.8;
	}
	
}

/*--------------------------------------------------------------
#header
--------------------------------------------------------------*/

@media screen and (min-width: 300px) {
	
	#header {
		margin: 0;
		padding: 20px 165px 20px 20px;
	}
	
	#header ul {
		margin: 0;
		padding: 0;
		display: -webkit-flex;
		display: flex;
		align-items: center;
		font-size: 20px;
		font-weight: 900;
	}
	
	#header ul li:first-child {
		margin-right: auto;
		line-height: 0;
	}
	
	#header ul li:first-child img {
		width: 250px;
	}
	
	#header a.nav {
		display: none;
	}
	
	#header ul li:nth-child(7) {
		display: none;
	}
	
}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){

	#header {
		margin: 0;
		padding: 1.823vw 8.594vw 1.042vw 3.125vw;
	}
	
	#header ul {
		margin: 0;
		padding: 0;
		display: -webkit-flex;
		display: flex;
		align-items: center;
		font-size: 1.042vw;
		font-weight: 900;
	}
	
	#header ul li:first-child {
		margin-right: auto;
		line-height: 0;
	}
	
	#header ul li:first-child img {
		width: 22.91vw;
	}
	
	#header a.nav {
		padding: 0 1.302vw;
		display: inherit;
	}
	
	#header li:nth-child(6) {
		margin-right: 1.042vw;
	}
	
	#header ul li:nth-child(7) {
		display: inherit;;
	}

	#header a.nav {
		position: relative;
		color: #000;
		text-decoration: none;
		transition: color 0.3s ease;
	}

	#header a.nav::after {
		content: "";
		position: absolute;
		left: 1.302vw;
		bottom: -0.26vw;
		width: 0%;
		height: 0.104vw;
		background-color: #000;
		transition: width 0.3s ease;
	}

	#header a.nav:hover::after {
		width: calc(100% - 50px);
	}
}


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

@media screen and (min-width: 300px) {
	
	.btn{
		position: relative;
		overflow: hidden;
		text-decoration: none;
		display: inline-block;
		padding: 20px 40px;
		text-align: center;
		outline: none;
		background: #B1FF00;
		border-radius: 50px;
		transition: ease .2s;
	}

	.btn span {
		position: relative;
		z-index: 3;
		color: #151E23;
	}
	
	.btn:hover span{
		color: #fff;
	}

	.bgskew::before {
		content: '';
		position: absolute;
		top: 0;
		left: -130%;
		background: #151E23;
		width: 120%;
		height: 100%;
		transform: skewX(-25deg);
	}

	.bgskew:hover::before {
		animation: skewanime .5s forwards;
	}

}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.btn{
		position: relative;
		overflow: hidden;
		text-decoration: none;
		display: inline-block;
		padding: 1.042vw 2.083vw;
		text-align: center;
		outline: none;
		background: #B1FF00;
		border-radius: 2.604vw;
		transition: ease .2s;
	}

	.btn span {
		position: relative;
		z-index: 3;
		color: #151E23;
	}
	
	.btn:hover span{
		color: #fff;
	}

	.bgskew::before {
		content: '';
		position: absolute;
		top: 0;
		left: -130%;
		background: #151E23;
		width: 120%;
		height: 100%;
		transform: skewX(-25deg);
	}

	.bgskew:hover::before {
		animation: skewanime .5s forwards;
	}

}


@keyframes skewanime {
	100% {
		left:-10%;/*画面の見えていない左から右へ移動する終了地点*/
	}
}


/*--------------------------------------------------------------
.openbtn
--------------------------------------------------------------*/

@media screen and (min-width: 300px) {
	
.openbtn {
  position: fixed;
  top: 0;
  right: 0;
  background: #151E23;
  cursor: pointer;
  width: 60px;
  height: 60px;
  z-index: 9998;
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 17px; /* 中央揃え（60px - 26px）÷2 */
  height: 2px;
  background: #fff;
  width: 26px;
}

.openbtn span:nth-of-type(1) {
  top: 21px; /* 中心より8px上 */
}

.openbtn span:nth-of-type(2) {
  top: 29px; /* 中心線 */
}

.openbtn span:nth-of-type(3) {
  top: 37px; /* 中心より8px下 */
}

.openbtn.active span:nth-of-type(1) {
  top: 29px;
  left: 17px;
  transform: rotate(45deg);
  transform-origin: center;
  width: 26px;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn.active span:nth-of-type(3) {
  top: 29px;
  left: 17px;
  transform: rotate(-45deg);
  transform-origin: center;
  width: 26px;
}

}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.openbtn{
		position: fixed;
		top: 0;
		right: 0;
		background: #151E23;
		cursor: pointer;
		width: 6.771vw;
		height: 6.771vw;
		z-index: 9998;
	}

	.openbtn span{
		display: inline-block;
		transition: all .4s;/*アニメーションの設定*/
		position: absolute;
		left: 2.344vw;
		height: 0.26vw;
		background: #fff;
		width: 2.083vw;
  }

	.openbtn span:nth-of-type(1) {
		top: 2.448vw;	
	}

	.openbtn span:nth-of-type(2) {
		top: 3.229vw;
	}

	.openbtn span:nth-of-type(3) {
		top: 4.01vw;
	}

	.openbtn.active span:nth-of-type(1) {
		top: 3.229vw;
		left: 2.344vw;
		transform: rotate(45deg);
		transform-origin: center;
		width: 2.083vw;
	}

	.openbtn.active span:nth-of-type(2) {
		opacity: 0;
	}

	.openbtn.active span:nth-of-type(3) {
		top: 3.229vw;
		left: 2.344vw;
		transform: rotate(-45deg);
		transform-origin: center;
		width: 2.083vw;
	}

}


/*--------------------------------------------------------------
#g-nav
--------------------------------------------------------------*/

@media screen and (min-width: 300px) {
	
	#g-nav{
		position: fixed;
		z-index: 999;
		top: 0;
		right: -120%;
		width: 100%;
		height: 100vh;
		background: #151E23;
		transition: all 0.6s;
	}

	#g-nav.panelactive{
		right: 0;
	}
	
	#g-nav.panelactive #g-nav-list{
		position: fixed;
		z-index: 999; 
		width: 100%;
		height: 100vh;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}

	#g-nav ul {
		z-index: 999;
		padding: 80px 8% 30px 8%;
	}

	#g-nav li{
		list-style: none;
		font-weight: 900;
		font-size: 18px;
	}

	#g-nav li:nth-child(1) a,
	#g-nav li:nth-child(2) a,
	#g-nav li:nth-child(3) a,
	#g-nav li:nth-child(4) a,
	#g-nav li:nth-child(5) a{
		color: #FFF;
		text-decoration: none;
		padding: 15px 10px;
		display: block;
		text-transform: uppercase;
	}
	
	#g-nav li:nth-child(6){
		margin-top: 20px;
		margin-bottom: 10px;
	}
	
	#g-nav li:nth-child(-n+5) a {
		position: relative;
		color: #FFF;
		text-decoration: none;
		display: block;
		transition: transform 0.3s ease, color 0.3s ease;
	}
	
	#g-nav li:nth-child(-n+5) a:hover {
		transform: translateX(8px); /* 右へスッと移動 */
		color: #CCC;
	}

	

}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	#g-nav{
		position: fixed;
		z-index: 999;
		top: 0;
		right: -36.45vw;
		width: 31.25vw;
		height: 100vh;
		background: #151E23;
		transition: all 0.6s;
	}

	#g-nav.panelactive{
		right: 0;
	}
	
	#g-nav.panelactive #g-nav-list{
		position: fixed;
		z-index: 999; 
		width: 31.25vw;
		height: 100vh;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}

	#g-nav ul {
		position: absolute;
		z-index: 999;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		padding: 0;
	}

	#g-nav li{
		list-style: none;
		font-weight: 900;
		font-size: 1.042vw;
	}

	#g-nav li:nth-child(1) a,
	#g-nav li:nth-child(2) a,
	#g-nav li:nth-child(3) a,
	#g-nav li:nth-child(4) a,
	#g-nav li:nth-child(5) a{
		color: #FFF;
		text-decoration: none;
		padding: 0.781vw 0.521vw;
		display: block;
		text-transform: uppercase;
	}
	
	#g-nav li:nth-child(6){
		margin-top: 1.042vw;
		margin-bottom: 0.521vw;
	}
	
	#g-nav li:nth-child(-n+5) a {
		position: relative;
		color: #FFF;
		text-decoration: none;
		display: block;
		transition: transform 0.3s ease, color 0.3s ease;
	}
	
	#g-nav li:nth-child(-n+5) a:hover {
		transform: translateX(8px); /* 右へスッと移動 */
		color: #CCC;
	}

}


/*--------------------------------------------------------------
.contents
--------------------------------------------------------------*/
	
@media screen and (min-width: 300px) {
	
	.contents {
		margin: 0;
		padding: 0;
	}
	
	
}
	
@media screen and (min-width: 771px) {
	
	
	
}



@media screen and (min-width: 1161px) {
	
	
}

/*--------------------------------------------------------------
.category-title
--------------------------------------------------------------*/
	
@media screen and (min-width: 300px) {
	
	.category-title {
		padding: 30px 0 50px 5%;
	}
	
	.category-title h1{
		font-size: 70px;
		line-height: 0.8;
		font-family: "Bakbak One", sans-serif;
	}
	
	.category-title h1 span {
		margin-top: 20px;
		padding-left: 10px;
		font-size: 20px;
		font-weight: 900;
		display: block;
		font-family: "Zen Kaku Gothic New", sans-serif;
	}
	
}
	
@media screen and (min-width: 771px) {
	
	
	
}



@media screen and (min-width: 1161px) {
	
	.category-title {
		padding: 4.167vw 0 4.167vw 8.073vw;
	}
	
	.category-title h1{
		font-size: 7.812vw;
		line-height: 0.8;
		font-family: "Bakbak One", sans-serif;
	}
	
	.category-title h1 span {
		margin-top: 1.042vw;
		padding-left: 1.823vw;
		font-size: 1.562vw;
		font-weight: 900;
		display: block;
		font-family: "Zen Kaku Gothic New", sans-serif;
	}
	
}


/*--------------------------------------------------------------
.line_cv
--------------------------------------------------------------*/

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

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.line_cv {
		margin: 0;
		padding: 0;
		width: 10.156vw;
		position: fixed;
		bottom: 1.042vw;
		right: 1.042vw;
		display: inherit;
	}
	
	.line_cv a img {
		transition: transform 0.4s ease, opacity 0.4s ease;
	}

	.line_cv a:hover img {
		transform: scale(1.08);
	}
}


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

@media screen and (min-width: 300px) {
	
	#footer {
		margin: 0;
		padding: 0;
		background: url("../images/dark_bg.jpg") top left;
		-webkit-background-size: 300px 300px;
		background-size: 300px 300px;
	}
	

}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	#footer {
		margin: 0;
		padding: 0;
		background: url("../images/dark_bg.jpg") top left;
		-webkit-background-size: 15.62vw 15.62vw;
		background-size: 15.62vw 15.62vw;
	}

}


/*--------------------------------------------------------------
.cv_area
--------------------------------------------------------------*/

@media screen and (min-width: 300px) {
	
	.cv_area {
		margin: 0;
		padding: 30px 0;
		background: url("../images/dark_sub_bg.jpg") top left;
		-webkit-background-size: 300px 300px;
		background-size: 300px 300px;
	}
	
	.cv_area dl {
		margin: 0;
		padding: 0 8%;
		text-align: center;
	}
	
	.cv_area dt {
		margin: 0 0 20px 0;
		padding: 0;
		font-size: 16px;
		font-weight: 700;
		color: #FFF;
	}
	
	.cv_area dt span {
		margin: 0 0 0 5px;
		padding: 0;
		font-size: 30px;
		font-family: "Bakbak One", sans-serif;
	}
	
	
}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.cv_area {
		margin: 0;
		padding: 3.385vw 0;
		background: url("../images/dark_sub_bg.jpg") top left;
		-webkit-background-size: 15.62vw 15.62vw;
		background-size: 15.62vw 15.62vw;
	}
	
	.cv_area dl {
		margin: 0;
		padding: 0;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: center;
		justify-content: center;
		align-items: center;
		text-align: left;
	}
	
	.cv_area dt {
		margin: 0;
		padding: 0 4.688vw 0 0;
		font-size: 1.042vw;
		font-weight: 700;
		color: #FFF;
	}
	
	.cv_area dt span {
		margin: 0 2.083vw 0 0.26vw;
		padding: 0;
		font-size: 2.083vw;
		font-family: "Bakbak One", sans-serif;
	}

}

/*--------------------------------------------------------------
.cvbtn
--------------------------------------------------------------*/

@media screen and (min-width: 300px) {
	
	.cvbtn{
		position: relative;
		overflow: hidden;
		text-decoration: none;
		display: inline-block;
		margin-left: 0;
		padding: 20px 0;
		text-align: center;
		outline: none;
		background: #B1FF00;
		border-radius: 50px;
		transition: ease .2s;
		font-size: 18px;
		font-weight: 900;
		width: 100%;
	}
	
	.cvbtn i{
		position: absolute;
		top: 65%;
		left: -10px;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
	}
	
	.cvbtn i img {
		width: 30px;
		height: auto;
	}

	.cvbtn span {
		position: relative;
		z-index: 3;
		color: #151E23;
		padding-left: 30px;
	}
	
	.cvbtn:hover span{
		
	}

	.bgskew2::before {
		content: '';
		position: absolute;
		top: 0;
		left: -130%;
		background: #FFF;
		width: 120%;
		height: 100%;
		transform: skewX(-25deg);
	}

	.bgskew2:hover::before {
		animation: skewanime .5s forwards;
	}

}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.cvbtn{
		position: relative;
		overflow: hidden;
		text-decoration: none;
		display: inline-block;
		margin-left: 0;
		padding: 1.042vw 0;
		text-align: center;
		outline: none;
		background: #B1FF00;
		border-radius: 2.604vw;
		transition: ease .2s;
		font-size: 1.042vw;
		font-weight: 900;
		width: 15.62vw;
	}
	
	.cvbtn i{
		position: absolute;
		top: 65%;
		left: -0.521vw;
		-webkit-transform: translateY(-50%); /* Safari用 */
		transform: translateY(-50%);
	}
	
	.cvbtn i img {
		width: 1.927vw;
		height: auto;
	}

	.cvbtn span {
		position: relative;
		z-index: 3;
		color: #151E23;
		padding-left: 2.083vw;
	}
	
	.cvbtn:hover span{
		
	}

	.bgskew2::before {
		content: '';
		position: absolute;
		top: 0;
		left: -130%;
		background: #FFF;
		width: 120%;
		height: 100%;
		transform: skewX(-25deg);
	}

	.bgskew2:hover::before {
		animation: skewanime .5s forwards;
	}

}


/*--------------------------------------------------------------
.recruitbtn
--------------------------------------------------------------*/

@media screen and (min-width: 300px) {
	
	.recruitbtn{
		position: relative;
		overflow: hidden;
		text-decoration: none;
		display: inline-block;
		margin-left: 0;
		padding: 20px 0;
		text-align: center;
		outline: none;
		background: #FFF;
		border-radius: 50px;
		transition: ease .2s;
		font-size: 18px;
		font-weight: 900;
		width: 100%;
	}

	.recruitbtn span {
		position: relative;
		z-index: 3;
		color: #151E23;
	}
	
	.bgskew3::before {
		content: '';
		position: absolute;
		top: 0;
		left: -130%;
		background: #B1FF00;
		width: 120%;
		height: 100%;
		transform: skewX(-25deg);
	}

	.bgskew3:hover::before {
		animation: skewanime .5s forwards;
	}

}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.recruitbtn{
		position: relative;
		overflow: hidden;
		text-decoration: none;
		display: inline-block;
		margin-left: 0;
		padding: 1.042vw 0;
		text-align: center;
		outline: none;
		background: #FFF;
		border-radius: 2.604vw;
		transition: ease .2s;
		font-size: 1.042vw;
		font-weight: 900;
		width: 15.62vw;
	}

	.recruitbtn span {
		position: relative;
		z-index: 3;
		color: #151E23;
	}
	
	.bgskew3::before {
		content: '';
		position: absolute;
		top: 0;
		left: -130%;
		background: #B1FF00;
		width: 120%;
		height: 100%;
		transform: skewX(-25deg);
	}

	.bgskew3:hover::before {
		animation: skewanime .5s forwards;
	}

}


/*--------------------------------------------------------------
.fotter-info
--------------------------------------------------------------*/

@media screen and (min-width: 300px) {
	
	.fotter-info {
		width: auto;
		margin: 0 auto;
		padding: 50px 0 20px 0;
	}
	
	.fotter-info ul {
		margin: 0 8% 24px 8%;
		padding: 0;
	}
	
	.fotter-info ul li:first-child {
		margin-right: 0;
		margin-bottom: 20px;
	}
	
	.fotter-info ul li:first-child img {
		width: 220px;
		height: auto;
	}
	
	.fotter-info ul li:nth-child(2) a,
	.fotter-info ul li:nth-child(3) a,
	.fotter-info ul li:nth-child(4) a,
	.fotter-info ul li:nth-child(5) a,
	.fotter-info ul li:nth-child(6) a{
		margin: 0;
		padding: 10px 0;
		color: #FFF;
		display: block;
		font-size: 16px;
		font-weight: 900;
	}
	
	.corporate {
		margin: 0 8%;
		padding: 0;
		width: auto;
		text-align: left;
		box-sizing: border-box;
	}
	
	.corporate a {
		margin: 0 0 20px 0;
		padding: 0;
		color: #FFF;
		display: inline;
		font-size: 16px;
		font-weight: 900;
	}
	
	.corporate .material-symbols-outlined {
		margin-left: 5px;
		vertical-align: -3px;
		font-size: 20px;
		font-variation-settings:
			'FILL' 0,
			'wght' 400,
			'GRAD' 0,
			'opsz' 24
	}
	
	.fotter-info dl {
		margin: 0 8%;
		padding: 0;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: flex-end;
		justify-content: flex-end;
		align-items: center;
	}
	
	.fotter-info dl dd {
		margin: 0 5px;
		padding: 0;
	}
	
	.fotter-info dl dd img {
		width: 35px;
		height: auto;
	}
	
	.fotter-info h6 {
		margin: 30px 0 20px 0;
		padding: 0 5%;
		text-align: left;
		color: #FFF;
		font-size: 35px;
		font-family: "Dela Gothic One", sans-serif;
		line-height: 1;
	}
	
	.copyright {
		margin: 0;
		padding: 0;
		text-align: center;
		color: #FFF;
		font-size: 12px;
		font-family: "Bakbak One", sans-serif;
	}
	
	
	/* フッターのリンク hover アクション */
	.fotter-info ul li:nth-child(n+2):nth-child(-n+6) a {
		position: relative;
		transition: transform 0.3s ease, color 0.3s ease;
	}
	
	.fotter-info ul li:nth-child(n+2):nth-child(-n+6) a:hover {
		transform: translateX(6px);
		color: #CCC; /* ややグレーへ変化（好みに応じて調整可） */
	}

	
}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.fotter-info {
		width: 67.7vw;
		margin: 0 auto;
		padding: 3.906vw 0 1.823vw 0;
	}
	
	.fotter-info ul {
		margin: 0 0 1.25vw 0;
		padding: 0;
		display: -webkit-flex;
		display: flex;
		align-items: center;
	}
	
	.fotter-info ul li:first-child {
		margin-right: auto;
		margin-bottom: 0;
	}
	
	.fotter-info ul li:first-child img {
		width: 16.14vw;
		height: auto;
	}
	
	.fotter-info ul li:nth-child(2) a,
	.fotter-info ul li:nth-child(3) a,
	.fotter-info ul li:nth-child(4) a,
	.fotter-info ul li:nth-child(5) a,
	.fotter-info ul li:nth-child(6) a{
		margin: 0;
		padding: 0 1.302vw;
		color: #FFF;
		display: block;
		font-size: 1.042vw;
		font-weight: 900;
	}
	
	.corporate {
		margin: 0 auto;
		padding: 0 28.2vw 0 0;
		width: 67.7vw;
		text-align: right;
		box-sizing: border-box;
	}
	
	.corporate a {
		margin: 0;
		padding: 0;
		color: #FFF;
		display: inline;
		font-size: 1.042vw;
		font-weight: 900;
	}
	
	.corporate .material-symbols-outlined {
		margin-left: 0.26vw;
		vertical-align: -0.156vw;
		font-size: 1.042vw;
		font-variation-settings:
			'FILL' 0,
			'wght' 400,
			'GRAD' 0,
			'opsz' 24
	}
	
	.fotter-info dl {
		margin: 0;
		padding: 0 1.042vw 0 0;
		display: -webkit-flex;
		display: flex;
		-webkit-justify-content: flex-end;
		justify-content: flex-end;
		align-items: center;
	}
	
	.fotter-info dl dd {
		margin: 0 0.26vw;
		padding: 0;
	}
	
	.fotter-info dl dd img {
		width: 1.823vw;
		height: auto;
	}
	
	.fotter-info h6 {
		margin: 4.167vw 0 1.042vw 0;
		padding: 0;
		text-align: center;
		color: #FFF;
		font-size: 4.844vw;
		font-family: "Dela Gothic One", sans-serif;
	}
	
	.copyright {
		margin: 0;
		padding: 0;
		text-align: center;
		color: #FFF;
		font-size: 0.781vw;
		font-family: "Bakbak One", sans-serif;
	}
	
	
	/* フッターのリンク hover アクション */
	.fotter-info ul li:nth-child(n+2):nth-child(-n+6) a {
		position: relative;
		transition: transform 0.3s ease, color 0.3s ease;
	}
	
	.fotter-info ul li:nth-child(n+2):nth-child(-n+6) a:hover {
		transform: translateX(6px);
		color: #CCC; /* ややグレーへ変化（好みに応じて調整可） */
	}

}





/*--------------------------------------------------------------
@media
--------------------------------------------------------------*/

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

}

@media screen and (min-width: 771px)  {
	
	
	
}


@media screen and (min-width: 1161px){
	
	.pc {
		display: inherit;
	}
	
	.sp {
		display: none;
	}

}

.fade-in {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity 1s ease,
    transform 1s ease;
  transition-delay: 0.2s;
  will-change: opacity, transform;
}

.fade-in.show {
  opacity: 1;
  transform: translateY(0);
}