@charset "UTF-8";
/* CSS Document */

/*--------------------------------------------------------
　基本設定
--------------------------------------------------------*/

/* これが重要：カスタムプロパティをアニメ可能にする */ 
@property --reveal { 
	syntax: '<percentage>'; inherits: false; initial-value: 0%; 
} 
@property --feather { 
	syntax: '<percentage>'; inherits: false; initial-value: 20%; /* ふちの柔らかさ（お好みで 8〜20% 程度） */ 
}

.mask { overflow: hidden; }

/* 角度をそろえる（160degに統一）＋ 遅延を付ける */
.mask-reveal .mask-target {
  display: block;
  width: 100%;
  height: auto;

  --reveal: 0%;
  --feather: 70%;

  -webkit-mask-image: linear-gradient(
    160deg,
    #000 0%,
    #000 calc(var(--reveal) - var(--feather)),
    rgba(0,0,0,0.85) var(--reveal),
    transparent calc(var(--reveal) + var(--feather))
  );
          mask-image: linear-gradient(
    160deg,
    #000 0%,
    #000 calc(var(--reveal) - var(--feather)),
    rgba(0,0,0,0.85) var(--reveal),
    transparent calc(var(--reveal) + var(--feather))
  );
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;

  /* ▼ここがポイント：--reveal に“遅延”を付ける（例：0.35s） */
  transition: --reveal 4s cubic-bezier(.22,.61,.36,1) 0.35s;
}

/* 画面に入ったらマスク境界を押し出す */
.mask-reveal.is-inview .mask-target {
  --reveal: 120%;
}

/* （任意）より“ふわっ”に：薄いフェードも足す場合は上に追記せず、下を追加 */
.mask-reveal .mask-target {
  opacity: 0;                                   /* 初期はうっすら隠す */
  transition:
    --reveal 4s cubic-bezier(.22,.61,.36,1) 0.35s,
    opacity 1.0s ease 0.20s;                    /* フェードは少し早めに開始 */
}
.mask-reveal.is-inview .mask-target {
  opacity: 1;
}

/* フォールバック（mask非対応時はフェードのみ） */
@supports not ((mask-image: linear-gradient(#000, transparent))) {
  .mask-reveal .mask-target { opacity: 0; transition: opacity 1.0s ease 0.2s; }
  .mask-reveal.is-inview .mask-target { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .mask-reveal .mask-target { transition-duration: .01ms !important; }
}

/* Brand image animation */
section#brand {
	transition: background-color .8s ease;
}

/* Future animation */
section#future .section_inner > .block,
section#future .section_inner > .bg1,
section#future .section_inner > .bg2,
section#future .section_inner > .img {
	opacity: 0;
}

section#future .section_inner > .block,
section#future .section_inner > .bg1,
section#future .section_inner > .bg2 {
	transition: opacity .8s ease;
}

section#future .section_inner > .img {
	transition: opacity 1.4s ease .45s;
}

section#future.is_anim .section_inner > .block,
section#future.is_anim .section_inner > .bg1,
section#future.is_anim .section_inner > .bg2,
section#future.is_anim .section_inner > .img {
	opacity: 1;
}

section#brand .img_block {
	position: relative;
	aspect-ratio: 1300 / 956;
	align-self: flex-start;
	overflow: hidden;
	line-height: 0;
}

section#brand .img_block .anim_bg {
	width: 100%;
	height: auto;
	display: block;
	opacity: 0;
	transition: opacity .8s ease;
}

section#brand .img_block.is_anim .anim_bg {
	opacity: 1;
}

section#brand .brand_anim_layers,
section#brand .brand_anim_part,
section#brand .brand_anim_svg,
section#brand .brand_anim_text {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

section#brand .brand_anim_layers {
	z-index: 2;
	pointer-events: none;
}

section#brand .brand_anim_part {
	z-index: 1;
}

section#brand .brand_anim_text {
	z-index: 2;
	object-fit: fill;
	opacity: 0;
	transition: opacity .8s ease;
}

section#brand .brand_anim_layers.is_playing .brand_anim_text {
	opacity: 1;
}

section#brand .brand_anim_svg {
	display: block;
	overflow: hidden;
}

/*--------------------------------------------------------
　PC
--------------------------------------------------------*/

