/*--------------------------------------------------*/
/* 基本 */
/*--------------------------------------------------*/

/*--------------------------------------------------
フォント補足
----------------------------------------------------

【基本のフォント】Yuji Syuku


--------------------------------------------------*/

body {
	color: #FFF;
	font-family: 'Yuji Syuku', serif;
	font-weight: 400;
	font-size: 16px;
	font-feature-settings: 'palt';
}

a, a:hover {
	color: #FFF;
	text-decoration: none;
}
a:focus,
button:focus {
	outline: 0;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	color: #FFF;
	line-height: 1.6;
}
.bg-paper, .bg-paper h1, .bg-paper h2, .bg-paper h3, .bg-paper h4, .bg-paper h5, .bg-paper h6, .bg-paper .h1, .bg-paper .h2, .bg-paper .h3, .bg-paper .h4, .bg-paper .h5, .bg-paper .h6 {
	color: #000;
}
dl, dt, dd {
	margin: 0;
	font-weight: 400;
}
.wrapper {
	padding: 0;
}

.container {
	max-width:  1380px;
	padding-left: 100px;
	padding-right: 100px;
}
.container.container-xs {
	max-width: 830px;
}
.container.container-s {
	max-width: 860px;
}
.container.container-m {
	max-width: 1180px;
}
.container.container-l {
	max-width: 1400px;
}

.bg-paper {
  background-size: cover;
  background-position: center;
	color: #000;
}
.br-pc-only {
  display: block;
}
.br-sp-only {
  display: none;
}
.tate {
  writing-mode: vertical-rl;
}
.text {
  line-height: 1.8;
  margin-bottom: 1.5em;
}
.text-black {
  color: #000 !important;
}
.text-white {
  color: #FFF !important;
}
.text-inner {
  max-width: 412px;
}
.text-inner .text {
  line-height: 2;
}
.text-inner .hasArrow {
  margin-top: 50px;
}
a.hasArrow {
  position: relative;
  display: inline-block;
  padding: 0 90px 0 0;
}
a.hasArrow:before {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  content: "";
  background: url("../img/common/btn-yellow.svg") no-repeat;
  width: 75px;
  height: 75px;
}
a.hasArrow span {
  padding: 8px 0;
  border-bottom: 1px solid #fff;
}
.menu-dl {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.1em;
  gap: 10px;
}
.menu-dl dt {
  flex: 1 0 0;
}
.menu-dl dd {
  flex: 0 0 70px;
  text-align: right;
}
@media (min-width: 768px) {
	a,
	.btn,
	button {
		transition: 0.3s;
	}
	a:hover,
	.btn:hover,
	button:hover {
		opacity: 0.7;
	}
}
@media (max-width:1199px) {
	body.nav-open {
		overflow: hidden;
		position: fixed;
		width: 100%;
		height: 100%;
	}
}
@media (max-width: 991px) {
	.container {
		padding-left: 75px;
		padding-right: 75px;
	}
}
@media (max-width: 767px) {
  body {
    font-size: 15px;
  }
	.container {
		padding-left: 15px;
		padding-right: 15px;
	}
	.row {
		margin-left: -10px;
		margin-right: -10px;
	}
	.row > * {
		padding-left: 10px;
		padding-right: 10px;
	}
  .br-pc-only {
    display: none;
  }
  .br-sp-only {
    display: block;
  }
  .menu-dl {
    font-size: 16px;
  }
  .menu-dl dt {
  }
  .menu-dl dd {
  }
}
@media(min-width:576px){
  .bg-paper {
    background-image: url("../img/common/bg-section-title.jpg");
  }
}
@media(max-width:575px){
  .bg-paper {
    background-image: url("../img/common/bg-section-title-sp.jpg");
  }
  .text-inner {
    width: 100%;
  }
}

/* common css */
.display-sp-only {
  display: none;
}
@media(max-width:767px){
  .display-sp-only {
    display: block;
  }
}
.display-pc-only {
  display: block;
}
@media(max-width:767px){
  .display-pc-only {
    display: none;
  }
}

