@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
*/

/* ローディング画面表示 */
.loader-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100vw;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none; /* ローディング中にクリックを無効化 */
  animation: overlayFadeOut 3.5s 2s forwards;
}

.loader-overlay img {
  /* width: 360px; /* PCのロゴ画像のサイズ */
  width: 60%;
  opacity: 0;
  transform: scale(0.10); /* 初期状態は少し小さく */
  animation: logoFadeZoom 1.5s ease-out forwards, logoFadeOut 1.5s 1.5s ease-out forwards; /* ロゴのフェードインとフェードアウトアニメーション */
}

@media screen and (max-width: 959px) {
  .loader-overlay img {
    /* width: 180px; /* スマホのロゴ画像のサイズ */
	width: 80%;
	/* height: 1024px; */
  }
}

/* ローディング画面全体のフェードアウトアニメーション */
@keyframes overlayFadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

/* ロゴのズームインとフェードインのアニメーション */
@keyframes logoFadeZoom {
  0% {
    opacity: 0;
    transform: scale(0.9); /* 少し小さい状態から始める */
  }
  100% {
    opacity: 1;
    transform: scale(1); /* 徐々にフェードインしながら元のサイズに */
  }
}

/* ロゴがフェードアウトのアニメーション */
@keyframes logoFadeOut {
  0% {
    opacity: 1;
    transform: scale(1); /* フェードアウト前の状態を維持 */
  }
  100% {
    opacity: 0;
    transform: scale(1); /* 少し大きくしてふわっと消える */
  }
}
 
/* ヒーローセクションの見出し文字 */
@media (min-width: 968px) {
  .second_view_h2 {
	font-size: 75px !important;
  }
}

@media screen and (max-width: 767px){
  .second_view_h2 {
    font-size: 60px !important;
  }
	
  .fs_xl, .has-huge-font-size, .has-xl-font-size, .u-fz-xl {
    font-size: 40px !important;
  }
	.heroview-box {
		margin-bottom: 60px;
	}
}

@media (min-width: 768px) {
  .force-fullwidth-leftmargin {
	display: flex;
    justify-content: flex-end;
    box-sizing: border-box;
    width: 100vw !important;
    margin-left: calc(50% - 50vw);
	margin-right: 0 !important;
	padding-right: 0 !important;
	padding-left: 10vw;
  }
	.force-fullwidth-rightmargin {
	display: flex;
    justify-content: flex-start;
    box-sizing: border-box;
    width: 100vw !important;
    margin-left: calc(50% - 50vw);
	padding-left: 0 !important;
	padding-right: 10vw;
  }
}

.voice-img img {
  border-radius: 24px 0px 0px 24px;
}
	
.company-img img {
  border-radius: 0px 24px 24px 0;
}
	
.recruit-img img {
  border-radius: 24px 0px 0px 24px;
}

@media screen and (max-width: 767px) {
  .u-mb-50 {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/* スマホ：縦並びにして中央揃え */
@media screen and (max-width: 781px) {
	/* 右寄せのときの写真と文章の順番入れ替え */
	.contents-right-mobile {
    flex-direction: column-reverse;
  }
	.contents-right-mobile>.wp-block-column: nth-child(1) {
    order: 2;
  }
  .contents-right-mobile>.wp-block-column: nth-child(2) {
    order: 1;
  }
  .force-fullwidth-leftmargin {
	display: flex;
    justify-content: flex-end;
    box-sizing: border-box;
    width: 100vw !important;
    margin-left: calc(50% - 50vw);
	margin-right: 0 !important;
	/* padding-right: 10px !important;
	padding-left: 10px; */
  }
  .force-fullwidth-rightmargin {
	display: flex;
    justify-content: flex-start;
    box-sizing: border-box;
    width: 100vw !important;
    margin-left: calc(50% - 50vw);
	/* padding-left: 10px !important;
	padding-right: 10px; */
  }
}

@media (min-width: 761px) and (max-width: 959px) {
  .heroview-box{
	padding-left: 10vw !important;
	padding-right: 10vw !important;
  }
  .img3s {
	padding-left: 20px !important;
	padding-right: 20px !important;
  }
}

@media (min-width: 481px) and (max-width: 761px) {
  .force-fullwidth-leftmargin{
	padding-left: 10px;	
	padding-right: 10px;
  }
}

@media screen and (max-width: 959px) {
	.bottom-space {
		margin-bottom: 60px;
	}
}