@media print, screen and (min-width: 961px){
	
	main section h2 {
		font-family: YakuHanJP, "Libre Franklin";
		font-size: 5.0rem;
		font-weight: 500;
		line-height: 1;
	}
	
	main section h2 small{
		font-family: YakuHanJP, "Zen Kaku Gothic New", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: 1.5rem;
		font-weight: 400;
		display: block;
		margin-top: 1.25em;
	}
	
	main section a.more {
		width: 180px;
		font-size: 1.6rem;
		line-height: 1;
		color: #000;
		display: block;
		position: relative;
	}
	
	main section a.more span.arrow_more {
		display: inline-block;
		transition: margin 0.3s ease;
	}
	
	main section a.more:hover span.arrow_more {
		margin-left: 1.75em;
	}
	
	main section a.more span.arrow{
		width: 116px;
		display: inline-block;
		padding-right: 20px;
		position: absolute;
		bottom: 0;
		right: 0;
	}
	
	main section a.more span.arrow::before{
		content: "";
		width: 94px;
		height: 1px;
		background: #000;
		display: block;
		transform: scaleX(1);
		transform-origin: right center;
		transition: transform 0.3s ease;
	}
	
	main section a.more:hover span.arrow::before{
		transform: scaleX(0.8);
	}
	
	main section a.more span.arrow i{
		width: 32px;
		line-height: 0;
		display: inline-block;
		position: absolute;
		right: 0;
		bottom: -0.5px;
	}
	
	
	
	
	
	
	section#since{
		width: 100%;
		height: 100svh;
		min-height: 160px;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	
	section#since div.section_inner{
		width: 942px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}
	
	section#since div.section_inner figure {
		width: 270px;
		line-height: 0;
	}
	
	section#since div.section_inner div.text_block {
		width: 560px;
	}
	
	section#since div.section_inner div.text_block h3{
		width: 180px;
		font-family: YakuHanJP, "Libre Franklin";
		font-size: 2.0rem;
		font-weight: 400;
		line-height: 1;
		letter-spacing: 10%;
		border-bottom: 1px solid #000;
	}
	
	section#since div.section_inner div.text_block p{
		font-size: 1.6rem;
		line-height: 2.25;
		letter-spacing: 2%;
		margin-top: 1.5em;
	}
	
	section#future{
		width: 100%;
		margin: 80px 0;
	}
	
	section#future div.section_inner{
		width: 86.11%;
		max-width: 1240px;
		margin: 0 auto;
		padding: 140px 0 110px 110px;
		position: relative;
	}
	
	section#future div.section_inner div.bg1{
		width: 157px;
		line-height: 0;
		position: absolute;
		top: 0;
		left: -5cqw;
		z-index: -1;
	}
	
	section#future div.section_inner div.img{
		width: 675px;
		line-height: 0;
		position: absolute;
		top: 140px;
		left: calc(50% - 337px);
		z-index: -1;
	}
	
	section#future div.section_inner div.bg2{
		width: 188px;
		position: absolute;
		bottom: 0;
		right: -6.25cqw;
		z-index: -1;
	}
	
	section#future div.section_inner div.block{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		position: relative;
	}
	
	section#future div.section_inner div.block div.block_l{
		width: 340px;
	}
	
	section#future div.section_inner div.block div.block_l h3{
		font-size: 3.2rem;
		font-weight: 500;
		line-height: 1.5;
		letter-spacing: 10%;
	}
	
	section#future div.section_inner div.block div.block_l h3 small{
		display: block;
		font-family: YakuHanJP, "Libre Franklin";
		font-size: 1.8rem;
		font-weight: 400;
		line-height: 1.7;
		letter-spacing: 10%;
		margin-top: 1em;
	}
	
	section#future div.section_inner div.block div.block_r{
		width: 370px;
		margin-top: 114px;
	}
	
	section#future div.section_inner div.block div.block_r p{
		font-size: 1.6rem;
		line-height: 2.25;
		letter-spacing: 2%;
	}
	
	section#brand {
		width: 100%;
		background: rgba(215,215,222,0);
		padding: 90px 0 114px;
	}
	
	section#brand div.section_inner{
		width: 86.11%;
		max-width: 1240px;
		margin: 0 auto;
		padding-left: 74px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		position: relative;
	}
	
	section#brand div.section_inner div.bg1{
		width: 139px;
		line-height: 0;
		position: absolute;
		top: 168px;
		left: -6.94cqw;
		z-index: 0;
	}
	
	section#brand div.section_inner div.bg2{
		width: 220px;
		position: absolute;
		top: -90px;
		left: 183px;
		z-index: 0;
	}
	
	section#brand div.section_inner div.text_block{
		width: 33.6%;
		max-width: 392px;
		margin-top: 90px;
		position: relative;
		z-index: 5;
	}
	
	section#brand div.section_inner div.text_block p{
		font-size: 1.6rem;
		line-height: 2;
		letter-spacing: 2%;
		margin-top: 36px;
	}
	
	section#brand div.section_inner div.text_block div.more_box {
		margin-top: 50px;
	}
	
	section#brand div.section_inner div.img_block{
		width: 52.25%;
		align-self: flex-end;
		position: relative;
		line-height: 0;
	}
	
	section#projects {
		margin-top: 80px;
	}
	
	section#projects div.section_inner{
		width: 91.3%;
		max-width: 1316px;
		min-height: 600px;
		margin: 0 auto;
		padding-top: 60px;
		position: relative;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	
	section#projects div.section_inner div.bg1{
		width: 160px;
		line-height: 0;
		position: absolute;
		top: 0;
		left: 51.6%;
		z-index: -1;
	}
	
	section#projects div.section_inner div.bg2{
		width: 113px;
		position: absolute;
		top: 150px;
		right: 13.2%;
		z-index: -1;
	}
	
	section#projects div.section_inner div.block{
		width: 38.44%;
		padding-top: 66px;
	}
	
	section#projects div.section_inner div.block div.thum{
		width: 52.08cqw;
		max-width: 750px;
		height: 41.66cqw;
		max-height: 600px;
		line-height: 0;
		overflow: hidden;
		position: absolute;
		top: 60px;
		left: -62px;
	}
	
	section#projects div.section_inner div.block div.thum img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center center;
	}
	
	section#projects div.section_inner div.block h3{
		font-size: 2.6rem;
		font-weight: 500;
		line-height: 1.5;
		letter-spacing: 2%;
		margin-top: 48px;
	}
	
	section#projects div.section_inner div.block ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 0 14px;
		margin-top: 16px;
	}
	
	section#projects div.section_inner div.block ul li{
		display: inline-block;
		margin-bottom: 10px;
		font-size: 1.3rem;
		line-height: 1;
		border: 1px solid #D7D7DE;
		border-radius: 60px;
		padding: 6px 10px;
		background: #EDEDEF;
	}
	
	section#projects div.section_inner div.block p{
		font-size: 1.6rem;
		line-height: 2;
		letter-spacing: 2%;
		margin-top: 38px;
	}
	
	section#projects div.section_inner div.block p + p{
		margin-top: 0;
	}
	
	section#projects div.section_inner div.block dl.credit{
		margin-top: 40px;
	}
	
	section#projects div.section_inner div.block dl.credit dt{
		font-size: 1.6rem;
		display: inline-block;
		padding-bottom: 0.15em;
		border-bottom: 1px solid #000;
		margin-bottom: 0.5em;
		padding-right: 2em;
		position: relative;
		cursor: pointer;
	}
	
	section#projects div.section_inner div.block dl.credit dt span{
		width: 14px;
		height: 14px;
		display: block;
		position: absolute;
		top: 6px;
		right: 0;
	}
	
	section#projects div.section_inner div.block dl.credit dt span::before{
		content: "";
		width: 14px;
		height: 1px;
		background: #000;
		position: absolute;
		top: 6px;
		right: 0;
	}
	
	section#projects div.section_inner div.block dl.credit dt span::after{
		content: "";
		width: 1px;
		height: 14px;
		background: #000;
		position: absolute;
		top: 0;
		right: 7px;
		opacity: 1;
        transform: rotate(0deg);
        transform-origin: center;
        transition: transform 0.35s ease, opacity 0.35s ease;
	}
	
	section#projects div.section_inner div.block dl.credit dt.ac span::after{
        opacity: 0;
        transform: rotate(90deg);
    }
	
	section#projects div.section_inner div.block dl.credit dd{
		width: 100%;
		font-size: 1.6rem;
		line-height: 1.8;
		padding-left: 0.5em;
		display: none;
	}
	
	section#projects div.section_inner div.block dl.credit dd p{
		line-height: 1.5;
		margin-top: 0;
	}
	
	section#projects div.section_inner div.block dl.credit dd p + p{
		margin-top: 4px;
	}
	
	section#projects div.section_inner div.block dl.credit dd a{
		color: #000;
	}
	
	section#projects div.section_inner div.block div.more_box {
		margin-top: 64px;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	
	section#work {
		margin-top: 80px;
	}
	
	section#work div.section_inner{
		width: 91.3%;
		max-width: 1316px;
		margin: 0 auto;
		padding-top: 110px;
		position: relative;
	}
	
	section#work div.section_inner div.bg1{
		width: 284px;
		line-height: 0;
		position: absolute;
		top: 0;
		left: 258px;
		z-index: -1;
	}
	
	section#work div.section_inner div.bg2{
		width: 126px;
		position: absolute;
		top: 180px;
		left: -64px;
		z-index: -1;
	}
	
	section#work div.section_inner h2{
		margin-left: 112px;
	}
	
	section#work div.section_inner ul.list{
		width: 100%;
		margin: 90px auto 0;
		display: flex;
		flex-wrap: wrap;
		gap: 60px 2.3%;
	}
	
	section#work div.section_inner ul.list li{
		width: 31.8%;
	}
	
	section#work div.section_inner ul.list li a{
		display: block;
		color: #000;
	}
	
	section#work div.section_inner ul.list li a div.thum{
		width: 100%;
		height: 20.2cqw;
		max-height: 292px;
		line-height: 0;
		margin-bottom: 20px;
		border: 1px solid #D7D7DE;
	}
	
	section#work div.section_inner ul.list li a div.thum img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	
	section#work div.section_inner ul.list li a ul.cate{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 14px;
	}
	
	section#work div.section_inner ul.list li a ul.cate li{
		width: auto;
		display: inline-block;
		border: 1px solid #D7D7DE;
		border-radius: 60px;
		padding: 6px 10px 8px;
		font-size: 1.3rem;
		line-height: 1;
		color: #000;
		background: #EDEDEF;
	}
	
	section#work div.section_inner ul.list li a h3{
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1.5;
		margin-top: 20px;
	}
	
	section#work div.section_inner div.more_box {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		margin-top: 70px;
	}

	section#news {
		margin-top: 80px;
	}
	
	section#news div.section_inner{
		width: 91.3%;
		max-width: 1316px;
		min-height: 430px;
		margin: 0 auto;
		padding-top: 110px;
		padding-left: 112px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		position: relative;
	}
	
	section#news div.section_inner div.bg1{
		width: 193px;
		line-height: 0;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
	}
	
	section#news div.section_inner div.bg2{
		width: 110px;
		position: absolute;
		top: 128px;
		left: 332px;
		z-index: -1;
	}
	
	section#news div.section_inner h2{
		width: 140px;
	}
	
	section#news div.section_inner div.inner_l{
		width: 71.8%;
	}
	
	section#news div.section_inner div.inner_l ul.list{
		border-top: 1px solid #D7D7DE;
		margin-top: 100px;
	}
	
	section#news div.section_inner div.inner_l ul.list li{
		width: 100%;
		border-bottom: 1px solid #D7D7DE;
	}
	
	section#news div.section_inner div.inner_l ul.list li a{
		width: 100%;
		padding: 30px 20px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		background: rgba(237,237,239,0);
		transition: background-color 0.4s ease;
		color: #000;
	}
	
	section#news div.section_inner div.inner_l ul.list li a:hover{
		background: rgba(237,237,239,1);
	}
	
	section#news div.section_inner div.inner_l ul.list li a div{
		width: 206px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}
	
	section#news div.section_inner div.inner_l ul.list li a div time,
	div.head_block div.head_box div time {
		width: 90px;
		font-family: YakuHanJP, "Libre Franklin";
		font-size: 1.5rem;
		line-height: 1;
	}
	
	section#news div.section_inner div.inner_l ul.list li a div p.cate,
	div.head_block div.head_box div p.cate {
		width: 100px;
		padding: 6px 10px;
		font-size: 1.3rem;
		line-height: 1;
		border: 1px solid #000;
		border-radius: 60px;
		text-align: center;
	}
	
	section#news div.section_inner div.inner_l ul.list li a h3{
		width: calc(100% - 250px);
		font-size: 1.8rem;
		font-weight: 500;
		line-height: 1.5;
	}
	
	section#news div.section_inner div.inner_l div.more_box {
		display: inline-block;
		position: absolute;
		left: 112px;
		top: 338px;
	}
	
	section#recruit {
		margin-top: 80px;
		height: 494px;
		background: #DADAE0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		position: relative;
		overflow: hidden;
	}

	section#recruit div.recruit_parts{
		width: max(100%, 1440px);
		aspect-ratio: 2880 / 988;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		pointer-events: none;
	}

	section#recruit div.recruit_parts span.rec_part{
		display: block;
		position: absolute;
		line-height: 0;
	}

	section#recruit div.recruit_parts span.rec_part img{
		width: 100%;
		height: auto;
	}

	section#recruit div.recruit_parts span.rec_l_bg01{width:11.87%;left:2.6%;top:-4.2%;}
	section#recruit div.recruit_parts span.rec_l_bg02{width:13.63%;left:-3.2%;top:34.6%;}
	section#recruit div.recruit_parts span.rec_l_bg03{width:6.39%;left:-2.8%;top:86.6%;}
	section#recruit div.recruit_parts span.rec_l_bg04{width:5.68%;left:30.1%;top:10.5%;}
	section#recruit div.recruit_parts span.rec_l_bg05{width:2.46%;left:27.2%;top:81.6%;}
	section#recruit div.recruit_parts span.rec_l_bg06{width:5.27%;left:21.4%;top:91.3%;}
	section#recruit div.recruit_parts span.rec_r_bg01{width:8.28%;left:70.4%;top:-6%;}
	section#recruit div.recruit_parts span.rec_r_bg02{width:3.04%;left:64%;top:84.4%;}
	section#recruit div.recruit_parts span.rec_r_bg03{width:2.5%;left:95.4%;top:8.7%;}
	section#recruit div.recruit_parts span.rec_r_bg04{width:5.82%;left:98%;top:3.4%;}
	section#recruit div.recruit_parts span.rec_r_bg05{width:4.15%;left:98%;top:18%;}
	section#recruit div.recruit_parts span.rec_r_bg06{width:3.43%;left:92.8%;top:78.5%;}
	section#recruit div.recruit_parts span.rec_r_bg07{width:9.31%;left:88.3%;top:90.5%;}
	section#recruit div.recruit_parts span.rec_l_illust01{width:15.49%;left:16.8%;top:10.7%;}
	section#recruit div.recruit_parts span.rec_l_illust02{width:27.08%;left:-.1%;top:39.9%;}
	section#recruit div.recruit_parts span.rec_r_illust01{width:25.63%;left:76.2%;top:10.7%;}
	section#recruit div.recruit_parts span.rec_r_illust02{width:12.36%;left:67.1%;top:52.2%;}
	
	section#recruit div.section_inner{
		width: 382px;
		text-align: center;
		position: relative;
		z-index: 1;
	}
	
	section#recruit div.section_inner p{
		font-size: 1.6rem;
		line-height: 2;
		margin-top: 3.2rem;
	}

	section#recruit div.section_inner p.coming_soon{
		margin-top: 38px;
		font-size: 1.8rem;
		font-weight: 500;
		line-height: 1;
	}
	
	section#recruit div.section_inner a{
		width: 284px;
		height: 58px;
		padding-left: 50px;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		margin: 38px auto 0;
		font-size: 1.8rem;
		font-weight: 500;
		line-height: 1;
		color: #000;
		border-radius: 60px;
		background: #FFF;
		position: relative;
		transition: background-color .3s ease, color .3s ease;
	}

	section#recruit div.section_inner a:hover{
		background-color: #000;
		color: #FFF;
	}
	
	section#recruit div.section_inner a span.arrow{
		width: 39px;
		display: inline-block;
		position: absolute;
		right: 26px;
		bottom: 28px;
		z-index: 5;
		padding-right: 3px;
	}
	
	section#recruit div.section_inner a span.arrow::before{
		content: "";
		width: 32px;
		height: 1px;
		background: #000;
		display: block;
		transform: scaleX(1);
		transform-origin: right center;
		transition: transform .3s ease, background-color .3s ease;
	}

	section#recruit div.section_inner a:hover span.arrow::before{
		transform: scaleX(0.8);
		background-color: #FFF;
	}
	
	section#recruit div.section_inner a span.arrow i{
		width: 11px;
		line-height: 0;
		display: inline-block;
		position: absolute;
		right: 0;
		bottom: 0;
	}

	section#recruit div.section_inner a span.arrow i img{
		transition: filter .3s ease;
	}

	section#recruit div.section_inner a:hover span.arrow i img{
		filter: brightness(0) invert(1);
	}
	
	section#about {
		padding: 120px 0;
	}
	
	section#about div.section_inner{
		width: 79.37%;
		max-width: 1143px;
		margin: 0 auto;
		padding: 72px 0 62px;
		position: relative;
		z-index: 5;
	}
	
	section#about div.section_inner div.bg1{
		width: 285px;
		line-height: 0;
		position: absolute;
		top: -44px;
		left: -76px;
		z-index: -1;
	}
	
	section#about div.section_inner div.bg2{
		width: 215px;
		line-height: 0;
		position: absolute;
		right: -150px;
		bottom: -13px;
		z-index: -1;
	}
	
	section#about div.section_inner::before,
	section#about div.section_inner::after{
		content: "";
		width: 99%;
		height: 100%;
		display: inline-block;
		border: 1px solid #000;
		position: absolute;
		z-index: 3;
	}
	
	section#about div.section_inner::before {
		top: 0;
		left: 0;
	}
	
	section#about div.section_inner::after {
		top: 9px;
		right: 0;
	}
	
	section#about div.section_inner div.block{
		width: 704px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		position: relative;
		z-index: 10;
	}
	
	section#about div.section_inner div.block h2{
		width: 212px;
	}
	
	section#about div.section_inner div.block div.text_block{
		width: 54%;
	}
	
	section#about div.section_inner div.block div.text_block p {
		font-size: 1.6rem;
		line-height: 2;
		letter-spacing: 2%;
	}
	
	section#about div.section_inner div.block div.text_block div.more_box {
		margin-top: 38px;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	
}

