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

/* ローディング・動画 */
.visual {
	position: relative;
	width: 100%;
	height: 100vh;
}
.movie {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.top_m_txt { 
    position: absolute;
    bottom: 10%;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
	color: #fff; z-index: 99;
	text-align: center; }
	
.loading_logo { width: 260px; height: auto; position: relative; top: -50px; }

@media all and (max-width:810px){
.visual { height: 58.25vw; margin-top: 60px; }
.movie { position: relative; height: auto; }
.top_m_txt { bottom: 4%; }
.top_m_txt p { white-space: nowrap; }
.top_m_txt .fs_26 { font-size: 160% !important; }
.top_m_txt .fs_12 { font-size: 70% !important; }
}
.movie video { width: 100%; height: auto; position: relative; } 
@media all and (min-width:811px){
.movie video {
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	width: auto;
	height: auto;
	min-width: 100%;
	min-height: 100%;
	transform: translate(-50%,-50%);
	background: #fff;
	filter: drop-shadow(0px 0px #000);
}}

.loading {
    height: 100vh;
    width: 100%;
    position: fixed;
    z-index: 99999999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	background: #fff;
	pointer-events: none;
  }
.loading__fade{ display: none; }

/* TOP スマホビジュアル */
.movie_sp {
width: 100vw;
height: 100vh; }
.slideimg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  background-size: cover;
  animation: slideAnime 20s 2s infinite;
}
@keyframes slideAnime {
  0%, 30%, 100% { opacity: 0; }
  10%, 20% { opacity: 1; }
}


.slideimg:nth-of-type(1){
  background-image: url('../img/top/tp_sp_01.jpg');
  animation-delay: 2s;
  background-position:100%;
}

.slideimg:nth-of-type(2) {
  background-image: url('../img/top/tp_sp_02.jpg');
  animation-delay: 6s;
  background-position:10%;
}

.slideimg:nth-of-type(3) {
  background-image: url('../img/top/tp_sp_03.jpg');
  animation-delay: 10s;
  background-position:0%;
}

.slideimg:nth-of-type(4) {
  background-image: url('../img/top/tp_sp_04.jpg');
  animation-delay: 14s;
  background-position:60%;
}

.slideimg:nth-of-type(5) {
  background-image: url('../img/top/tp_sp_05.jpg');
  animation-delay: 18s;
  background-position:90%;
}

@media all and (max-width:560px){
.top_m_txt { bottom: auto; top: auto; bottom: 18%; }
.top_m_txt p { white-space: nowrap; }
.tm_txt_l { font-size: 5.5vw !important; }
.tm_txt_s { font-size: 2.5vw !important; }
}

/* ページ送り */

.box{
  color: #fff;
  display:flex;
  justify-content: space-between;
  align-items: center;
  max-width: 2560px;
  width: 100%;
  margin: 0 auto;
}
#box1{
    background: #fff;
}
#box2{
    background: #fff;
}
#box3{
    background: #fff;
}
#box1,#box2,#box3 { padding: 80px 0 0 30px; }
#box2,#box3 { padding: 60px 0 0 30px; }
#box3 { padding-bottom: 160px; }
#box4{
    background: #fff;
	position: relative;
	z-index: 99999;
}
@media all and (max-width: 810px){#box1,#box2,#box3 { padding: 60px 0 0 0; }}
@media all and (max-width: 560px){#box1,#box2,#box3 { padding: 30px 0 0 0; margin-bottom: 30px; }}

#footer{
}

#footer a{
  color: #fff;
}
/*========= ページネーションCSS ===============*/

.pagination {
  position:fixed;
  right:20px;
  top: 50%;
    transform: translateY(-50%);
  font-size:1em;
  z-index: 10;
  list-style: none;
  display: none !important;
}

.pagination a {
  display:block;
  height:20px;
  margin-bottom:5px;
  color:#fff;
  position:relative;
  padding:4px;
}

.pagination a.active:after {
  box-shadow:inset 0 0 0 5px;
}

/*現在地表示のテキストの設定*/
.pagination a .hover-text {
  position:absolute;
  right:15px;
  top:0;
  opacity:0;
  -webkit-transition: opacity 0.5s ease;
  transition: opacity 0.5s ease;
  padding-right: 15px;
}

.pagination a:hover .hover-text {
  opacity: 1;
}

.pagination a:after {
  -webkit-transition:box-shadow 0.5s ease;
  transition:box-shadow 0.5s ease;
  width:10px;
  height:10px;
  display: block;
  border:1px solid;
  border-radius:50%;
  content:"";
  position: absolute;
  margin:auto;
  top:0;
  right:3px;
  bottom:0;
}

/*810px以下は現在地表示のテキストを非表示*/
@media screen and (max-width:810px) { 
  .pagination a .hover-text{
    display: none;
  } 
}

/* キャッチテキスト他 */

.attention_box { background-color: #ebebeb; width: 100%; padding: 60px; }
.attention_box p { font-family: 'Noto Serif JP', YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; line-height: 2.2 !important; text-align: center; font-size: 110%; color: #333; margin-bottom: 0; }
.at_box { margin: 0 auto; }
.catch_box { width: 100% !important; padding-right: 40px; color: #333; font-family: 'Noto Serif JP', YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; line-height: 1.8 !important; padding-bottom: 120px; }
.catch_box .lead { font-size: 130% !important; font-weight: 500 !important; margin-bottom: 30px; }
.catch_box h2 { font-size: 340% !important; font-weight: 500 !important; color: #3764ff; margin-bottom: -12px !important; }
.catch_box .sub { font-size: 110% !important; margin-bottom: 30px; font-weight: 500 !important; }
.catch { position: absolute; bottom: 36px; left: 10%; width: 82%; height: auto; z-index: 9; }

@media all and (max-width: 810px) { 
.catch { width: 80%; max-width: 540px; }
.catch_box { padding: 0 0 10px; }
#box1 .catch,
#box2 .catch,
#box3 .catch { left: 20px; }
.attention_box { padding: 30px; margin-top: -30px; }
.attention_box p { line-height: 2.0; text-align: left; } }

@media all and (max-width: 560px) {
.attention_box { margin-top: 0; }
.catch { bottom: 0; } }

/* レコメンドボックス */
.recruit_block01 { margin-top: 80px; }
.recruit_block01 .box_H a { background-size: cover; width: 50vw; height: 17.1875vw; }
.top_rec_btn01 a { background-image: url("../img/support/support_bg01_n.jpg"); }
.top_rec_btn01 a:hover { background-image: url("../img/support/support_bg01_p.jpg"); }
.top_rec_btn02 a { background-image: url("../img/recruit/recruit_bg01_n.jpg"); }
.top_rec_btn02 a:hover { background-image: url("../img/recruit/recruit_bg01_p.jpg"); }
@media all and (max-width: 810px) {
.recruit_block01 .box_H a { width: 100vw; height: 34.375vw; }
.recruit_block01 { background: none; margin-top: 60px; margin-bottom: 60px; }
.recruit_block01 .box_H { background-position: center center; background-size: cover; }
.recruit_block01 .box_H:nth-child(1) { background-image: url("../img/support/support_bg01_n.jpg"); }
.recruit_block01 .box_H:nth-child(2) { background-image: url("../img/recruit/recruit_bg01_n.jpg"); }
}