/*header*/
header {
	position: fixed;
	left: 0;
	right: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 90px;
  background-image: linear-gradient(#161616cc, transparent);
  padding: 0 50px;
	z-index: 100;
}
/*site-name*/
header .site-name {
  width: 150px;
}
header .site-name .logo {
	line-height: 1;
	margin: 0;
}
header .site-name .logo a {
	display: block;
}
header .site-name .logo a img {
	display: block;
}
@media(max-width:1120px){
  header {
    padding: 0 20px;
  }
}
@media(max-width:767px){
  header {
    padding: 0 10px;
  }
}
@media(max-width:575px){

}

/*nav*/
header .nav-wrap {
    color: #ffffff;
}
header .nav-wrap .gnav {}
header .nav-wrap .gnav ul {
	list-style: none;
	padding: 0;
	margin: 0;
	line-height: 1;
}
header .nav-wrap .gnav li {
	padding: 0;
	margin: 0;
}
header .nav-wrap .gnav a,
header .nav-wrap .gnav p {
	display: block;
	color: #ffffff;
	margin: 0;
}
header .nav-wrap .gnav > ul {
	display: flex;
	padding: 0;
	margin: 0;
}
header .nav-wrap .gnav > ul > li {
	padding: 0 14px;
}
header .nav-wrap .gnav > ul > li > a {
	padding: 14px 0;
}
header .nav-wrap .gnav > ul > li > a > span {
  position: relative;
}
header .nav-wrap .gnav > ul > li > a > span::after {
  position: absolute; /*疑似要素を子要素で固定*/
  bottom: 0px; /*下線の始まりの位置 */
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: #fff;
  opacity: 0;
  visibility: hidden; /*下線を非表示*/
  transition: all .3s; /*下線のホバーする速さ*/
}
header .nav-wrap .gnav > ul > li > a:hover > span::after { /*ホバー時に下からフェードイン*/
  opacity: 1;
  animation-name: fadein-bottom; /*アニメーションの名前*/
  animation-duration: .8s; /*下線が戻る速さ*/
  animation-timing-function: ease-out; /*アニメーションの終わりをゆっくり*/
  animation-fill-mode: forwards;/*アニメーションが終わった状態をキープ*/
}
header .nav-wrap .gnav > ul > li > a:hover > span::after {
  bottom: -8px; /*ホバーした時の下線の位置*/
  visibility: visible; /*ホバーしたとき表示*/
}
@media(max-width:991px){
	header .nav-wrap {
		display: none;
	}
}
/* .dropdown-language */
header .dropdown-language .dropdown-toggle {
  display: inline-block;
  width: 105px;
  color: #fff;
  line-height: 1;
  letter-spacing: -0.05em;
  padding: 9px 12px 11px;
  background: rgb(0 0 0 / 0.2);
  backdrop-filter: blur(5px);
  border: 1px solid #fff;
  border-radius: 0;
  transition: 0.3s all;
}
header .dropdown-language .dropdown-toggle::after {
  display: none;
}
header .dropdown-language .dropdown-toggle:hover,
header .dropdown-language .dropdown-toggle:focus {
  border: 1px solid #fff;
}
header .dropdown-language .dropdown-menu {
  display: none;
  color: #fff;
  line-height: 1;
  width: 105px;
  min-width: 105px;
  padding: 0;
  background: rgb(0 0 0 / 0.2);
  backdrop-filter: blur(5px);
  border: 1px solid #fff;
  border-radius: 0;
}
header .dropdown-language .dropdown-menu.show {
  display: block;
  margin-top: 8px !important;
}
header .dropdown-language .dropdown-item {
  color: #fff;
  font-size: 14px;
  padding: 10px 15px;
}
header .dropdown-language .dropdown-item:focus,
header .dropdown-language .dropdown-item:hover {
  color: #fff;
  background-color: rgb(0 0 0 / 0.5);
}
@media(max-width:991px){
  header .dropdown-language {
    margin-right: 60px;
  }
}
@media (max-width: 767px) {
    header .dropdown-language .dropdown-toggle {
      font-size: 14px;
      padding: 7px 5px 9px;
      width: 93px;
    }
}

/*hamburger*/
@media(min-width:992px){
	header .hamburger {
		display: none;
	}
}
@media(max-width:991px){
	header {
	}
	header .hamburger {
		position: fixed;
		top: 25px;
		right: 15px;
		width: 40px;
    height: 40px;
		background-color: transparent;
		border: none;
		padding: 0;
	}
	header .hamburger .navbar-toggler-icon {
		position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
		width: 40px;
		height: 1px;
		background: #ffffff;
		transition: 0.3s all;
	}
	header .hamburger .navbar-toggler-icon-02 {
		position: absolute;
      top: calc(50% - 10px);
      left: 50%;
      transform: translate(-50%, -50%);
      display: inline-block;
      width: 40px;
      height: 1px;
      background: #ffffff;
      transition: 0.3s all;
	}
	header .hamburger .navbar-toggler-icon-03 {
		position: absolute;
		bottom: 10px;
		left: 50%;
        transform: translate(-50%, -50%);
		display: inline-block;
		width: 40px;
		height: 1px;
		background: #ffffff;
		transition: 0.3s all;
	}
	.nav-open header .hamburger {
		transform: rotate(0deg);
	}
	.nav-open header .hamburger .navbar-toggler-icon {
      top: 50%;
		transform: translate(-50%, 0) rotate(30deg);
	}
	.nav-open header .hamburger .navbar-toggler-icon-02 {
		opacity: 0;
	}
	.nav-open header .hamburger .navbar-toggler-icon-03 {
      top: 50%;
		transform: translate(-50%, 0) rotate(-30deg);
	}
}
@media(max-width:575px){

}

/*sp-nav*/
@media(min-width:992px){
	.sp-nav {
		display: none;
	}
}
@media(max-width:991px){
	.sp-nav {
		position: fixed;
		top: 80px;
		right: 0;
		bottom: 0;
		left: 0;
		visibility: hidden;
		background-color: rgba(22,22,22,0.9);
		opacity: 0;
		transition: 0.3s all;
		z-index: 90;
		overflow: auto;
	}
	.nav-open .sp-nav {
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
		visibility: visible;
		opacity: 1;
	}
	.sp-nav ul {
		list-style: none;
		color: #ffffff;
		padding-left: 0;
    margin-bottom: 0;
    display: none;
	}
  .nav-open .sp-nav ul {
    display: block;
  }
	.sp-nav ul li,
	.sp-nav ul li a {
		color: #ffffff;
	}
	.sp-nav ul > li {
		font-size: 24px;
		text-align: center;
		margin-bottom: 40px;
	}
  .sp-nav ul > li:last-child {
    margin-bottom: 0;
  }
}
@media(max-width:575px){
	.sp-nav ul > li {
	  font-size: 16px;
	  margin-bottom: 32px;
	}
}

/* #sec-contact（footer.php内） */
#sec-contact {
  display: flex;
  justify-content: center;
  background-size: cover;
  background-position: center;
  padding: 0 15px;
}
#sec-contact .border-box {
  display: inline-block;
  color: #fff;
  border: 1px solid #fff;
  background: rgb(22 22 22 / 0.3);
  backdrop-filter: blur(5px);
  padding: 20px 30px 15px;
  margin: 100px auto;
}
#sec-contact .border-box .text {
  line-height: 2em;
  margin-bottom: 15px;
}
#sec-contact .border-box .tel {
  font-size: 32px;
  line-height: 1em;
  letter-spacing: -0.05em;
  text-align: center;
  margin-bottom: 0.5em;
}
@media(max-width:767px){
  #sec-contact .border-box {
    padding: 20px 10px 15px;
    text-align: center;
  }
  #sec-contact .border-box .text {
    font-size: 14px;
    margin-bottom: 20px;
  }
}
@media(min-width:576px){
  #sec-contact {
	 background-image: url("../img/common/bg-footer-contact.jpg");
  }
}
@media(max-width:575px){
  #sec-contact {
	 background-image: url("../img/common/bg-footer-contact-sp.jpg");
  }
  #sec-contact .border {
    max-width: 100%;
    text-align: center;
    padding: 20px 8px 20px 10px;
    margin: 100px 10px;
  }
  #sec-contact .border .text {
    font-size: 14px;
  line-height: 2em;
  }
}