@media screen and (min-width:961px) and (max-width: 1440px){
	
	section#brand div.section_inner{
		padding-left: 3.79%;
	}
	
	section#projects div.section_inner{
		min-height: 41.66cqw;
	}
	
	section#work div.section_inner div.block div.thum{
		left: -4.35cqw;
	}
	
}
	

/*--------------------------------------------------------
　SP
--------------------------------------------------------*/

@media screen and (max-width: 960px){
	
	header {
		background: none;
	}
	
	main section h2 {
		font-family: YakuHanJP, "Libre Franklin";
		font-size: var(--f36);
		font-weight: 500;
		line-height: 1;
	}
	
	main section h2 small{
		font-family: YakuHanJP, "Zen Kaku Gothic New", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
		font-size: var(--f13);
		font-weight: 400;
		display: block;
		margin-top: 1em;
	}
	
	main section a.more {
		width: clamp(calc(118px * 0.96), calc(118 * var(--scale)), calc(118px * 2.56));
		font-size: var(--f15);
		line-height: 1;
		color: #000;
		display: block;
		position: relative;
	}
	
	main section a.more span.arrow_more {
		display: inline-block;
	}
	
	main section a.more span.arrow{
		width: clamp(calc(63px * 0.96), calc(63 * var(--scale)), calc(63px * 2.56));
		display: inline-block;
		padding-right: clamp(calc(3px * 0.96), calc(3 * var(--scale)), calc(3px * 2.56));
		position: absolute;
		bottom: 0;
		right: 0;
	}
	
	main section a.more span.arrow::before{
		content: "";
		width: clamp(calc(60px * 0.96), calc(60 * var(--scale)), calc(60px * 2.56));
		height: 1px;
		background: #000;
		display: block;
		transform-origin: right center;
	}
	
	main section a.more span.arrow i{
		width: clamp(calc(20px * 0.96), calc(20 * var(--scale)), calc(20px * 2.56));
		line-height: 0;
		display: inline-block;
		position: absolute;
		right: 0;
		bottom: -0.5px;
	}
	
	
	
	
	
	
	
	section#since{
		width: 100%;
		height: 100svh;
		min-height: 69.33cqw;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	
	section#since div.section_inner{
		width: 90%;
		margin: 0 auto;
	}
	
	section#since div.section_inner figure {
		width: 47.1%;
		margin: 0 auto;
		line-height: 0;
	}
	
	section#since div.section_inner div.text_block {
		text-align: center;
		margin-top: clamp(calc(40px * 0.96), calc(40 * var(--scale)), calc(40px * 2.56));
	}
	
	section#since div.section_inner div.text_block h3{
		display: inline-block;
		font-family: YakuHanJP, "Libre Franklin";
		font-size: 2.0rem;
		font-weight: 400;
		line-height: 1;
		letter-spacing: 10%;
		border-bottom: 1px solid #000;
	}
	
	section#since div.section_inner div.text_block p{
		font-size: var(--f14);
		line-height: 1.8;
		letter-spacing: 2%;
		margin-top: 1.5em;
	}
	
	section#future{
		width: 100%;
	}
	
	section#future div.section_inner{
		width: 90%;
		margin: 0 auto;
		padding: clamp(calc(40px * 0.96), calc(40 * var(--scale)), calc(40px * 2.56)) 0 clamp(calc(70px * 0.96), calc(70 * var(--scale)), calc(70px * 2.56));
		position: relative;
	}
	
	section#future div.section_inner div.bg1{
		width: 22%;
		line-height: 0;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
	}
	
	section#future div.section_inner div.bg2{
		width: 39%;
		position: absolute;
		bottom: clamp(calc(20px * 0.96), calc(20 * var(--scale)), calc(20px * 2.56));
		right: -5cqw;
		z-index: -1;
	}
	
	section#future div.section_inner div.img{
		width: 88%;
		line-height: 0;
		position: absolute;
		top: 37cqw;
		left: 6%;
		z-index: -1;
	}
	
	section#future div.section_inner div.block{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		position: relative;
	}
	
	section#future div.section_inner div.block div.block_l{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	
	section#future div.section_inner div.block div.block_l h3{
		font-size: var(--f25);
		font-weight: 500;
		line-height: 1.5;
		letter-spacing: 5%;
	}
	
	section#future div.section_inner div.block div.block_l h3 small{
		display: block;
		font-family: YakuHanJP, "Libre Franklin";
		font-size: var(--f10);
		font-weight: 400;
		line-height: 1.7;
		letter-spacing: 10%;
		margin-top: 1em;
	}
	
	section#future div.section_inner div.block div.block_r{
		width: 100%;
		margin-top: 49.6cqw;
	}
	
	section#future div.section_inner div.block div.block_r p{
		font-size: var(--f14);
		line-height: 1.8;
		letter-spacing: 2%;
	}
	
	section#brand {
		width: 100%;
		background: rgba(215,215,222,0);
	}
	
	section#brand div.section_inner{
		width: 90%;
		margin: 0 auto;
		padding: clamp(calc(70px * 0.96), calc(70 * var(--scale)), calc(70px * 2.56)) 0;
		position: relative;
	}
	
	section#brand div.section_inner div.bg1{
		width: 18.5%;
		line-height: 0;
		position: absolute;
		top: 38.2cqw;
		left: -5cqw;
		z-index: 0;
		transform: rotate(-6.8deg);
	}
	
	section#brand div.section_inner div.bg2{
		width: 34.3%;
		position: absolute;
		top: 0;
		left: 38.8%;
		z-index: 0;
	}
	
	section#brand div.section_inner div.text_block{
		width: 100%;
		position: relative;
		z-index: 5;
	}
	
	section#brand div.section_inner div.text_block p{
		font-size: var(--f14);
		line-height: 1.8;
		letter-spacing: 2%;
		margin-top: 2em;
	}
	
	section#brand div.section_inner div.text_block div.more_box {
		margin-top: clamp(calc(36px * 0.96), calc(36 * var(--scale)), calc(36px * 2.56));
	}
	
	section#brand div.section_inner div.img_block{
		width: 100%;
		position: relative;
		line-height: 0;
		margin-top: clamp(calc(11px * 0.96), calc(11 * var(--scale)), calc(11px * 2.56));
	}
	
	section#projects {}
	
	section#projects div.section_inner{
		width: 90%;
		margin: 0 auto;
		padding-top: 18.9cqw;
		position: relative;
	}
	
	section#projects div.section_inner div.bg1{
		width: 27.7%;
		line-height: 0;
		position: absolute;
		top: 0;
		left: -5cqw;
		z-index: -1;
	}
	
	section#projects div.section_inner div.bg2{
		width: 24.4%;
		position: absolute;
		top: 19.7cqw;
		left: 43.8%;
		z-index: -1;
	}
	
	section#projects div.section_inner div.block{
		width: 100%;
	}
	
	section#projects div.section_inner div.block div.thum{
		width: 105.9%;
		height: 75.7cqw;
		line-height: 0;
		overflow: hidden;
		margin-left: -5cqw;
		margin-top: clamp(calc(30px * 0.96), calc(30 * var(--scale)), calc(30px * 2.56));
	}
	
	section#projects div.section_inner div.block div.thum img{
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center center;
	}
	
	section#projects div.section_inner div.block h3{
		font-size: var(--f21);
		font-weight: 500;
		line-height: 1.5;
		letter-spacing: 2%;
		margin-top: 1em;
		margin-bottom: 0.5em;
	}
	
	section#projects div.section_inner div.block ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 0 clamp(calc(10px * 0.96), calc(10 * var(--scale)), calc(10px * 2.56));
		margin-bottom: clamp(calc(12px * 0.96), calc(12 * var(--scale)), calc(12px * 2.56));
	}
	
	section#projects div.section_inner div.block ul li{
		display: inline-block;
		margin-bottom: clamp(calc(8px * 0.96), calc(8 * var(--scale)), calc(8px * 2.56));
		font-size: var(--f13);
		line-height: 1;
		border: 1px solid #D7D7DE;
		border-radius: 60px;
		padding: clamp(calc(6px * 0.96), calc(6 * var(--scale)), calc(6px * 2.56)) clamp(calc(10px * 0.96), calc(10 * var(--scale)), calc(10px * 2.56));
		background: #EDEDEF;
	}
	
	section#projects div.section_inner div.block p{
		font-size: var(--f14);
		line-height: 1.8;
		letter-spacing: 2%;
	}
	
	section#projects div.section_inner div.block p + p{
		margin-top: 0;
	}
	
	section#projects div.section_inner div.block dl.credit{
		margin-top: clamp(calc(24px * 0.96), calc(24 * var(--scale)), calc(24px * 2.56));
	}
	
	section#projects div.section_inner div.block dl.credit dt{
		font-size: var(--f14);
		display: inline-block;
		padding-bottom: 0.15em;
		border-bottom: 1px solid #000;
		margin-bottom: 0.5em;
		padding-right: 2em;
		position: relative;
		cursor: pointer;
	}
	
	section#projects div.section_inner div.block dl.credit dt span{
		width: clamp(calc(14px * 0.96), calc(14 * var(--scale)), calc(14px * 2.56));
		height: clamp(calc(14px * 0.96), calc(14 * var(--scale)), calc(14px * 2.56));
		display: block;
		position: absolute;
		top: clamp(calc(4px * 0.96), calc(4 * var(--scale)), calc(4px * 2.56));
		right: 0;
	}
	
	section#projects div.section_inner div.block dl.credit dt span::before{
		content: "";
		width: clamp(calc(14px * 0.96), calc(14 * var(--scale)), calc(14px * 2.56));
		height: 1px;
		background: #000;
		position: absolute;
		top: clamp(calc(7px * 0.96), calc(7 * var(--scale)), calc(7px * 2.56));
		right: 0;
	}
	
	section#projects div.section_inner div.block dl.credit dt span::after{
		content: "";
		width: 1px;
		height: clamp(calc(14px * 0.96), calc(14 * var(--scale)), calc(14px * 2.56));
		background: #000;
		position: absolute;
		top: 0;
		right: clamp(calc(7px * 0.96), calc(7 * var(--scale)), calc(7px * 2.56));
		opacity: 1;
        transform: rotate(0deg);
        transform-origin: center;
        transition: transform 0.35s ease, opacity 0.35s ease;
	}
	
	section#projects div.section_inner div.block dl.credit dt.ac span::after{
        opacity: 0;
        transform: rotate(90deg);
    }
	
	section#projects div.section_inner div.block dl.credit dd{
		width: 100%;
		font-size: var(--f14);
		line-height: 1.8;
		padding-left: 0.5em;
		display: none;
	}
	
	section#projects div.section_inner div.block dl.credit dd p{
		line-height: 1.5;
		margin-top: 0;
	}
	
	section#projects div.section_inner div.block dl.credit dd p + p{
		margin-top: clamp(calc(4px * 0.96), calc(4 * var(--scale)), calc(4px * 2.56));
	}
	
	section#projects div.section_inner div.block dl.credit dd a{
		color: #000;
	}
	
	section#projects div.section_inner div.block div.more_box {
		margin-top: clamp(calc(20px * 0.96), calc(20 * var(--scale)), calc(20px * 2.56));
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	
	section#work {
		margin-top: clamp(calc(40px * 0.96), calc(40 * var(--scale)), calc(40px * 2.56));
	}
	
	section#work div.section_inner{
		width: 90%;
		margin: 0 auto;
		padding-top: 14.66cqw;
		position: relative;
	}
	
	section#work div.section_inner div.bg1{
		width: 32.5%;
		line-height: 0;
		position: absolute;
		top: 0;
		left: 27.4%;
		z-index: -1;
	}
	
	section#work div.section_inner div.bg2{
		width: 14.9%;
		position: absolute;
		top: 24cqw;
		left: 20%;
		z-index: -1;
	}
	
	section#work div.section_inner h2{
		margin-left: 0;
	}
	
	section#work div.section_inner ul.list{
		width: 100%;
		margin: clamp(calc(30px * 0.96), calc(30 * var(--scale)), calc(30px * 2.56)) 0; auto 0;
		display: flex;
		flex-wrap: wrap;
		gap: clamp(calc(34px * 0.96), calc(34 * var(--scale)), calc(34px * 2.56)) 0;
	}
	
	section#work div.section_inner ul.list li{
		width: 100%;
	}
	
	section#work div.section_inner ul.list li a{
		display: block;
		color: #000;
	}
	
	section#work div.section_inner ul.list li a div.thum{
		width: 100%;
		height: 63.4cqw;
		line-height: 0;
		overflow: hidden;
		margin-bottom: clamp(calc(15px * 0.96), calc(15 * var(--scale)), calc(15px * 2.56));
		border: 1px solid #D7D7DE;
	}
	
	section#work div.section_inner ul.list li a div.thum img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	
	section#work div.section_inner ul.list li a ul.cate{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 14px;
	}
	
	section#work div.section_inner ul.list li a ul.cate li{
		width: auto;
		display: inline-block;
		border: 1px solid #D7D7DE;
		border-radius:  clamp(calc(60px * 0.96), calc(60 * var(--scale)), calc(60px * 2.56));
		padding: clamp(calc(6px * 0.96), calc(6 * var(--scale)), calc(6px * 2.56)) clamp(calc(10px * 0.96), calc(10 * var(--scale)), calc(10px * 2.56)) clamp(calc(8px * 0.96), calc(8 * var(--scale)), calc(8px * 2.56));
		font-size: var(--f13);
		line-height: 1;
		color: #000;
		background: #EDEDEF;
	}
	
	section#work div.section_inner ul.list li a h3{
		font-size: var(--f15);
		font-weight: 700;
		line-height: 1.5;
		margin-top: clamp(calc(15px * 0.96), calc(15 * var(--scale)), calc(15px * 2.56));
	}
	
	section#work div.section_inner div.more_box {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		margin-top: clamp(calc(34px * 0.96), calc(34 * var(--scale)), calc(34px * 2.56));
	}
	
	section#news {
		
	}
	
	section#news div.section_inner{
		width: 90%;
		margin: 0 auto;
		padding-top: clamp(calc(68px * 0.96), calc(68 * var(--scale)), calc(68px * 2.56));
		position: relative;
	}
	
	section#news div.section_inner div.bg1{
		width: 29.8%;
		line-height: 0;
		position: absolute;
		top: 0;
		left: -5cqw;
		z-index: -1;
	}
	
	section#news div.section_inner div.bg2{
		width: 19.1%;
		position: absolute;
		top: 17.3cqw;
		left: 32%;
		z-index: -1;
	}
	
	section#news div.section_inner h2{
		width: 100%;
	}
	
	section#news div.section_inner div.inner_l{
		width: 100%;
		margin-top: clamp(calc(24px * 0.96), calc(24 * var(--scale)), calc(24px * 2.56));
	}
	
	section#news div.section_inner div.inner_l ul.list{
		border-top: 1px solid #D7D7DE;
	}
	
	section#news div.section_inner div.inner_l ul.list li{
		width: 100%;
		border-bottom: 1px solid #D7D7DE;
	}
	
	section#news div.section_inner div.inner_l ul.list li a{
		width: 100%;
		padding: clamp(calc(20px * 0.96), calc(20 * var(--scale)), calc(20px * 2.56)) 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		color: #000;
	}
	
	section#news div.section_inner div.inner_l ul.list li a div{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: clamp(calc(13px * 0.96), calc(13 * var(--scale)), calc(13px * 2.56));
	}
	
	section#news div.section_inner div.inner_l ul.list li a div time,
	div.head_block div.head_box div time {
		width: clamp(calc(95px * 0.96), calc(95 * var(--scale)), calc(95px * 2.56));
		font-family: YakuHanJP, "Libre Franklin";
		font-size: var(--f15);
		line-height: 1;
	}
	
	section#news div.section_inner div.inner_l ul.list li a div p.cate,
	div.head_block div.head_box div p.cate {
		display: inline-block;
		padding: clamp(calc(6px * 0.96), calc(6 * var(--scale)), calc(6px * 2.56)) clamp(calc(1px * 0.96), calc(10 * var(--scale)), calc(10px * 2.56));
		font-size: var(--f13);
		line-height: 1;
		border: 1px solid #000;
		border-radius: clamp(calc(60px * 0.96), calc(60 * var(--scale)), calc(60px * 2.56));
		text-align: center;
	}
	
	section#news div.section_inner div.inner_l ul.list li a h3{
		font-size: var(--f15);
		font-weight: 500;
		line-height: 1.5;
	}
	
	section#news div.section_inner div.inner_l div.more_box {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		margin-top: clamp(calc(30px * 0.96), calc(30 * var(--scale)), calc(30px * 2.56));
	}
	
	section#recruit {
		margin-top: clamp(calc(40px * 0.96), calc(40 * var(--scale)), calc(40px * 2.56));
		height: 81cqw;
		background: #DADAE0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		position: relative;
		overflow: hidden;
	}

	section#recruit div.recruit_parts{
		width: 100%;
		aspect-ratio: 1500 / 1216;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		pointer-events: none;
	}

	section#recruit div.recruit_parts span.rec_part{
		display: block;
		position: absolute;
		line-height: 0;
	}

	section#recruit div.recruit_parts span.rec_part img{
		width: 100%;
		height: auto;
	}

	section#recruit div.recruit_parts span.rec_l_bg01{width:6.879%;left:5.353%;top:40.88%;transform:rotate(-1deg);}
	section#recruit div.recruit_parts span.rec_l_bg02{width:5.292%;left:.52%;top:49.753%;}
	section#recruit div.recruit_parts span.rec_l_bg03{display:none;}
	section#recruit div.recruit_parts span.rec_l_bg04{width:13.107%;left:1.867%;top:7.566%;}
	section#recruit div.recruit_parts span.rec_l_bg05{width:4.416%;left:4.155%;top:92.736%;transform:rotate(-76deg);}
	section#recruit div.recruit_parts span.rec_l_bg06{width:6.3%;left:-3.2%;top:93.2%;transform:rotate(70deg);}
	section#recruit div.recruit_parts span.rec_r_bg01{width:8%;left:90%;top:-3.6%;transform:rotate(150deg);}
	section#recruit div.recruit_parts span.rec_r_bg02{display:none;}
	section#recruit div.recruit_parts span.rec_r_bg03{width:4.078%;left:90.133%;top:41.447%;}
	section#recruit div.recruit_parts span.rec_r_bg04{width:9.5%;left:94.2%;top:38.4%;}
	section#recruit div.recruit_parts span.rec_r_bg05{width:6.7%;left:94.933%;top:46.1%;}
	section#recruit div.recruit_parts span.rec_r_bg06{width:5.4%;left:77.8%;top:95.3%;transform:rotate(-50deg);}
	section#recruit div.recruit_parts span.rec_r_bg07{width:11.01%;left:64.778%;top:90.464%;transform:rotate(-38deg);}
	section#recruit div.recruit_parts span.rec_l_illust01{width:30.082%;left:4.206%;top:3.58%;transform:rotate(-50deg);}
	section#recruit div.recruit_parts span.rec_l_illust02{width:32.643%;left:-.368%;top:69.012%;transform:rotate(39deg);}
	section#recruit div.recruit_parts span.rec_r_illust01{width:34.8%;left:66.13%;top:2.06%;}
	section#recruit div.recruit_parts span.rec_r_illust02{width:23.383%;left:76.711%;top:64.498%;transform:rotate(13deg);}
	
	section#recruit div.section_inner{
		width: 85.8%;
		text-align: center;
		position: relative;
		z-index: 1;
	}
	
	section#recruit div.section_inner p{
		font-size: var(--f14);
		line-height: 1.8;
		margin-top: 2.8rem;
	}

	section#recruit div.section_inner p.coming_soon{
		margin-top: clamp(calc(18px * 0.96), calc(18 * var(--scale)), calc(18px * 2.56));
		font-size: var(--f17);
		font-weight: 500;
		line-height: 1;
	}
	
	section#recruit div.section_inner a{
		width: 85%;
		height: clamp(calc(48px * 0.96), calc(48 * var(--scale)), calc(48px * 2.56));
		padding-left: clamp(calc(48px * 0.96), calc(48 * var(--scale)), calc(48px * 2.56));
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		margin: clamp(calc(18px * 0.96), calc(18 * var(--scale)), calc(18px * 2.56)) auto 0;
		font-size: var(--f17);
		font-weight: 500;
		line-height: 1;
		color: #000;
		border-radius: clamp(calc(60px * 0.96), calc(60 * var(--scale)), calc(60px * 2.56));
		background: #FFF;
		position: relative;
	}
	
	section#recruit div.section_inner a span.arrow{
		width: clamp(calc(45px * 0.96), calc(45 * var(--scale)), calc(45px * 2.56));
		display: inline-block;
		position: absolute;
		right: clamp(calc(30px * 0.96), calc(30 * var(--scale)), calc(30px * 2.56));
		bottom: clamp(calc(20px * 0.96), calc(20 * var(--scale)), calc(20px * 2.56));
		z-index: 5;
		padding-right: clamp(calc(3px * 0.96), calc(3 * var(--scale)), calc(3px * 2.56));
	}
	
	section#recruit div.section_inner a span.arrow::before{
		content: "";
		width: clamp(calc(40px * 0.96), calc(40 * var(--scale)), calc(40px * 2.56));
		height: 1px;
		background: #000;
		display: block;
		transform-origin: right center;
	}
	
	section#recruit div.section_inner a span.arrow i{
		width: clamp(calc(17px * 0.96), calc(17 * var(--scale)), calc(17px * 2.56));
		line-height: 0;
		display: inline-block;
		position: absolute;
		right: 0;
		bottom: 0;
	}
	
	section#about {
		padding: 19.7cqw 0 14.4cqw;
	}
	
	section#about div.section_inner{
		width: 87.46%;
		margin: 0 auto;
		padding: 11.7cqw 0 10.1cqw;
		position: relative;
		z-index: 5;
	}
	
	section#about div.section_inner div.bg1{
		width: 39.5%;
		line-height: 0;
		position: absolute;
		top: -15.8cqw;
		left: -5.3cqw;
		z-index: -1;
		transform: rotate(9.3deg);
	}
	
	section#about div.section_inner div.bg2{
		width: 33%;
		line-height: 0;
		position: absolute;
		right: -5.4%;
		bottom: -9.8cqw;
		z-index: -1;
	}
	
	section#about div.section_inner::before,
	section#about div.section_inner::after{
		content: "";
		width: 97.66%;
		height: 100%;
		display: inline-block;
		border: 1px solid #000;
		position: absolute;
		z-index: 3;
	}
	
	section#about div.section_inner::before {
		top: 0;
		left: 0;
	}
	
	section#about div.section_inner::after {
		top: clamp(calc(8px * 0.96), calc(8 * var(--scale)), calc(8px * 2.56));
		right: 0;
	}
	
	section#about div.section_inner div.block{
		width: 75.9%;
		margin: 0 auto;
		position: relative;
		z-index: 10;
	}
	
	section#about div.section_inner div.block div.text_block{
		width: 100%;
	}
	
	section#about div.section_inner div.block div.text_block p {
		font-size: var(--f14);
		line-height: 1.8;
		letter-spacing: 2%;
	}
	
	section#about div.section_inner div.block div.text_block div.more_box {
		margin-top: clamp(calc(26px * 0.96), calc(26 * var(--scale)), calc(26px * 2.56));
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	
}

