@charset "UTF-8";

/*-------------------------
__base_style
-------------------------*/
body {color: #000000;position:relative;font-weight: 300;}
#content {padding-top: 100px;}
@media screen and (max-width: 767px) {
#content {padding-top: 60px;}
}

#wrap{min-width:1200px;}
#wrap .pc {display: block;}
#wrap .sph {display: none;}
@media screen and (max-width: 1060px) {
  #wrap{min-width: initial;}
}
@media screen and (max-width: 767px) {
#wrap .pc {display: none;}
#wrap .sph {display: block;}
}

/*-------------------------
__header
-------------------------*/
#header_back {width: 100%; min-width: 1200px; height: 100px; position: fixed;left: 0;top: 0; z-index: 99;}
#header{width: 100%; height: 100px;background: #ffffff;position: relative;}
#header #header_logo {position: absolute;top: 30px;left: 20px;height: 40px;width: auto;}
#header #header_logo img {width: auto;height: 40px;}
#header .header_menu {text-align: right;position: absolute;top: 50%;right: 330px;transform: translateY(-50%);}
#header .header_entry {position: absolute;top: 20px;right: 100px;}
#header a.header_entry_btn {font-size: 30px;display: inline-block;width: 180px;text-align: center;text-decoration: none;line-height: 55px;padding: 0 0 5px;outline: none;color: #FFFFFF;background-color: #ef8200;-webkit-transition: all .5s;transition: all .5s;}
#header a.header_entry_btn:hover {color: #FFFFFF;background-color: #e50038;}
@media screen and (max-width: 1060px) {
  #header_back {min-width: initial;}
  #header .header_menu {display: none;}
}
@media screen and (max-width: 767px) {
  #header_back {height: 60px;}
  #header{height: 60px;}
  #header #header_logo {top: 15px;left: 10px;height: 30px;}
  #header #header_logo img {height: 30px;}
  #header .header_entry {top: 10px;right: 70px;}
  #header a.header_entry_btn {font-size: 4vw;width: 20vw;line-height: 37.5px;padding: 0 0 2.5px;}
}
@media screen and (max-width: 374px) {
  #header #header_logo img {height: 23px;}
}

/*-------------------------
__gm
-------------------------*/
@keyframes bugfix {
  from {padding: 0;}
  to {padding: 0;}
}
@-webkit-keyframes bugfix {
  from {padding: 0;}
  to {padding: 0;}
}
#header #overlay-button {position: absolute;right: 20px;top: 20px;padding: 28px 4px;z-index: 5;cursor: pointer;user-select: none;}
#header #overlay-button span {height: 4px;width: 52px;background-color: #000000;position: relative;display: block;transition: all .2s;}
#header #overlay-button span:before {top: -16px;visibility: visible;}
#header #overlay-button span:after {top: 16px;}
#header #overlay-button span:before, #overlay-button span:after {height: 4px;width: 52px;background-color: #000000;position: absolute;content: "";transition: all .2s;left: 0;}
#header input[type=checkbox] {display: none;}
#header input[type=checkbox]:checked ~ #overlay {visibility: visible;}
#header input[type=checkbox]:checked ~ #overlay-button:hover span, input[type=checkbox]:checked ~ #overlay-button span {background: transparent;}
#header input[type=checkbox]:checked ~ #overlay-button span:before {transform: rotate(45deg) translate(12px, 11px);background-color: #ffffff;}
#header input[type=checkbox]:checked ~ #overlay-button span:after {transform: rotate(-45deg) translate(12px, -11px);background-color: #ffffff;}
@media screen and (max-width: 767px) {
  #header #overlay-button {right: 10px;top: 10px;padding: 18px 0;;}
  #header #overlay-button span {width: 40px;}
  #header #overlay-button span:before {top: -12px;}
  #header #overlay-button span:after {top: 12px;}
  #header #overlay-button span:before, #overlay-button span:after {width: 40px;}
  #header input[type=checkbox]:checked ~ #overlay-button span:before {transform: rotate(45deg) translate(10px, 7px);}
  #header input[type=checkbox]:checked ~ #overlay-button span:after {transform: rotate(-45deg) translate(10px, -7px);}
}

#header #overlay {height: 100vh;width: 100vw;background: rgba(0,0,0,0.9);z-index: 2;visibility: hidden;position: fixed;top: 0;right: 0;bottom: 0;left: 0;}
#header #overlay.active {transition: all 2s ease-out;}
#header #overlay #overlay_logo {position: absolute;top: 30px;left: 20px;height: 40px;width: auto;}
#header #overlay #overlay_logo img {width: auto;height: 40px;}
#header .overlay_menu {position:relative;width: 100vw;height: 100vh;}
#header .overlay_menu ul {text-align: left;width: 80vw;position: absolute;top: 50%;left: 50%;transform: translateY(-50%) translateX(-50%);display:flex;flex-wrap:wrap;}
#header .overlay_menu ul li {width: 25%;}
#header .overlay_menu ul li p {font-size: 1.6vw;line-height: 2;font-weight: 700; color: #ffffff;margin: 0 0 1.5vw}
#header .overlay_menu ul li.overlay_sns {width: 100%;display: block;text-align: center;padding: 5vw 0 0;}
#header .overlay_menu ul li.overlay_sns ul {margin: auto;text-align: center;}
#header .overlay_menu ul li.overlay_sns ul li {width: 80px;height: 80px; display: inline-block;margin-right: 20px;background: #ffffff;}
#header .overlay_menu ul li.overlay_sns ul li img {vertical-align: bottom;width: 100%;height: auto;}
#header .overlay_menu ul li.overlay_sns ul li img:hover {opacity: .5;}
#header .overlay_menu ul li.overlay_sns ul li:last-child {margin-right: 0;}
#header .overlay_menu ul li.overlay_sns ul li:first-child {background: #000000;}
#header .overlay_menu ul li ul {width: 100%;display: block;position: inherit;top: inherit;left: inherit;transform: inherit;}
#header .overlay_menu ul li ul li {width: 100%;}
#header .overlay_menu ul li ul li p {font-size: 1.2vw;line-height: 2;font-weight: 400; padding: 0 0 0 25px;margin: 0; position: relative;}
#header .overlay_menu ul li ul li p a {color: #ffffff;text-decoration: none;}
#header .overlay_menu ul li ul li p a:hover {color: #ef8200;}
#header .overlay_menu ul li ul li p:before {content: '';position: absolute;top: 50%;display: inline-block;width: 15px;height: 1px;background-color: #ffffff;left:0;}
@media screen and (max-width: 1060px) {
  #header .overlay_menu ul li {width: 50%;margin: 0 0 5vw;}
  #header .overlay_menu ul li p {font-size: 2.8vw;margin: 0 0 2.5vw;}
  #header .overlay_menu ul li.overlay_sns ul li {margin-right: 5vw;}
  #header .overlay_menu ul li ul li {margin: 0 ;}
  #header .overlay_menu ul li ul li p {font-size: 2vw;}
}
@media screen and (max-width: 767px) {
  #header #overlay #overlay_logo {top: 15px;left: 10px;height: 30px;}
  #header #overlay #overlay_logo img {height: 30px;}
  #header .overlay_menu > ul{display:block;width:100%;height:calc(100vh - 120px);overflow-y:auto;}
  #header .overlay_menu > ul > li{padding:0 10vw;box-sizing: border-box;}
  #header .overlay_menu ul li {width: 100%;}
  #header .overlay_menu ul li p {font-size: 4.4vw;}
  #header .overlay_menu ul li.overlay_sns ul li {width: 15vw;height: auto;}
  #header .overlay_menu ul li ul li p {font-size: 3.5vw;}
}

/* ナビゲーションメニュー */
#header .nav-menu {color: #000000;}
#header .menu-list {display: flex;}
#header .menu-item {margin: 0 0 0 20px;position: relative;transition: background-color .3s;}
#header .menu-item:hover .drop-menu-list {transform: scaleY(1);}
#header .menu-item:hover {background-color: #ffffff;transition: background-color .3s;}
#header .drop-menu-item:hover {transition: opacity .3s;}
#header .menu-item a {font-size: 16px;align-items: center;color: #000000;display: flex;height: 100px;justify-content: center;text-decoration: none;}
/* ドロップダウンメニュー */
#header .drop-menu {position: relative;}
#header .drop-menu-list {left: 0;position: absolute;top: 100%;transform: scaleY(0);transform-origin: center top;transition: transform .3s;width: max-content;z-index: 1;}
#header .drop-menu-item {text-align: left;background-color: rgba(255,255,255,0.8);transition: opacity .3s;}
#header .drop-menu-item:hover {background: rgba(0,0,0,0.8); transition: all .5s;}
#header .drop-menu-item a:hover {color: #ffffff;transition: all .5s;}
#header .drop-menu-item a:hover:before {content: '';position: absolute;top: 50%;display: inline-block;width: 15px;height: 1px;background-color: #ffffff;left:0;}
#header .drop-menu-item a {line-height: 40px;display: block;height: 40px;padding: 0 40px 0 25px;position: relative;}
#header .drop-menu-item a:before {content: '';position: absolute;top: 50%;display: inline-block;width: 15px;height: 1px;background-color: #000000;left:0;}

/*-------------------------
__topic_path
-------------------------*/
.topic_path{clear:both;padding:10px;background: #e3e6e6;}
.topic_path ul{width:100%;text-align:left;}
.topic_path li{font-size:1.4em;line-height:1.4;color:#000000;vertical-align:top;display:inline-block;}
.topic_path li:before{content:">";color:#000000;margin-left:5px;margin-right:5px;}
.topic_path li:first-child:before{content:"";margin:0;}
.topic_path li a{color:#000000;text-decoration:underline;}
.topic_path li a:hover{text-decoration:none;}
@media screen and (max-width: 767px) {
  .topic_path{padding:2% 5%;}
  .topic_path ul{overflow-x: auto;white-space: nowrap;-webkit-overflow-scrolling: touch;-ms-overflow-style: none;scrollbar-width: none;}
  .topic_path ul::-webkit-scrollbar {display:none;}
  .topic_path li{font-size:1.2em;color:#666;}
  .topic_path li:before{color:#666;}
}

/*-------------------------
__content
-------------------------*/
#content #main{display:block;}

#content .main_pic {width: 100%;height: auto;position: relative;margin: 0 0 100px;}
#content .main_pic img {width: 100%;height: auto;}
#content .main_pic .main_title_block {text-align: left;position: absolute;top: 50%;left: 5vw;transform: translateY(-50%);}
#content .main_pic .mtb {display: block;}
#content .main_pic h1 {font-size: 2.4vw;line-height: 1;font-weight: 700; color: #ffffff; display: block;}
#content .main_pic p {font-size: 1.4vw;line-height: 1em;font-weight: 700; color: #ef8200; position: relative;display: inline-block;}
#content .main_title {display:inline-block; position: relative;}
#content .main_title::before {content: "";display: block;background-color: #000000;position: absolute;top: 0;left: 0;right: 100%;bottom: 0;}
#content .main_title.__anima::before {animation: ani_bg 0.9s ease-out 1 forwards;animation-delay: 1s;}
#content .main_title.__anima2::before {animation: ani_bg 0.9s ease-out 1 forwards;animation-delay: 2s;}
#content .main_title_under {position: relative;padding: 0 0 1vw; margin: 0 0 2vw;}
#content .main_title_under:before {content: '';position: absolute;bottom: -.8em;display: inline-block;width: 2vw;height: 2px;left: 0;background-color: #ef8200;border-radius: 2px;display: block;z-index: 0;animation: fadeIn 1s linear;animation-fill-mode: both;animation-delay: 2s;}
#content .main_title span {position: relative;z-index: 1;opacity: 0;}
#content .main_title.__anima span {animation: ani_fadein 0.5s ease-out 0.7s 1 forwards;animation-delay: 1.8s;}
#content .main_title.__anima2 span {animation: ani_fadein 0.5s ease-out 0.7s 1 forwards;animation-delay: 2.8s;}
@media screen and (max-width: 1060px) {
  #content .main_pic {margin: 0 0 10vw;}
  #content .main_pic h1 {font-size: 3.9vw;}
  #content .main_pic p {font-size: 2.9vw;}
}
@media screen and (max-width: 767px) {
  #content .main_pic {margin: 0 0 5vw;}
  #content .main_pic h1 {font-size: 5vw;}
  #content .main_pic p {font-size: 3vw;}
  #content .main_title_under { margin: 0 0 5vw;}
  #content .main_title_under:before {width: 5vw;}
}
@keyframes fadeIn{
  0%{opacity: 0;}
  100%{opacity: 1;}
}
@keyframes ani_fadein {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
@keyframes ani_bg {
  0% {left: 0;right: 100%;}
  40% {left: 0;right: 0;}
  60% {left: 0;right: 0;}
  100% {left: 100%;right: 0;}
}

.wide_back {background: #e3e6e6;padding:  100px 0;}
.navy {background: #1e1e3c;padding:  100px 0;}
@media screen and (max-width: 1060px) {
  .wide_back {padding: 5vw 0 5vw;}
  .navy {padding: 5vw 0 5vw;}
}
@media screen and (max-width: 767px) {
  .wide_back {padding: 5vw 0 10vw;}
  .navy {padding: 5vw 0 10vw;}
}

.box{width:100%;box-sizing:border-box;list-style: none;}
.box{opacity: 0;}
.fadeUp {animation-name:fadeUpAnime;animation-duration:1s;animation-delay: .5s;animation-fill-mode:forwards;opacity: 0;}
@keyframes fadeUpAnime{
  from {opacity: 0;transform: translateY(60px);}
  to {opacity: 1;transform: translateY(0);}
}
.fadeUpTrigger{opacity: 0;}
.faderight {animation-name:faderightAnime;animation-duration:1s;animation-delay: .5s;animation-fill-mode:forwards;opacity: 0;}
@keyframes faderightAnime{
  from {opacity: 0;transform: translateX(60px);}
  to {opacity: 1;transform: translateX(0);}
}
.faderightTrigger{opacity: 0;}

.fade {animation-name:fadeAnime;animation-duration:1s;animation-fill-mode:forwards;opacity: 0;}
@keyframes fadeAnime{
  from {opacity: 0;}
  to {opacity: 1;}
}
.fadeTrigger{opacity: 0;}

/*-------------------------
__footer
-------------------------*/
#footer{width: 100%;}
#footer .footer_entry {vertical-align: middle;}
#footer .footer_entry p {margin: auto;}
#footer a.footer_entry_btn {line-height: 120px;font-weight: 700;width: 100%;text-align: center;text-decoration: none;outline: none;color: #FFFFFF;background-color: #ef8200;-webkit-transition: all .5s;transition: all .5s;display: block;padding: 0 0 .6em}
#footer a.footer_entry_btn:hover {color: #FFFFFF;background-color: #e50038;}
#footer a.footer_entry_btn span.mynavi {font-size: 32px;}
#footer a.footer_entry_btn span {font-size: 54px;line-height: 120px;vertical-align: middle;}
#footer .footer_menu {width: 960px;margin: auto;padding: 100px 0;position: relative;}
#footer .footer_menu #footer_logo {width: 178px;height: auto;}
#footer .footer_menu #footer_logo img {width: 100%;height: auto;margin: 0 0 60px;}
#footer .footer_menu ul {display:flex;flex-wrap:wrap;}
#footer .footer_menu ul li {width: 25%;}
#footer .footer_menu ul li p {font-size: 18px;line-height: 2;text-align: left;font-weight: 700; color: #000000;margin: 0 0 20px;}
#footer .footer_menu ul li ul {width: 100%;display: block;position: inherit;top: inherit;left: inherit;transform: inherit;}
#footer .footer_menu ul li ul li {width: 100%;}
#footer .footer_menu ul li ul li p {font-size: 14px;line-height: 2;text-align: left;font-weight: 400; padding: 0 0 0 25px;margin: 0; position: relative;}
#footer .footer_menu ul li ul li p a {color: #000000;text-decoration: none;}
#footer .footer_menu ul li ul li p:before {content: '';position: absolute;top: 50%;display: inline-block;width: 15px;height: 1px;background-color: #000000;left:0;}
#footer .footer_sns {position: absolute;top: 100px;right: 0;}
#footer .footer_sns ul li {width: 60px;height: auto;margin: 0 0 0 10px;}
#footer .footer_sns ul li img {width: 100%;height: auto;}
#footer .guide {text-align: center;padding: 60px 0 0;}
#footer a.guide_btn {font-size: 24px;line-height: 1.6;font-weight: 700;width: 100%;text-align: center;text-decoration: none;outline: none;color: #FFFFFF;background-color: #ef8200;-webkit-transition: all .5s;transition: all .5s;display: block;width: 360px;position: relative;padding: 20px 40px 30px 0;margin: auto;}
#footer a.guide_btn:hover {color: #FFFFFF;background-color: #e50038;}
#footer a.guide_btn span {font-size: 16px;line-height: 1; display: block;}
#footer a.guide_btn:after {content: '';display: inline-block;width: 40px;height: 40px;background-image: url(/recruit/images/flow.svg);background-size: contain;vertical-align: middle;position: absolute;right: 20px;top: 50%;transform: translateY(-50%);}
#footer .copyright {width: 100%;text-align: center; background: #000000;}
#footer .copyright p {font-size: 14px;line-height: 3;color: #ffffff;}

@media screen and (max-width: 1060px) {
  #footer a.footer_entry_btn {line-height: 100px;}
  #footer a.footer_entry_btn span {line-height: 100px;}
  #footer .footer_menu {width: 90%;padding: 10vw 0;}
  #footer .footer_menu #footer_logo img {margin: 0 0 5vw;}
  #footer .footer_menu ul li {width: 50%;margin: 0 0 5vw;}
  #footer .footer_menu ul li p {font-size: 2.8vw;margin: 0 0 2.5vw;}
  #footer .footer_menu ul li ul li {margin: 0;}
  #footer .footer_menu ul li ul li p {font-size: 2vw;}
  #footer .footer_sns {top: 10vw;}
  #footer .guide {padding: 0;}
}
@media screen and (max-width: 767px) {
  #footer a.footer_entry_btn {line-height: 70px;}
  #footer a.footer_entry_btn span.mynavi {font-size: 5vw;}
  #footer a.footer_entry_btn span {font-size: 8vw;line-height: 70px;}
  #footer .footer_menu #footer_logo {margin: auto;}
  #footer .footer_menu ul {width: 90%;margin: auto;display:flex;flex-wrap:wrap;}
  #footer .footer_menu ul li {width: 100%;}
  #footer .footer_menu ul li p {font-size: 4.4vw;}
  #footer .footer_menu ul li ul li p {font-size: 3.5vw;}
  #footer .footer_sns {width: 100%;display: block;text-align: center; position: inherit;top: inherit;right: inherit;padding:0 0 5vw;}
  #footer .footer_sns ul {margin: auto;text-align: center;display: inline-block;}
  #footer .footer_sns ul li {width: 15vw;height: auto; display: inline-block;margin:0 2.5vw 0;}
  #footer .footer_sns ul li img {vertical-align: bottom;width: 100%;height: auto;}
  #footer .footer_sns ul li:last-child {margin-right: 0;}
  #footer a.guide_btn {font-size: 6vw;width: 80vw;padding: 2.5vw 10vw 5vw 0;}
  #footer a.guide_btn span {font-size: 4vw;}
}

.re_top{display:none;height:50px;width:50px;overflow:hidden;position:fixed;z-index:9999;right:15px;bottom:15px;}
.re_top a{display:block;}
.re_top a:hover img{margin-top:-50px;}
@media screen and (max-width: 767px) {
  .re_top{display:none;height:40px;width:40px;right:2.5vw;bottom:2.5vw;}
  .re_top img {width: 100%;height: auto;}
  .re_top a:hover img{margin-top:-40px;}
}

/*-------------------------
__topics詳細ページ用
-------------------------*/

#topics_detail{ margin-bottom: 100px;}
#topics_detail > table{ width: calc(100% - 40px); max-width: 1040px; padding: 20px; box-sizing: border-box; margin: 0 20px;}
#topics_detail > table table{ width: 100%;}
#topics_detail > table .title_border,
#topics_detail > table .text13{ padding: 20px; box-sizing: border-box;}
#topics_detail > table img{ width: 100%; height: auto;}

@media screen and (max-width: 1060px) {
#topics_detail{ margin-bottom: 70px;}
#topics_detail > table{ width: 90%; margin: 0 auto;}
}

@media screen and (max-width: 767px) {
#topics_detail{ margin-bottom: 30px;}
#topics_detail > table{ padding: 10px;}
#topics_detail > table .title_border,
#topics_detail > table .text13{ padding: 10px;}
}