/* footer */
footer.footer {
	background: #161616;
	color: #ffffff;
	font-size: 14px;
  line-height: 2em;
}
footer.footer .text-small {
  font-size: 12px;
  margin-bottom: 0.25em;
}
footer.footer .text-small:last-child {
  margin-bottom: 0;
}
footer.footer .container {
  max-width: 1440px;
  padding: 60px 50px;
}
footer.footer .foot-row {
	display: flex;
}
footer.footer .foot-row.nav-row {
  margin-bottom: 50px;
}
footer.footer .foot-row.nav-row > .left-col {
  display: flex;
  padding-top: 20px;
}
footer.footer .foot-row.nav-row > .left-col .site-name {
  margin-right: 75px;
}
footer.footer .foot-row.nav-row > .left-col .text-inner p.text {
  margin-bottom: 1em;
}
footer.footer .foot-row.nav-row > .right-col {
	margin-left: auto;
}
footer.footer .foot-row.nav-row > .right-col .parent-ul {
  display: flex;
  list-style: none;
  padding-left: 0px;
  gap: 60px;
}
footer.footer .foot-row.nav-row > .right-col ul .foot-nav-ttl p {
  font-size: 16px;
  color: #CAC156;
}
footer.footer .foot-row.nav-row > .right-col .parent-ul .child-ul {
	list-style: none;
  padding: 0;
}
footer.footer .foot-row.nav-row > .right-col .parent-ul .child-ul li {
  display: flex;
  font-size: 14px;
  margin-bottom: 1em;
  gap: 1em;
}
footer.footer .foot-row.nav-row > .right-col .parent-ul .child-ul li::before {
  content: 'ー';
}
footer.footer .foot-row.nav-row > .right-col .parent-ul .child-ul li a {
  vertical-align: -0.3em;
}
footer.footer .foot-row.bnr-row a + a {
  margin-left: 20px;
}
footer.footer .foot-row.copy-row {
  display: flex;
  justify-content: space-between;
  margin-top: 25px;
}
footer.footer .foot-row.copy-row .text-col {
  margin-top: 10px;
}
footer.footer .foot-row.copy-row .recruit-col {
  font-size: 15px;
}
@media (max-width: 991px) {
  footer.footer .container {
    padding-top: 75px;
    padding-bottom: 55px;
    padding-left: 15px;
    padding-right: 15px;
  }
  footer.footer .foot-row.nav-row > .right-col {
    display: none;
  }
}
@media (max-width: 767px) {
  footer.footer .foot-row.nav-row {
    margin-bottom: 50px;
  }
  footer.footer .foot-row.nav-row > .left-col {
    width: 100%;
    align-items: center;
  }
  footer.footer .foot-row.nav-row > .left-col .site-name {
    width: 50%;
    margin-right: 0;
  }
  footer.footer .foot-row.nav-row > .left-col .text-inner {
    width: 50%;
  }
  footer.footer .foot-row.nav-row > .left-col .text-inner p.text:last-child {
    margin-bottom: 0;
  }
  footer.footer .foot-row.copy-row {
    margin-top: 90px;
  }
  footer.footer .foot-row.copy-row .text-col {
    margin-top: 0;
  }
  footer.footer .foot-row.copy-row .text-col .text-small {
    font-size: 10px;
  }
}
@media (max-width: 575px) {
  footer.footer .foot-row.bnr-row {
    flex-direction: column;
    align-items: center;
  }
  footer.footer .foot-row.bnr-row a + a {
    margin-left: 0;
    margin-top: 15px;
  }
}


/*--------------------------------------------------*/
/* #sec-ttl */
/*--------------------------------------------------*/
#sec-ttl {
  position: relative;
  height: 220px;
}
#sec-ttl .title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #000;
    font-size: 24px;
    letter-spacing: 0.1em;
    line-height: 2em;
    white-space: nowrap;
    margin: 0;
}
@media (max-width: 767px) {
  #sec-ttl {
    height: 170px;
  }
  #sec-ttl .title {
    font-size: 20px;
  }
}


/* 初期状態：下から浮かせて隠す */
.fadeup-anime {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity .9s ease, transform 1.2s ease;
  will-change: opacity, transform;
}

/* 発火後：ふわっと表示 */
.fadeup-anime.is-active {
  opacity: 1;
  transform: translateY(0);
}