/* Section decorative background animations */
section#brand div.section_inner div.bg1 img,
section#brand div.section_inner div.bg2 img,
section#projects div.section_inner div.bg1 img,
section#projects div.section_inner div.bg2 img,
section#work div.section_inner div.bg1 img,
section#work div.section_inner div.bg2 img,
section#news div.section_inner div.bg1 img,
section#news div.section_inner div.bg2 img {
	opacity: 0;
	transition: opacity .9s ease, transform .9s ease;
}

section#brand div.section_inner div.bg1 img,
section#work div.section_inner div.bg2 img {
	transform: translate(-28px, 28px);
}

section#brand div.section_inner div.bg2 img,
section#work div.section_inner div.bg1 img,
section#projects div.section_inner div.bg2 img,
section#news div.section_inner div.bg2 img {
	transform: translate(28px, -28px);
}

section#projects div.section_inner div.bg1 img,
section#news div.section_inner div.bg1 img {
	transform: translate(-28px, -28px);
}

section#brand.is-bg-anim div.section_inner div.bg1 img,
section#brand.is-bg-anim div.section_inner div.bg2 img,
section#projects.is-bg-anim div.section_inner div.bg1 img,
section#projects.is-bg-anim div.section_inner div.bg2 img,
section#work.is-bg-anim div.section_inner div.bg1 img,
section#work.is-bg-anim div.section_inner div.bg2 img,
section#news.is-bg-anim div.section_inner div.bg1 img,
section#news.is-bg-anim div.section_inner div.bg2 img {
	opacity: 1;
	transform: translate(0, 0);
}

