@import url('https://fonts.googleapis.com/css?family=Josefin+Sans:400,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Serif+JP&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP&display=swap');

html{
	width: 100%;
	background: #222734;
	color: #FFFFFF;
	overflow: auto;
}

body{
	font-family: 游ゴシック体, YuGothic, 游ゴシック, 'Yu Gothic', 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', 'Meiryo','ＭＳ ゴシック' , Josefin Sans, Futura, 'Century Gothic', sans;
	margin: 0;
    overflow: hidden;
    min-width: 100vw;
}
* {
	-ms-overflow-style: none;
  scrollbar-width: none;
  &::-webkit-scrollbar {
    display: none;
  }
}
img{
	width: 100%;
}

button{
	outline: none;
}

.wrap{
	overflow: hidden;
}

/* 採用動画(仮) */
.bl_content_recruit_img {
	display: flex;
    justify-content: center;
    align-items: center;
	position: relative;
	z-index: 20;
	padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
}

.bl_content_recruit_img iframe {
	position: absolute;
	top: 0;
}

@media (max-width: 767px) {

}

@media (min-width: 768px) {
	.bl_content_recruit_img iframe {
		width: 50%;
		height: 50%;
	}
}

@media (min-width: 1920px) {
	.bl_content_recruit_img iframe {
		width: 50%;
		height: 50%;
	}
}


/*TOP---------------------------*/

.top_contents{
	position: relative;
	width: 100vw;
}

.top_img{
	position: relative;
	width: 100%;
	height: 180vh;
	min-height: 1100px;
}

body::before{
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100vh;
	background-image: url("../images/top_image.jpg");
	background-position: center;
	background-size: cover;
}

.top_img_background::before{
	background: #222734;
	background-image: none;
}

.top_img img{
	width: 100vw;
	height: 100vh;
	object-fit: cover;
}

.header_tab{
	width: 100%;
	height: 80px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 111111;
    transition: 0.8s;
}

.header_logo, .header_menu{
	display: inline-block;
	margin-top: 24px;
}

.header_logo{
	display: inline-flex;
	margin-left: 40px;
}

.company_logo{
	max-width: 300px;
}

.header_logo span{
	font-family: Josefin Sans;
	font-size: 23px;
}

.header_menu{
	float: right;
	clear: both;
	margin-right: 40px;
}

.header_menu ul{
	padding: 0;
	margin: 0;
}

.header_menu ul li a{
	text-decoration: none;
	color: #FFF;
}

.header_menu_contents, .header_entry_btn{
	list-style: none;
	display: inline;
	font-size: 13px;
	margin-right: 30px;
}

.header_entry_btn{
	margin-right: 0;
}

