@charset "utf-8";
/* CSS Document */
html,body{font-family: "Noto Sans Japanese", sans-serif;font-size: 16px;font-weight: bold;scroll-behavior: smooth;}
body{line-height: 1.8em;margin: 0;padding: 0;overflow-x: hidden;color: #000;background-color: #fff;}
a{color: #fff;text-decoration:none;}
a:hover{color: rgba(255,255,255,0.70);}
a.anchor {display: block; padding-top: 70px; margin-top: -70px;}
table {  border-collapse: collapse;  border-spacing: 0;}
.wrap{	overflow: hidden;position: relative;min-height: 100vh;box-sizing: border-box;padding: 0;margin: 0;}
.clearfix::after {  content: "";  display: block;  clear: both;}
a:hover img{opacity:0.6;filter: alpha(opacity=60);-ms-filter: "alpha( pacity=60 )";}
*, *:before, *:after {box-sizing: border-box;}
section{padding: 0;margin: 0;}
.Container{max-width: 1400px;display: block;margin: 0 auto;}
.Container .contents{width: 100%;display: block;margin:auto;padding: 60px 0;}
h2{font-weight: bold;font-size: 2.3rem;/*border-bottom: 1px solid #000;*/padding: .8em .5em;}
h2 span{font-weight: bolder;font-size: 3.8rem;color: rgba(215,0,3,1.00);}
@media screen and (max-width:860px){
.Container{max-width: initial;width: 90%; display: block;margin: 0 auto;padding:0;}
.Container .contents{width: 100%;display: block;margin:auto;padding:30px 0 60px;}
}
@media screen and (max-width:380px){
h2{font-weight: bold;font-size: 1.5rem;/*border-bottom: 1px solid #000;*/padding: .8em .5em;}
h2 span{font-weight: bolder;font-size: 3rem;color: rgba(215,0,3,1.00);}
}

header{background-color: #000000;padding: 20px 0;}
header .Container{max-width: 1400px;display: block;margin: auto;padding: 0;}
header .Container::after {  content: "";  display: block;  clear: both;}
header .Container .logo{width: 380px;float: left;}
header .Container .logo a{width: 100%;height: auto; display: block;}
header .Container .logo a img{width: 100%;height: auto; display: block;}
header .Container .menu{width: 870px; display: flex;align-items: center; margin: auto 0 auto auto;float: right;}/*子要素は親コンテナ内で垂直方向に中央揃え flex使用*/
header .Container .menu a{color: #fff;display: inline-block;text-align: center;line-height: 1.3em;padding: 1em 1.3em;}
header .Container .menu a span{font-size: .9rem; display: block;}
header .Container .menu a.btn_entry{color: #fff;background-color:#c80000 ; display: inline-block;text-align: center;line-height: 1.3em;padding: 1em 1.8em;}
header .Container .menu a:hover{color: rgba(255,255,255,0.60);display: inline-block;}
header .Container .menu a.btn_entry:hover{color: rgba(255,255,255,0.60);display: inline-block;}
header #wrapper{display: none;}
@media screen and (max-width:860px){
header{background-color: #000000;padding: 10px;height: 80px;}
header .Container{max-width: initial;width: 100%; display: block;margin: 0 auto;padding: 0;}
header .Container .logo{width: auto;height: 60px; float: left;}
header .Container .logo a{width: auto;height: 60px; display: block;}
header .Container .logo a img{width: auto;height: 100%; display: block;}
header .Container .menu{display: none;}
header #wrapper{display: block;}
header #wrapper #global-navi .menu li a.btn_entry{color: #c80000;background-color:#fff; display: inline-block;text-align: center;line-height: 1.3em;padding: 1em 2em;}
header #wrapper #global-navi .menu li a.btn_entry:hover{color: rgba(200,0,0,.60);background-color:rgba(255,255,255,.60); display: inline-block;text-align: center;line-height: 1.3em;padding: 1em 2em;}
}
@media screen and (max-width:420px){
header{background-color: #000000;padding: 10px;height: 70px;}
header .Container .logo{width: auto;height: 50px;display: block;}
header .Container .logo a{width: auto;height: 50px; display: block;}
}
@media screen and (max-width:320px){
header{background-color: #000000;padding: 10px;}
header .Container .logo{width: auto;height: 40px;display: block;}
header .Container .logo a{width: auto;height: 40px; display: block;}
}
@media (orientation: landscape) and (max-width: 1330px){
header .Container .menu{display: none;}
header #wrapper{display: block;}
}

section.mainimage{width: 100%;height: 100vh;display: flex;align-items: center; background-image:url("../images/recruit_mainimage.webp");background-repeat: no-repeat;background-size: cover;}/*子要素は親コンテナ内で垂直方向に中央揃え flex使用*/
section.mainimage .images{width: 78%; margin: auto;display: block;}
section.mainimage .images img{width: 100%;}
@media screen and (max-width:860px){
}

section.youtube{width: 100%;background-color: #000;margin: 0;padding: 4em 0 0;color: #fff;}
section.youtube table{width: 80%;margin: 0 auto;}
section.youtube td{width: 50%;padding: 30px;}
section.youtube td .movie{aspect-ratio: 16 / 9;display: block;margin: auto;}
section.youtube td .movie iframe{width: 100%;height: 100%;}
@media screen and (max-width:860px){
section.youtube td{width: 100%;padding: 3em;display: block;}
}

section.about{width: 100%;background-color: #022037;margin: 0;color: #fff;}
section.about .before_image{width: 100%;margin: 0;padding: 0;}
section.about .before_image img{width: 100%;}
section.about table{width: 80%;margin: auto;}
section.about td.title{width: 35%;}
section.about td.text{width: 65%;}
section.about h2{border-bottom: none;}
section.about h2 span{}
section.about h2 span.sub{display: block;color: #fff;font-size: .9rem;}
@media screen and (max-width:860px){
section.about td.title{display: block; width: 100%;text-align: center;}
section.about td.text{display: block; width: 100%;}
}

section.works{width: 100%;background-color: #a88220;margin: 0;color: #fff;}
section.works .before_image{width: 100%;margin: 0;padding: 0;}
section.works .before_image img{width: 100%;}
section.works table{width: 80%;margin: auto;}
section.works td.title{width: 35%;}

section.works td.text{width: 40%;vertical-align: top;}
section.works td.text dl{width: 100%;margin-bottom: 1em;}
section.works td.text dt{font-weight: bolder;font-size: 1.5rem;}
section.works td.text dd{padding: 0;margin: 0;font-size: .9rem;font-weight: 400;}

section.works td.text .content_area {width: 100%;margin: 0 auto;padding: 0 20px;}
section.works td.text .tab-container {display: flex;  flex-wrap: wrap;}
section.works td.text .tab-container {margin: 0 0 15px;}
section.works td.text .tab {font-weight: 500;  text-align:center;  width: calc(100% / 3);  padding: 10px;  cursor: pointer;}
section.works td.text .active::before { font-family: "Font Awesome 6 Free";font-weight: 900; content: "\f309";margin-right:.5em;}
section.works td.text .active {background-color: #cb0504;}
section.works td.text .kouji {background-color: #022037;}
section.works td.text .eigyou {background-color: #114D7B;}
section.works td.text .jimu {background-color: #2772AC;}
section.works td.text .kouji:hover {background-color: rgba(2,32,55,.60);}
section.works td.text .eigyou:hover {background-color: rgba(17,77,123,.60);}
section.works td.text .jimu:hover {background-color: rgba(39,114,172,.60);}
section.works td.text .content {display: none; /*必須*/}
section.works td.text .content.show {display: block; /*必須*/}


section.works td.img{width: 25%;vertical-align: top;}
section.works td.img img{width: 100%;}
section.works h2{border-bottom: none;color: #fff;}
section.works h2 span.min{display:inline-block;color: #fff;font-size: .9rem;padding-left: 1em;}
section.works td img{display: block; float: right;}
@media screen and (max-width:860px){
section.works td.title{display: block; width: 100%;text-align: center;}
section.works td.text{display: block; width: 100%;}
section.works td.img{display: block;width: 100%;}
section.works td.img img{display: block; float: none;margin: 2em auto;width: 60%;}
}
@media screen and (max-width:414px){
section.works td.text dt{font-weight: bolder;font-size: 1.3rem;}
}

section.qa{width: 100%;background-color: #000;margin: 0;}
section.qa .before_image{width: 100%;margin: 0;padding: 0;}
section.qa .before_image img{width: 100%;}
section.qa .listarea{width: 80%;margin: 0 auto;padding: 0 0 120px 0;}
section.qa h2{color: #fff;font-weight: bolder;}
section.qa h2 span{display: block;color: #fff;font-size: .9rem;}
section.qa .listarea .leftbox{width: 45%;margin: 1em 4% 2em 0;display: inline-block;padding: 1em 1.5em;background-color: #fff;}
section.qa .listarea .rightbox{width: 45%;margin: 1em 0 2em 4%;display: inline-block;padding: 1em 1.5em;background-color: #fff;}
section.qa .listarea .leftbox dl, section.qa .listarea .rightbox dl{padding: 0;margin: 0;}
section.qa .listarea .leftbox dt, section.qa .listarea .rightbox dt{font-weight: 600;margin-bottom: 1em;}
section.qa .listarea .leftbox dd, section.qa .listarea .rightbox dd{padding: 0;margin: 0;font-weight: 600;}
section.qa .listarea .leftbox dd dl, section.qa .listarea .rightbox dd dl{padding-left: 3em;}
section.qa .listarea .leftbox dd dt, section.qa .listarea .rightbox dd dt{font-weight: bolder;margin-bottom: 0;padding-bottom: 0;}
section.qa .listarea .leftbox dd dd, section.qa .listarea .rightbox dd dd{}
.readmore {  position: relative;  margin: 50px auto 0;  padding: 0px 0px 75px;}
/*.readmore-content {  position: relative;  height: 180px;  transition: all .4s;  overflow: hidden;}*/
.readmore_01 {  position: relative;  height: 122px;  transition: all .4s;  overflow: hidden;}
.under_read {  position: relative;  height: 122px;  transition: all .4s;  overflow: hidden;}
.read-content {  position: relative;  height: 150px;  transition: all .4s;  overflow: hidden;}
/*.readmore-content::before {  position: absolute;  display: block;  content: "";  left: 0;  bottom: 0;  width: 100%;  height: 75px;  transition: all .4s;  background: linear-gradient( rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, #fff 100% );}*/
.readmore_01::before {  position: absolute;  display: block;  content: "";  left: 0;  bottom: 0;  width: 100%;  height: 75px;  transition: all .4s;  background: linear-gradient( rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, #fff 100% );}
.under_read::before {  position: absolute;  display: block;  content: "";  left: 0;  bottom: 0;  width: 100%;  height: 75px;  transition: all .4s;  background: linear-gradient( rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, #fff 100% );}
/*.readmore-content.is_open:before{  display: none;}*/
.readmore_01.is_open:before{  display: none;}
.under_read.is_open:before{  display: none;}
.readmore button{  position: absolute;  display: table;  left: 50%;  bottom: 0px;  margin: 0 auto;  width: 200px;  padding: 10px 0;  text-align: center;  transform: translateX(-50%);  cursor: pointer;  z-index: 1;  transition: all .4s;	border: none;	background: none;}
.readmore_01 button{  position: absolute;  display: table;  left: 50%;  bottom: 0px;  margin: 0 auto;  width: 200px;  padding: 10px 0;  text-align: center;  transform: translateX(-50%);  cursor: pointer;  z-index: 1;  transition: all .4s;	border: none;	background: none;}
.under_read button{  position: absolute;  display: table;  left: 50%;  bottom: 0px;  margin: 0 auto;  width: 200px;  padding: 10px 0;  text-align: center;  transform: translateX(-50%);  cursor: pointer;  z-index: 1;  transition: all .4s;	border: none;	background: none;}
@media screen and (max-width:860px){
section.qa .listarea{width: 90%;margin: 0 auto;padding: 0 0 120px 0;}
section.qa h2{color: #fff;font-weight: bolder;}
section.qa h2 span{display: block;color: #fff;font-size: .9rem;}
section.qa .listarea .leftbox{width: 100%;margin: 2em auto;display: block;padding: 1em 1.5em;background-color: #fff;}
section.qa .listarea .rightbox{width: 100%;margin: 2em auto;display: block;padding: 1em 1.5em;background-color: #fff;}
}

section.disc{width: 100%;background-color: #e5e5e5;margin: 0;border: 1px solid #e5e5e5;}
section.disc .contentsArea{width: 80%;margin: 0 auto;padding: 0 0 120px 0;}
section.disc h2{border-bottom: none;}
section.disc h2 span{}
section.disc h2 span.sub{display: block;color: #000;font-size: .9rem;}
section.disc .contentsArea .saiyoBox{width: 60%;margin: auto;padding-bottom: 60px;}
section.disc .contentsArea .saiyoBox h3{width: 100%;font-size: 2rem;padding-bottom: 1em;}
section.disc .contentsArea .saiyoBox table{width: 100%;margin: 2em auto;}
section.disc .contentsArea .saiyoBox th{padding: .5em 1em .5em .5em;font-weight: 400; text-align: left;vertical-align: top;white-space: nowrap;}
section.disc .contentsArea .saiyoBox td{padding: .5em;font-weight: 400;}
section.disc .contentsArea .saiyoBox td span{display: block; padding:0 0 .2em;font-weight: 400;font-size: .9rem;}
@media screen and (max-width:860px){
section.disc .contentsArea{width: 90%;margin: 0 auto;padding: 0 0 120px 0;}
section.disc .contentsArea .saiyoBox{width: 90%;margin: auto;padding-bottom: 60px;}
}
@media screen and (max-width:600px){
section.disc .contentsArea .saiyoBox th{display: block;background-color: #D9D9D9;}
section.disc .contentsArea .saiyoBox td{display: block;}
}
@media screen and (max-width:414px){
section.disc .contentsArea .saiyoBox h3{width: 100%;font-size: 1.5rem;padding-bottom: 1em;}
}

section.entry{width: 100%;background-color: #ffffff;margin: 0;}
section.entry .contentsArea{width: 80%;margin: 0 auto;padding: 0 0 120px 0;}
section.entry h2{border-bottom: none;}
section.entry h2 span.sub{display: block;color: #000;font-size: .9rem;}
section.entry .contentsArea .formBox{width: 60%;margin: auto;padding-bottom: 60px;}
section.entry .contentsArea .formBox table{width:100%;margin: 60px auto;}
section.entry .contentsArea .formBox th{padding: 1em; text-align: left;border-bottom: 1px dashed #ccc;vertical-align: middle;font-weight: normal;}
section.entry .contentsArea .formBox th span{color: #fff;font-weight: 400;display: inline-block;padding: 0 .8em; font-size: .6rem;background-color: #E10003;margin-left: 2em;border-radius: 5px;}
section.entry .contentsArea .formBox td{padding: 1em;font-weight: 400;border-bottom: 1px dashed #ccc;}
section.entry .contentsArea .formBox td select{padding: .5em;}
section.entry .contentsArea .formBox td input{padding: .5em;}
section.entry .contentsArea .formBox td textarea{padding: .5em;}
section.entry .contentsArea .formBox .privacy{padding: 1em 2em;height: 250px; overflow: auto;width: 100%;border-radius: 10px;border: 1px solid #ccc;margin: 30px 0;}
section.entry .contentsArea .formBox .privacy li{list-style: none;font-weight: normal;margin-bottom: 1em;}
section.entry .contentsArea .formBox .btnbox {padding: 3em 0;text-align: center;}
@media screen and (max-width:860px){
section.entry .contentsArea{width: 90%;margin: 0 auto;padding: 0 0 120px 0;}
section.entry .contentsArea .formBox{width: 90%;margin: auto;padding-bottom: 60px;}
section.entry .contentsArea .formBox th{display: block; padding: 1em; text-align: left;background-color: #D9D9D9;border-bottom: none;}
section.entry .contentsArea .formBox td{display: block;padding: 1em;border-bottom: none;}
section.entry .contentsArea .formBox td input{width: 100%;}
section.entry .contentsArea .formBox td textarea{width: 100%;}
section.entry .contentsArea .formBox .privacy{padding: 1em;height: 250px; overflow: auto;width: 100%;border-radius: 10px;border: 1px solid #ccc;margin: 30px 0;}
section.entry .contentsArea .formBox .privacy ul{margin: 0;padding: 0;}
}
@media screen and (max-width:414px){
section.entry .contentsArea .formBox th{display: block; padding: .5em;}
section.entry .contentsArea .formBox td{display: block;padding: 1em .5em;}
}

footer{background-color: #000;color: #fff; padding: 15px 0;text-align: center;}
footer .copyright{width: 100%; font-weight: 300;margin: 1em auto;display: block;font-size: .9rem;}
@media screen and (max-width:860px){
footer .copyright{color: #fff; margin: 1em auto 0;display: block;font-size: .7rem;}
}
@media screen and (max-width:320px){
footer .copyright{color: #fff; margin: 1em auto 0;display: block;font-size: .5rem;}
}
@media (orientation: landscape) and (max-width: 900px){
footer .copyright{color: #fff; margin: 1em auto 0;display: block;font-size: .7rem;}
}