section#brand.is-bg-anim div.section_inner div.bg2 img,
section#projects.is-bg-anim div.section_inner div.bg2 img,
section#work.is-bg-anim div.section_inner div.bg2 img,
section#news.is-bg-anim div.section_inner div.bg2 img {
	transition-delay: .16s;
}

/* About us scroll animation */
section#about div.section_inner::before,
section#about div.section_inner::after {
	border: 0;
	background-image:
		linear-gradient(#000, #000),
		linear-gradient(#000, #000),
		linear-gradient(#000, #000),
		linear-gradient(#000, #000);
	background-position: left top, right top, right bottom, left bottom;
	background-repeat: no-repeat;
	background-size: 0 1px, 1px 0, 0 1px, 1px 0;
}

section#about div.section_inner div.block h2,
section#about div.section_inner div.block div.text_block p,
section#about div.section_inner div.block div.text_block a {
	opacity: 0;
}

section#about div.section_inner div.bg1 img,
section#about div.section_inner div.bg2 img {
	opacity: 0;
}

section#about.is_anim div.section_inner::before {
	animation: about-line-draw 1.1s ease-in-out forwards;
}

section#about.is_anim div.section_inner::after {
	background-position: right top, right bottom, left bottom, left top;
	animation: about-line-draw-reverse 1.1s .12s ease-in-out forwards;
}