.header_entry_btn a button{
	min-width: 100px;
	min-height: 28px;
	background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#F06B0B),
    to(#D9981C));
	color: #FFFFFF;
	border-radius: 21px;
	border: none;
	height: auto;
	transition: 0.3s;
	cursor: pointer;
	margin: 0;
}

.catch_title{
	max-width: 556px;
	width: 556px;
	position: absolute;
	top: 45vh;
	left: 10%;
}

.catch_title_img{
	width: 100%;
}

.catch_title p{
	font-size: 26px;
	margin: 0;
	display: flex;
	align-items: center;
}

.catch_title p::before{
	margin-right:30px;
	border-top:1px solid #FFFFFF;
	content:"";
	flex-grow:1;
}

/*スクロールアニメーション-------------*/

.scroll_text{
	text-align: center;
	font-size: 9px;
	font-weight: bold;
	position: absolute;
	top: 87vh;
    left: 0;
    right: 0;
}

.scroll_text a{
	text-decoration: none;
    color: #FFF;
}

.scroll_anime{
	text-align: center;
	font-size: 9px;
	font-weight: bold;
	position: absolute;
    top: 90vh;
    left: 0;
    right: 0;
    height: 70px;
    overflow: hidden;
}

.scroll_anime::after{
    content: "";
    position: absolute;
    top: -26px;
    left: 50%;
    margin-left: -1px;
    width: 2px;
    height: 60px;
    background-color: #FFF;
    animation: scrollbar 1.8s linear infinite;
}

@keyframes scrollbar {
  0% {
    -webkit-transform: translate3d(-50%, -50px, 0);
    transform: translate3d(-50%, -50px, 0);
  }

  60% {
    -webkit-transform: translate3d(-50%, 150px, 0);
    transform: translate3d(-50%, 150px, 0);
  }

  100% {
    -webkit-transform: translate3d(-50%, 150px, 0);
    transform: translate3d(-50%, 150px, 0);
  }
}

.message_title{
	text-align: center;
	padding-top: 150px;
	margin-bottom: 100px;
	position: absolute;
    top: 100vh;
    left: 0;
    right: 0;
    font-family: 'Noto Serif JP', serif;
}

.message_title h2{
	margin: 0 0 50px 0;
    font-size: 32px;
    letter-spacing: 0.2em;
}

.message_title p{
	font-size: 18px;
	line-height: 34px;
}

/*MAIN---------------------------*/

.main{
	background: #222734;
	padding-top: 80px;
	position: relative;
}

.contents_title{
	text-align: center;
	position: relative;
}

.cont_intv_title{
	padding-top: 100px;
	z-index: 2;
}

.cont_qa_title{
	padding-top: 100px;
}

.cont_flow_title{
	padding-top: 80px;
}

.cont_requir_title{
	padding-top: 80px;
}

.cont_requir_title div{
	color: #222734;
}

.contents_title_name{
	font-family: Josefin Sans;
	font-size: 58px;
	margin-bottom: -3px;
}

.contents_title p{
	font-size: 18px;
	font-weight: bold;
	color: #ED741D;
	padding: 0 0 15PX 0;
	margin: 0;

}

.contents_heading{
	font-size: 22px;
	font-weight: bold;
	padding: 15px 0 0 0;
	margin: 0;
	border-top: 1px solid #FFFFFF;
	display: inline-flex;
}

.contents_heading::before{
	border-top:1px solid #FFFFFF;
	content:"";
}

/*TRAINING-------------------------------*/

.training{
	position: relative;
	text-align: center;
}

.training::before{
	content: "";
    display: block;
    width: 100%;
    height: 107%;
    background: transparent linear-gradient(180deg, #466386 0%, #222734 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    right: 14%;
    top: -4%;
    -webkit-transform: translateY(140px);
    transform: translateY(140px);
    opacity: .25;
}

.training_title{
	font-size: 24px;
	font-weight: bold;
	display: inline-block;
	background: linear-gradient(transparent 75%, #904D1E 75%);
    position: relative;
    height: 30px;
}

.tra_cont_title{
	z-index: 1;
}

.tra_cont_title,
.tra_flow_title{
	margin: 100px 0 50px 0;
	text-align: center;
}

.tra_intv_title{
	background: linear-gradient(transparent 75%, #D1712E 75%);
	height: 26px;
}

.training_section{
	text-align: center;
	position: relative;
}

.training_contents{
	max-width: 940px;
	margin: auto;
	padding: 0 30px 0;
}

.training_contents::before{
	content: "";
    display: block;
    width: 1040px;
    height: 102%;
    background: linear-gradient(180deg, #203246 0%, #051321 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    margin-left: 80px;
    margin-top: -270px;
    -webkit-transform: translateY(140px);
    transform: translateY(140px);
    opacity: 1;
}

.tra_cont_left,
.tra_cont_right{
	display: flex;
	margin: 0 0 100px 0;
}

.tra_cont_last{
	margin: 0 0 80px 0;
}

.tra_cont_text_right,
.tra_cont_text_left{
	max-width: 430px;
	text-align: left;
}

.tra_cont_text_right{
	margin-left: 40px;
}

.tra_cont_text_left{
	margin-right: 40px;
}

.tra_cont_no{
	font-size: 20px;
	font-family: Josefin Sans;
	font-weight: bold;
	color: #ED741D;
	display: flex;
	align-items: center;
	width: 44px;
	margin: 0 0 20px 0;
}

.tra_cont_no::before{
	margin-right:6px;
	border-top:1px solid #ED741D;
	content:"";
	flex-grow:1;
}

.tra_cont_text_right h3,
.tra_cont_text_left h3{
	display: inline-block;
	font-size: 22px;
	font-weight: bold;
	border-left: 4px solid #ED741D;
	padding-left: 10px;
	margin: 0 0 40px 0;
}

.tra_cont_val{
	font-size: 15px;
	line-height: 26px;
	font-weight: normal;
	margin: 0;
}

.training_content_img{
	max-width: 470px;
	max-height: 330px;
}

.training_content_img img,
.training_flow_img img{
	width: 100%;
}

.tra_flow_intv_section{
	position: relative;
	text-align: center;
    max-width: 800px;
    margin: auto;
}

.tra_flow_intv_section::before{
	content: "";
    display: block;
    width: 110%;
    height: 107%;
    background: transparent linear-gradient(0deg, #203246 0%, #051321 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    margin-top: -8%;
    margin-left: -32%;
    -webkit-transform: translateY(140px);
    transform: translateY(140px);
    opacity: 1;
}

.training_flow{
	max-width: 800px;
	margin: auto;
	text-align: center;
	padding: 0 30px;
	position: relative;
}

.tra_flow_web{
	width: 100%;
}

.tra_flow_sp{
	display: none;
}

.tra_flow_photo{
	background-image: url("../images/training_flow_web.png");
	background-image: url(../images/training_flow_web.png);
    background-size: cover;
    width: 100%;
    height: 100%;
}

.tra_flow_val{
	font-size: 15px;
	line-height: 26px;
	font-weight: normal;
	margin: 40px 0 120px 0;
	text-align: left;
}

.training_interview{
	max-width: 800px;
	height: 300px;
	margin: 0 30px;
	position: relative;
	overflow: hidden;
	display: inline-block;
}

.training_interview_img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.training_interview_img_sp{
	display: none;
}

.tra_intv_img_div{
	width: 100%;
	height: 100%;
}

.training_interview a{
	color: #000;
	height: auto;
}

.tra_intv_text{
	position: absolute;
	top: 35px;
	right: 35px;
	max-width: 230px;
	height: 230px;
	border: 2px solid #000;
	text-align: center;
}

.tra_intv_title{
	font-size: 22px;
	margin: 50px 26px 16px;
}

.tra_intv_val{
	max-width: 174px;
	font-size: 14px;
	line-height: 20px;
	margin: auto;
	text-align: left;
}

.tra_intv_val_sp{
	display: none;
}

.tra_intv_guidance{
	font-size: 16px;
	font-family: Josefin Sans;
	margin: 0;
    margin-top: 15px;
}

.tra_intv_guidance::after{
	content: url("../images/training_intv_icon.png");
	position: relative;
	top: 5px;
	left: 10px;
	display: inline-block;
	transform: scale(0.6);
}

.entry_contents{
	text-align: center;
	width: 365px;
	height: auto;
	margin: auto;
	margin-top: 120px;
	position: relative;
}

.entry_btn{
	text-align: center;
	display: inline-block;
}

.entry_btn a button{
	background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#F06B0B),
    to(#D9981C));
    color: #FFFFFF;
    font-size: 35px;
    font-family: Josefin Sans;
    font-weight: bold;
    width: 365px;
    height: 86px;
    padding-top: 8px;
    border: none;
    border-radius: 65px;
    cursor: pointer;
}

.entry_btn a button span{
	display: block;
	font-size: 13px;
	font-weight: normal;
}

.entry_btn p{
	font-size: 12px;
	font-weight: bold;
	display: inline-block;
	margin: 8px 0 0 auto;
	float: right;
}

.first_entry{
	margin-bottom: 83px;
}

.mid_entry{
	margin-bottom: 83px;
}

.footer_entry{
	margin: auto;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
}

/*interview------------------------*/

.intv_company_section{
	position: relative;
}

.intv_company_section::before{
	content: "";
    display: block;
    width: 100%;
    height: 107%;
    background: transparent linear-gradient(180deg, #32425A 0%, #222734 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    top: -5%;
    -webkit-transform: translateY(140px);
    transform: translateY(140px);
    opacity: 1;
}

.interview_btn{
	max-width: 700px;
	max-height: 467px;
	margin: auto;
	margin-top: 80px;
	margin-bottom: 100px;
	position: relative;
	z-index: 1;
}

.interview_btn::before{
	content: "";
    display: block;
    width: 87%;
    height: 197%;
    background: transparent linear-gradient(180deg, #446977 0%, #9D806A 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    margin-top: -50%;
    margin-left: -10%;
    transform: translateY(140px);
    opacity: 1;
    max-width: 658px;
    max-height: 598px;
    z-index: -1;
}

.interview_img{
	position: relative;
	max-width: 708px;
	max-height: 467px;
	width: 100%;
	height: 100%;
}

.interview_img div{
	width: 100%;
	height: 100%;
}

.interview_img div img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.interview_img::after{
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent linear-gradient(180deg, #EBBA5C 0%, #1392B9 100%) 0% 0% no-repeat padding-box;
	opacity: 0.5;
}

.interview_guidance{
	position: absolute;
	max-width: 660px;
	max-height: 427px;
	width: 	100%;
	height: 100%;
	border: 1px solid #FFFFFF;
	top: 0;
	left: 0;
	margin: 20px;
}

.interview_guidance p{
	font-size: 28px;
	font-family: Josefin Sans;
	color: #FFFFFF;
	position: absolute;
	bottom: 30px;
	right: 53px;
	margin: 0;
}

.interview_guidance p::after{
	content: url("../images/training_intv_icon_white.png");
	position: relative;
	top: 1px;
	left: 20px;
	display: inline-block;
}

/*company--------------------------------*/

.company{
	text-align: center;
	padding-top: 100px;
	max-width: 940px;
    margin: auto;
}

.company::before{
	content: "";
    display: block;
    width: 100%;
    height: 87%;
    background: transparent linear-gradient(180deg, #05202B 0%, #4B4642 100%) 0% 0% no-repeat padding-box;
    position: absolute;
    margin-left: 18%;
    margin-top: -12%;
    -webkit-transform: translateY(140px);
    transform: translateY(140px);
    opacity: 1;
}

.company_btn{
	display: flex;
	max-width: 800px;
	margin: auto;
	margin-top: 80px;
}

.message_management_btn,
.company_strength_btn{
	max-width: 385px;
	max-height: 288px;
	height: 288px;
	position: relative;
	box-shadow: 0px 10px 8px #00000029;
	cursor: pointer;
	overflow: hidden;
}

.message_management_btn button,
.company_strength_btn button{
	width: 100%;
	height: 100%;
	padding: 0;
	border:0;
}

.message_management_img,
.company_strength_img{
	max-width: 385px;
	max-height: 288px;
	width: 100%;
	height: 100%;
	position: relative;
}

.message_management_img::after,
.company_strength_img::after{
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.message_management_img::after{
	background: transparent linear-gradient(180deg, #1D5D6A 0%, #5D4B23 100%) 0% 0% no-repeat padding-box;
	opacity: 0.86;
}

.company_strength_img::after{
	background: transparent linear-gradient(179deg, #214E7C 0%, #814F27 100%) 0% 0% no-repeat padding-box;
	opacity: 0.86;
}

.message_management_img img,
.company_strength_img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.company_strength_btn{
	margin-left: 30px;
}

.message_management_btn button p,
.company_strength_btn button p{
	position: absolute;
	max-width: 345px;
	max-height: 248px;
	width: 	100%;
	height: 100%;
	line-height: 250px;
	border: 1px solid #FFFFFF;
	top: 0;
	left: 0;
	margin: 20px;
	text-align: center;
}

.message_management_btn button p span,
.company_strength_btn button p span{
	font-size: 24px;
	font-weight: bold;
	display: inline-block;
	vertical-align: middle;
	color: #FFFFFF;
}

.office_photo{
	max-width: 1000px;
	margin: 80px 30px 0 30px;
	text-align: center;
	display: inline-block;
	position: relative;
}

.mrkm_img{
	transform: scale(1.4);
}

.office_photo_title{
	display: inline-block;
	font-size: 24px;
	font-weight: bold;
	background: linear-gradient(transparent 75%, #904D1E 75%);
	margin-bottom: 50px;
	height: 30px;
}

.office_photo_img{
	max-width: 860px;
	max-height: 549px;
}

.slider-container {
  position: relative;
}

.slider.slick-initialized {
  display: block;
}
.slider-arrow {
  position: absolute;
  top: 50%;
  height: 36px;
  margin-top: -18px;
  color: #FFF;
  line-height: 36px;
  font-size: 50px;
  cursor: pointer;
  z-index: 10;
}
.slider-prev {
  left: -40px;
}
.slider-next {
  right: -40px;
}

/*accordion---------------------------*/

.recruitqa_accordion{
	margin-top: 80px;
}

#accordion {
    max-width: 700px;
    margin: 0 auto;
}

.accordion-click, .accordion-content {
    padding: 10px 0;
}

.accordion-click{
	transition: 0.3s;
}

.plus_icon{
	content: url("../images/qa_plus_btn.png");
    transform: scale(0.2);
    display: inline-flex;
    position: absolute;
    top: 0;
    bottom: 0;
    right: -30px;
    margin: auto;
}

.minus_icon{
	content: url("../images/qa_minus_btn.png");
    transform: scale(0.2);
    display: inline-flex;
    position: absolute;
    top: 0;
    bottom: 0;
    right: -30px;
    margin: auto;
}

.accordion-click p{
	margin: 0;
	font-size: 16px;
	display: inline-block;
	max-width: 560px;
	margin-top: 7px;
}

.accordion-click span{
	color: #ED741D;
	display: inline-block;
	margin-right: 20px;
	margin-left: 20px;
	font-size: 26px;
	font-weight: bold;
}

.accordion-click {
    background-color: #586179;
    color: #fff;
    cursor: pointer;
    position: relative;
    display: inline-flex;
    width: 700px;
}

.accordion-click:not(:first-child){
	margin-top: 8px;
}

.accordion-content {
    background: #FFFFFF;
    color: #000;
    display: inline-flex;
    padding: 0;
    width: 700px;
}

.accordion-content p{
	display: inline-block;
	margin: 24px 38px 24px 0;
	max-width: 604px;
	word-break: break-word;
}

.accordion-content span{
	color: #ED741D;
	display: inline-block;
	margin-right: 20px;
	margin-left: 20px;
	margin-top: 24px;
	font-size: 26px;
	font-weight: bold;
}

/*flow----------------------------*/

.flow_requirements_section{
	position: relative;
	background: #444853;
	margin-top: 100px;
	padding-bottom: 100px;
}


.flow{
	text-align: center;
}

.flow_section{
	display: inline-flex;
	max-width: 700px;
	margin-top: 80px;
}

.flow_contents{
	text-align: center;
	display: inline-block;
	position: relative;
}

.flow_contents:not(:last-child) {
	margin-right: 52px;
}

.flow_contents:not(:last-child)::after{
	content:"";
	display:inline-block;
	width:1em;
	height:1em;
	background:url("../images/flow_arrow_icon.svg") no-repeat;
	background-size:contain;
	position: absolute;
	top: 35%;
	right: -25%;
}

.arrow{
	background:url("../images/flow_arrow_icon.svg") no-repeat;
}

.flow_contents img{
	max-width: 136px;
	margin-top: 5px;
	margin-bottom: 20px;
}

.flow_no{
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 20px;
	font-weight: bold;
	color: #ED741D;
	margin: 0;
}

.flow_text_title{
	font-size: 15px;
	font-weight: bold;
	margin: 0 0 10px 0;
}

.flow_text_val{
	text-align: left;
	font-size: 12px;
	line-height: 20px;
	max-width: 136px;
	word-wrap: break-word;
	margin: 0;
}

/*requirements-------------------*/

.requirements{
	max-width: 860px;
	height: auto;
	background: #E5E5E5;
	margin: auto;
	margin-top: 100px;
}

.requirements_table{
	color: #222734;
	padding-top: 50px;
	padding-bottom: 80px;
}

.requirements_table table tr{
	display: block;
	margin: 0 20px;
	padding: 30px 0;
	border-top: 1px solid #B6B6B6;
	max-width: 700px;
}

.requirements_table table tr:last-child{
	border-bottom: 1px solid #B6B6B6;
}

.requirements_table table tr th{
	min-width: 128px;
	text-align: left;
}

.th_sp{
	display: none;
}

/*footer-------------------------*/

.footer_contents{
	min-height: 568px;
	width: 100vw;
	height: 100vh;
	text-align: center;
	position: relative;
}

.footer_img{
	width: 100%;
	height: 100%;
	position: relative;
}

.footer_img::after{
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent linear-gradient(159deg, #3F4972 0%, #502603 100%) 0% 0% no-repeat padding-box;
	opacity: 0.83;
}

.footer_img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.footer_message{
	margin: auto;
	position: absolute;
	top: 32%;
	left: 0;
	right: 0;
	max-width: 720px;
}

/*MODAL--------------------------*/

.modalArea,
.sp_menu {
	display: none;
	position: fixed;
	z-index: 11111111;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.modalBg ,
.sp_menu_bg{
	width: 100%;
	height: 100%;
	background-color: rgba(30,30,30,0.7);
}

.message_modalWrapper,
.strength_modalWrapper,
.sp_menu_wrapper{
	position: absolute;
	top: 50%;
	left: 50%;
	transform:translate(-50%,-50%);
	max-width: 940px;
	max-height: 580px;
	width: 940px;
	height: 580px;
	display: inline-flex;
	background: transparent linear-gradient(180deg, #305C60 0%, #6A6641 100%) 0% 0% no-repeat padding-box;
}

.sp_menu{
	z-index: 1111;
	-webkit-backface-visibility:hidden;
 	backface-visibility:hidden;
 	overflow:hidden
}

.sp_menu_bg{
	backdrop-filter: saturate(180%) blur(20px);
    background-color: rgba(34,39,52,0.76);
    background: #222734 0% 0% no-repeat padding-box;
}

.sp_menu_wrapper{
	background: none;
}

.sp_header_logo{
	position: absolute;
	top: 0;
	left: 0;
}

.sp_menu_link{
	position: absolute;
	display: inline-block;
	text-align: center;
	max-width: 700px;
	max-height: 50vh;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	padding-top: 40px;
	list-style: none;
	color: #fff;
	text-decoration: none;
}

.sp_menu_link ul{
	list-style: none;
	margin: auto;
	padding: 0;
    display: inline-block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.sp_menu_contents{
	padding-bottom: 4vh;
}

.sp_menu_link ul li a{
	text-decoration: none;
	color: #FFF;
}

.sp_entry_btn{
	max-width: 180px;
	max-height: 70px;
	margin: auto;
}

.sp_entry_btn a button{
	min-width: 180px;
	min-height: 50px;
	background-image:-webkit-gradient(
    linear,left top,left bottom,
    from(#F06B0B),
    to(#D9981C));
	color: #FFFFFF;
	border-radius: 65px;
	border: none;
	height: auto;
	font-size: 20px;
	font-weight: bold;
	font-family: Josefin Sans;
	cursor: pointer;
	margin: auto;
	transition: 0.3s;
	padding-top: 5px;
}

.sp_menu_link ul p{
	display: inline-block;
	font-size: 9px;
	margin: 10px 0 0 0;
}

.strength_modalWrapper{
	background: transparent linear-gradient(180deg, #4B6088 0%, #775D4F 100%) 0% 0% no-repeat padding-box;
}

.message_img_popup,
.strength_img_popup{
	background-image: url("../images/message_management.jpg");
	background-position: center;
	background-size: cover;
	width: 470px;
	height: 580px;
	margin: 0;
}

.strength_img_popup{
	background-image: url("../images/company_strength.jpg");
	background-position: 63%;
}

.popup_textarea{
	background: rgba(255,255,255,0.68);
	width: 430px;
	height: 540px;
	margin: 20px;
	color: #000;
}

.popup_text{
	width: 340px;
	margin: auto;
}

.popup_text h2{
	font-family: YuGothic, 'Yu Gothic' , 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', 'Meiryo','ＭＳ ゴシック' ;
	font-size: 26px;
	font-weight: bold;
	margin-top: 50px;
	margin-bottom: 28px;
}

.popup_text h3{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 40px;
}

.popup_text p{
	font-size: 14px;
	line-height: 22px;
}

.br_sp{
	display: none;
}

.closeModal,
.sp_close_btn{
	position: absolute;
	top: 40px;
	right: 40px;
	cursor: pointer;
	color: #000;
	font-size: 30px;
	font-family: 'Noto Sans JP', sans-serif;
}

.sp_close_btn{
	color: #FFF;
}


.humberger_close{
	position: absolute;
	top: 6px;
	right: 25px;
	color: #FFF;
	font-size: 41px;
	display: none;
	cursor: pointer;
	font-family: 'Noto Sans JP', sans-serif;
}

.menu-trigger,
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}

.menu-trigger{
	position: absolute;
	top: 28px;
	right: 30px;
	width: 30px;
	height: 24px;
	cursor: pointer;
}
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #fff;
	border-radius: 4px;
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 11px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}

.sp_tra_text02{
	display: none;
}

/*動き-----------------------------------*/

.effect-fade {
	opacity: 0;
	transform: translate(0,70px);
	transition: all 1200ms;
}

.effect-fade.effect-scroll {
	opacity: 1;
	transform: translate(0, 0);
}

.tra_intv_img_div{
	transition: 0.8s;
}

.entry_btn a button{
	transition: 0.5s;
}

.interview_img{
	transition: 0.8s;
}

.message_management_img,
.company_strength_img{
	transition: 0.8s;
}

/*メディアクエリ-----------------------------*/

/*hover-------------------------*/
@media (min-width: 768px) {
	.entry_btn a,
	.sp_entry_btn a{
	    display: block;
	    background-color: #FFF;
	    border-radius: 65px;
	}

	.header_entry_btn a{
		display: inline-block;
		background-color: #FFF;
	    border-radius: 21px;
	}

	.entry_btn a button:hover,
	.sp_entry_btn a button:hover,
	.header_entry_btn a button:hover{
	    opacity: 0.4;
	    filter: alpha(opacity=40);
	}

	.training_interview a{
		display: block;
		height: 100%;
	    background-color: #FFF;

	}

	.training_interview a:hover .tra_intv_img_div{
		opacity: 0.4;
		transform: scale(1.1);
	}

	.interview_btn a{
		display: block;
		background-color: #FFF;
		overflow: hidden;
	}

	.interview_btn a:hover .interview_img{
		opacity: 0.7;
		transform: scale(1.1);
	}

	.message_management_btn a,
	.company_strength_btn a{
		display: block;
	    width: 100%;
	    height: 100%;
	    background: #FFF;
	}

	.message_management_btn a:hover .message_management_img,
	.company_strength_btn a:hover .company_strength_img{
		opacity: 0.7;
		transform: scale(1.1);
	}

	.accordion-click:hover{
		background-color: #8490AF;
	}
}

@media (min-height: 1000px) {
	.top_img{
		height: 155vh;
	}
}

@media (min-width: 1150px) {
	.menu-trigger {
 		display:none;
	}
}

@media (max-width: 1150px) {

	#gnav {
		display:none;
	}

	.humberger_menu {
		display:block;
		position: absolute;
		top: 28px;
		right: 30px;
	}
}

@media (max-width: 940px) {

	.training_contents::before{
		margin-top: -31%;
	}

	.office_photo{
		max-width: 700px;
	}

	.requirements{
		max-width: 100%;
		margin: 80px 10px 0 10px;
	}

	.message_img_popup,
	.strength_img_popup{
		display: none;
	}

	.message_modalWrapper,
	.strength_modalWrapper{
		width: auto;
		max-width: none;
	}

}

@media (max-width: 800px) {

	.company_btn{
		max-width: 700px;
	}

	.message_management_btn,
	.company_strength_btn{
		max-width: 335px;
		max-height: 238px;
		height: 238px;

	}

	.message_management_btn button p,
	.company_strength_btn button p {
		max-width: 93%;
    	max-height: 90%;
    	line-height: 200px;
	    top: 0;
	    bottom: 0;
	    left: 0;
	    right: 0;
	    margin: auto;
	}

	.tra_flow_photo{
		background-image: url('../images/training_flow_sp.png');
	}

}

@media (max-width: 834px){

	body::before{
		background-position: 20%;
	}

	.training_content_img {
	    max-width: 100%;
    	max-height: max-content;
	}

	.tra_cont_left,
	.tra_cont_right{
		display: block;
		margin: 0 0 100px 0;
	}

	.tra_cont_text_right,
	.tra_cont_text_left {
	    margin: 20px 0 0 0;
	    max-width: 100%;
	}

	.training_contents::before{
		width: 87vw;
		height: 102%;
		margin-top: -34%;
	}

	.web_tra_text02{
		display: none;
	}

	.sp_tra_text02{
		display: block;
	}

}


@media (max-width: 768px) {

	.catch_title{
		width: 400px;
	}

	.catch_title p {
		font-size: 20px;
	}

	.training_interview {
	    margin-left: 30px;
	    margin-right: 30px;
	    padding: 0;
	    max-height: 250px;
	}

	.tra_intv_img_div::after {
	    position: absolute;
		content: "";
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: transparent linear-gradient(180deg, #FAEFAF 0%, #C1F8FD 100%) 0% 0% no-repeat padding-box;
		opacity: .55;
	}

	.training_interview_img{
		width: 132%;
	}

	.tra_intv_text {
	    top: 0;
	    bottom: 0;
	    right: 0;
	    left: 0;
	    margin: 10px;
	    max-width: 100%;
	    height: auto;
	}

	.tra_intv_title{
		font-size: 22px;
		margin: 70px 26px 16px;
	}

	.tra_intv_val{
		max-width: 174px;
		font-size: 14px;
		line-height: 20px;
		margin: auto;
		text-align: left;
	}

	.tra_intv_guidance{
		font-size: 16px;
		font-family: Josefin Sans;
		margin: 15px 0 0 0;
	}

	.tra_intv_guidance::after{
		content: url("../images/training_intv_icon.png");
		position: relative;
		top: 5px;
		left: 10px;
		display: inline-block;
		transform: scale(0.6);
	}

	.tra_intv_val{
		display: none;
	}

	.training_interview::after{
		content:'FOX HOUNDの技術研修を担う、若き講師2人の熱意とは…';
		margin-top: 20px;
		display: block;
    	text-align: left;
	}

	.interview_btn {
	    max-width: 100%;
	    margin: 80px 30px 100px 30px;
	}

	.interview_guidance{
		max-width: 93%;
    	max-height: 90%;
    	top: 0;
    	bottom: 0;
    	left: 0;
    	right: 0;
    	margin: auto;
	}

	.interview_btn::before{
		height: 127%;
		margin-top: -55%;
	}

	.company::before {
		width: 82vw;
		margin-top: -16%;
	}

	.company_btn{
		display: inline-block;
	}

	.message_management_btn,
	.company_strength_btn{
		margin: 30px;
	}

	.office_photo{
		max-width: 80%;
	}

	#accordion {
	    max-width: 100%;
	    margin: 30px;
	    display: inline-block;
	}

	.accordion-click,
	.accordion-content{
		width: 100%;
	}

	.accordion-click p{
		max-width: 60%;
	}

	.flow_section {
    	display: inline-block;
	}

	.flow_contents {
		display: flex;
		margin: 0 0 50px 0;
	}

	.flow_contents:not(:last-child) {
	    margin-right: 0;
	}

	.flow_no{
		display: inline-block;
		top: 0;
		bottom: 0;
		margin: auto;
		margin-left: 0;
		margin-right: 20px;
	}

	.flow_contents img{
		margin: 0;
		max-width: 100px;
		max-height: 100px;
	}

	.flow_text{
	    display: inline-block;
	    top: 0;
	    bottom: 0;
	    margin: auto;
	    text-align: left;
	    margin-left: 20px;
	}

	.flow_contents:not(:last-child)::after {
		top: 116%;
	    left: 86px;
		transform: rotate(90deg);
	}

	.requirements_table table tr th{
		padding-right: 30px;
	}

	.footer_message{
		max-width: 600px;
	}

}

@media (max-width: 500px) {

	body::before{
		background-position: 35%;
	}

	.header_tab{
		height: 60px;
	}

	.header_logo {
		margin-top: 20px;
	    margin-left: 30px;
	}

	.company_logo {
	    max-width: 238px;
	}

	.menu-trigger{
		top: 20px;
		width: 28px;
		height: 20px;
	}

	.menu-trigger span:nth-of-type(2){
		top: 9px;
	}

	.humberger_close{
		top: 5px;
		right: 25px;
		font-size: 32px;
	}

	.catch_title{
		width: 300px;
		top: 36vh;
	}

	.catch_title p {
		font-size: 16px;
	}

	.message_title h2 {
		font-size: 20px;
	}

	.message_title p{
		font-size: 15px;
	    display: inline-block;
	    margin: 0 20px;
	}

	.scroll_text{
		top: 82vh;
	}

	.scroll_anime{
	    top: 85vh;
	}

	.contents_title_name{
		font-size: 38px;
	}

	.contents_title p {
		font-size: 12px;
		padding: 0 0 10px 0;
	}

	.contents_heading{
		font-size: 14px;
		padding: 10px 0 0 0;
	}

	.training_title{
		font-size: 18px;
		margin: 50px 0 30px 0;
		height: 22px;
	}

	.tra_cont_left,
	.tra_cont_right {
		margin: 0 0 70px 0;
	}

	.tra_cont_last{
		margin: 0 0 50px 0;
	}

	.tra_cont_text_right h3,
	.tra_cont_text_left h3 {
		font-size: 16px;
		margin: 0 0 30px 0;
	}

	.tra_cont_val {
	    font-size: 13px;
	}

	.tra_flow_web{
		display: none;
	}

	.tra_flow_sp{
		width: 100%;
		display: block;
	}

	.tra_flow_val {
	    font-size: 13px;
	    margin: 30px 0 80px 0;
	    text-align: left;
	}

	.training_interview {
		max-height: 150px;
	}

	.tra_intv_img_div{
		width: 100%;
	    height: 100%;
	    max-width: 100%;
	    max-height: 100%;
	    overflow: hidden;
	}

	.training_interview_img{
		display: none;
	}

	.training_interview_img_sp{
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	.tra_intv_text{
		border: 1px solid #000;
	}

	.tra_intv_title{
		margin: 30px 0 5px 0;
	}

	.tra_intv_guidance {
		font-size: 14px;
		margin: 0;
	}

	.training_interview::after {
		font-size: 13px;
		margin-bottom: 70px;
	}

	.entry_contents{
		width: 260px;
	}

	.entry_btn a button{
		width: 260px;
    	height: 60px;
    	font-size: 24px;
    	padding-top: 4px
	}

	.entry_btn a button span{
		font-size: 10px;
	}

	.entry_btn p {
	    margin: 10px 0 0 auto;
	    font-weight: normal;
	    font-size: 9px;
	}

	.first_entry {
		margin-bottom: 40px;
	}

	.mid_entry{
		margin-top: 70px;
		margin-bottom: 40px;
	}

	.interview_btn{
		margin: 50px 30px 0 30px
	}

	.interview_guidance p {
		font-size: 18px;
	    bottom: 20px;
		right: 27px;
	}

	.interview_guidance p::after{
		transform: scale(0.8);
		top: 4px;
    	left: 10px;
	}

	.company_btn{
		margin-top: 20px;
	}

	.message_management_btn button p,
	.company_strength_btn button p{
		line-height: 216px;
	}

	.message_management_btn button p span,
	.company_strength_btn button p span{
		font-size: 18px;
	}

	.office_photo_title{
		font-size: 18px;
		margin-bottom: 30px;
	    height: 22px;
	}

	.office_photo {
	    max-width: 70%;
	    margin-top: 20px;
	}

	.recruitqa_accordion {
	    margin-top: 50px;
	}

	#accordion{
	    margin: 0 30px;
	}

	.accordion-click span{
		margin-right: 10px;
	    margin-left: 10px;
	    font-size: 16px;
	}

	.accordion-click p{
		font-size: 15px;
	    max-width: 74%;
	    margin-top: 0;
	}

	.plus_icon,
	.minus_icon{
		transform: scale(0.15);
		right: -45px;
	}

	.accordion-content p{
		font-size: 14px;
		line-height: 24px;
	}

	.flow_requirements_section{
		margin-top: 80px;
		padding-bottom: 80px;
	}

	.flow_section{
		margin-top: 45px;
	}

	.flow_contents:last-child{
		margin-bottom: 0;
	}

	.requirements_table{
		padding-top: 40px;
		padding-bottom: 50px;
		font-size: 14px;
	}

	.requirements_table table tr{
		padding: 20px 0;
	}

	.requirements_table table tr th{
		min-width: 70px;
	}

	.th_web{
		display: none;
	}

	.th_sp{
		display: table-cell;
	}

	.footer_message{
	    max-width: 300px;
	    top: 35%;
	}

	/*popup--------------------------*/

	.message_modalWrapper,
	.strength_modalWrapper{
		width: 85%;
		max-height: 577px;
		height: 647px;
	}

	.popup_textarea{
		width: 95%;
		height: 96%;
		margin: 10px;
	}

	.popup_text {
		width: auto;
		margin: 0 20px;
	}

	.popup_text h2{
		font-size: 23px;
	    margin-top: 30px;
	    margin-bottom: 30px;
	}

	.popup_text h3{
	    font-size: 17px;
	    margin-bottom: 30px;
	}

	.popup_text p {
	    line-height: 22px;
	    margin: 0;
	}

	.br_sp{
		display: block;
	}

	.closeModal{
	    position: absolute;
	    top: 20px;
	    right: 20px;
	    cursor: pointer;
	    color: #000;
	    font-size: 40px;
	    z-index: 0;
	}

	.sp_menu_link{
		max-height: 60vh;
	}

	/*背景オブジェクト---------------------*/

	.training::before {
		top: -4%;
	}

	.training_contents::before {
		width: 79vw;
    	height: 100%;
    	margin-left: 13%;
	    margin-top: -47%;
	}

	.tra_flow_intv_section::before {
	    margin-top: -24%;
	    height: 112%;
	}

	.interview_btn::before{
		height: 137%;
		margin-top: -70%;
	}

	.company::before {
		width: 77vw;
	    margin-left: 23%;
    	margin-top: -1%;
	}

	/*動き-------------------------------*/

	.effect-fade {
		opacity: 0;
		transform: translate(0,30px);
		transition: all 1000ms;
	}

}

@media (max-width: 375px) {

	.top_img{
	    min-height: 1100px;
	    height: 185vh;
	}

	.training_interview {
	    max-height: 117px;
	}

	.training_interview_img{
		display: none;
	}

	.training_interview_img_sp{
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	.tra_intv_title {
	    margin: 20px 0 0 0;
	}

	.tra_intv_guidance{
		margin-top: -3px;
	}

	.popup_text p {
		line-height: 20px;
	}

	/*背景オブジェクト---------------------*/

	.training::before {
		top: -4.5%;
	}

	.training_contents::before {
		margin-top: -57%;
		margin-left: 17%;
	}

	.tra_flow_intv_section::before {
	    margin-top: -32%;
	    height: 117%;
	}

	.interview_btn::before{
		height: 150%;
    	margin-top: -88%;
    	width: 90%;
	}

	.company::before {
		width: 80vw;
		margin-left: 20%;
	    margin-top: -35%;
	}

}

@media (max-width: 320px) {

	.header_logo {
	    margin-left: 10px;
	}

	.menu-trigger{
		right: 10px;
	}

	.humberger_close {
		right: 3px;
	}

	.catch_title {
		left: 4%;
	}

	.training_interview {
	    max-height: 97px;
	}

	.cont_requir_title{
		font-size: 34px;
	}

}

/*スクロール時ヘッダー背景----------------------*/

.blur_filter{
	background: #222734 0% 0% no-repeat padding-box;
	z-index: 1111111;
	backdrop-filter: saturate(180%) blur(20px);
    background-color: rgba(34,39,52,0.7);
    -webkit-backdrop-filter: blur(8px);
}