@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* BASE */
.font-en {
	font-family: "sofia-pro","sans-serif";
	font-weight: bold;
	letter-spacing: 0.05em;
}

h1.font-en {
	letter-spacing: .13em;
	line-height: 1.2;
}

p {
	letter-spacing: 0.05rem;
}

.l-content {
    margin: 0 auto;
}

/* HEADER */
.c-gnav>.menu-item>a .ttl {
    font-family: "sofia-pro","sans-serif";
    font-weight: 700;
    letter-spacing: .15em;
}

/* TOP */
.mv {
	position: relative;
	height: calc(100vh - 72px);
}

.mv .l-container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.p-mainVisual__slideTitle {
	font-family: "sofia-pro","sans-serif";
	font-weight: bold;
	letter-spacing: .05em;
	font-size: 60px;
	line-height: 1.2;
}

.p-mainVisual__imgLayer {
	display: none;
}

.p-mainVisual .c-filterLayer::before {
	background-color: #fff;
	opacity: 1;
}

.p-mainVisual__slideText {
	letter-spacing: .05em;
}

.p-mainVisual__scroll{
	position:absolute;
	bottom:10px;
	left:50%;
}

.p-mainVisual__scroll svg {
	display: none;
}

.p-mainVisual__scrollLabel{
	position: absolute;
	left:10px;
	bottom:10px;
	color: #222;
	font-size: 0.7rem;
	letter-spacing: 0.05em;
	-ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}

.p-mainVisual__scroll:before {
    content: "";
    position: absolute;
    bottom:0;
    left:-4px;
	width:10px;
	height:10px;
	border-radius: 50%;
	background:#222;
	animation:
		circlemove 1.6s ease-in-out infinite,
		cirlemovehide 1.6s ease-out infinite;
}

@keyframes circlemove{
      0%{bottom:45px;}
     100%{bottom:-5px;}
 }

@keyframes cirlemovehide{
      0%{opacity:0}
     50%{opacity:1;}
    80%{opacity:0.9;}
	100%{opacity:0;}
 }

.p-mainVisual__scroll:after{
	content:"";
	position: absolute;
	bottom:0;
	left:0;
	width:2px;
	height: 50px;
	background:#333;
}


/* WORKS */
.works__card a:hover {
	background-color: rgba(0, 0, 0, 0.3);
	transition: transform .6s ease;
}

.works__card .c-bannerLink__title {
	opacity: 0;
	text-transform: uppercase;
}

.works__card a:hover .c-bannerLink__title {
	opacity: 1;
}

.works__card .swell-block-bannerLink img {
	transition: transform .6s ease;
}

.works__link__text {
	font-family: "sofia-pro","sans-serif";
	letter-spacing: .05em;
	font-size: 14px;
}

/* ABOUT */
.career__table td:first-child {
	width: 15%;
	padding-left: 0;
}

.career__table table td {
	border: 0;
}

/* SUB PAGE */
body:not(.home) .l-content {
	padding-top: 0;
}

.l-mainContent__inner>.post_content {
	margin-top: 0;
}

/* WORKS PAGE */
.works__img__title {
	position: relative;
	padding-left: 1em;
}

.works__img__title::before {
	content: "";
    width: 0.8em;
    height: 1px;
    background-color: #333;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.btn__link {
	margin: 0;
}

.basictext {
	width: 39%;
	margin: 0 auto;
}

@media screen and (max-width: 767px) {
	.p-mainVisual__slideTitle {
		font-size: 30px;
	}
	
	.career__table table td {
		padding: 1em 0 0 0;
	}
	
	.career__table table td:nth-child(2) {
		padding: 10px 0 1em 0;
	}
	
	/* 	works */
	
	#content .works__img__box {
		gap: 2.5% !important;
	}

	#content .works__pc {
		flex-basis: 74% !important;
	}

	#content .works__sp {
		flex-basis: 23.5% !important;
	}
	
	.basictext, .btn__link a {
		width: 80%;
		margin: 0 auto;
	}
}