section#about.is_anim div.section_inner div.block h2,
section#about.is_anim div.section_inner div.block div.text_block p,
section#about.is_anim div.section_inner div.block div.text_block a {
	animation: about-text-in .8s .18s ease-out forwards;
}

section#about.is_anim div.section_inner div.block div.text_block p {
	animation-delay: .3s;
}

section#about.is_anim div.section_inner div.block div.text_block a {
	animation-delay: .42s;
}

section#about.is_anim div.section_inner div.bg1 img {
	animation: about-bg-left-in .9s 1.15s ease-out forwards;
}

section#about.is_anim div.section_inner div.bg2 img {
	animation: about-bg-right-in .9s 1.32s ease-out forwards;
}

@keyframes about-line-draw {
	0% { background-size: 0 1px, 1px 0, 0 1px, 1px 0; }
	25% { background-size: 100% 1px, 1px 0, 0 1px, 1px 0; }
	50% { background-size: 100% 1px, 1px 100%, 0 1px, 1px 0; }
	75% { background-size: 100% 1px, 1px 100%, 100% 1px, 1px 0; }
	100% { background-size: 100% 1px, 1px 100%, 100% 1px, 1px 100%; }
}

@keyframes about-line-draw-reverse {
	0% { background-size: 0 1px, 1px 0, 0 1px, 1px 0; }
	25% { background-size: 0 1px, 1px 0, 0 1px, 1px 100%; }
	50% { background-size: 0 1px, 1px 0, 100% 1px, 1px 100%; }
	75% { background-size: 0 1px, 1px 100%, 100% 1px, 1px 100%; }
	100% { background-size: 100% 1px, 1px 100%, 100% 1px, 1px 100%; }
}

@keyframes about-text-in {
	to {
		opacity: 1;
	}
}

@keyframes about-bg-left-in {
	from {
		opacity: 0;
		transform: translate(-28px, -28px);
	}
	to {
		opacity: 1;
		transform: translate(0, 0);
	}
}

@keyframes about-bg-right-in {
	from {
		opacity: 0;
		transform: translate(28px, 28px);
	}
	to {
		opacity: 1;
		transform: translate(0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	section#brand div.section_inner div.bg1 img,
	section#brand div.section_inner div.bg2 img,
	section#projects div.section_inner div.bg1 img,
	section#projects div.section_inner div.bg2 img,
	section#work div.section_inner div.bg1 img,
	section#work div.section_inner div.bg2 img,
	section#news div.section_inner div.bg1 img,
	section#news div.section_inner div.bg2 img {
		opacity: 1;
		transform: none;
		transition: none;
	}

	section#about div.section_inner::before,
	section#about div.section_inner::after {
		background-size: 100% 1px, 1px 100%, 100% 1px, 1px 100%;
		animation: none;
	}

	section#about div.section_inner div.block h2,
	section#about div.section_inner div.block div.text_block p,
	section#about div.section_inner div.block div.text_block a,
	section#about div.section_inner div.bg1 img,
	section#about div.section_inner div.bg2 img {
		opacity: 1;
		transform: none;
		animation: none;
	}
}

/* Recruitment: fade the background and content together; float each image
   inside its positioned span to preserve the PC/SP layout and rotation. */
section#recruit {
	background: transparent;
	isolation: isolate;
}

section#recruit::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #DADAE0;
	pointer-events: none;
	z-index: -1;
}

section#recruit::before,
section#recruit div.section_inner > h2,
section#recruit div.section_inner > p,
section#recruit div.section_inner > a,
section#recruit div.recruit_parts span.rec_part {
	opacity: 0;
	transition: opacity 1.4s ease;
}

section#recruit.is-bg-anim::before,
section#recruit.is-bg-anim div.section_inner > h2,
section#recruit.is-bg-anim div.section_inner > p,
section#recruit.is-bg-anim div.section_inner > a,
section#recruit.is-bg-anim div.recruit_parts span.rec_part {
	opacity: 1;
}

section#recruit div.recruit_parts span.rec_part {
	transition-delay: .4s;
}

/* Retain the future recruitment link's hover transitions. */
section#recruit div.section_inner > a {
	transition: opacity 1.4s ease, background-color .3s ease, color .3s ease;
}

section#recruit div.recruit_parts span.rec_part img {
	--float-x: 3px;
	--float-y: -6px;
	--float-angle: 1deg;
	--float-duration: 7s;
	--float-delay: 0s;
}

section#recruit div.recruit_parts span.rec_part:nth-child(2n) img {
	--float-x: -4px;
	--float-y: 5px;
	--float-angle: -1deg;
	--float-duration: 8.5s;
}

section#recruit div.recruit_parts span.rec_part:nth-child(3n) img {
	--float-duration: 9.5s;
	--float-delay: .3s;
}

section#recruit div.recruit_parts span.rec_part:nth-child(3n + 1) img {
	--float-delay: .6s;
}

section#recruit.is-bg-anim div.recruit_parts span.rec_part img {
	animation: recruit-float var(--float-duration) ease-in-out var(--float-delay) infinite;
}

@keyframes recruit-float {
	0%, 100% { transform: translate(0, 0) rotate(0deg); }
	50% { transform: translate(var(--float-x), var(--float-y)) rotate(var(--float-angle)); }
}

@media (prefers-reduced-motion: reduce) {
	section#recruit::before,
	section#recruit div.section_inner > h2,
	section#recruit div.section_inner > p,
	section#recruit div.section_inner > a,
	section#recruit div.recruit_parts span.rec_part {
		opacity: 1;
		transition: none;
	}

	section#recruit.is-bg-anim div.recruit_parts span.rec_part img {
		animation: none;
	}
}

section#brand.is_anim {
	background: rgba(215,215,222,1);
}