@charset "utf-8";

.m_header{background-color:#f9f9f9;position: relative;}
.m_header .box{ max-width:1920px;margin-right:auto;margin-left:auto; }
.m_header .box .text{max-width:1320px;margin-right:auto;margin-left:auto;height:100%;align-items:center;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.m_header .box .text h1{font-size:36px;line-height:1.6;margin-bottom:14px;width:100%;}
.m_header .box .text p{font-size:16px;line-height:1.75;}

.m_wrapper {position: relative;background:#fff;text-align:center;background: url(../img/bg_yellow.png) 0% 0% no-repeat;-webkit-background-size:100% auto;background-size:100% auto;}
.m_white_bg,
.m_red_bg{position: absolute;top:0;left:0;width: 100%;filter:drop-shadow(0 10px 10px rgba(0,0,0,0.2))}

.m_white_bg .base {background: #fff;width: 100%;height: 543px;}
.m_white_bg .polygon {clip-path: polygon(100% 40%, 0 0, 100% 0);background: #fff;width: 100%;height: 370px;}
.m_red_bg .base {height: 132px;background: #ffd900;width: 100%;}
.m_red_bg .polygon {height: 354px;clip-path: polygon(100% 0%, 0 0, 0% 40%);background: #ffd900;}

.m_wrapper .m_contents {padding:55px 0 130px;max-width:1408px;margin:0 auto;position: relative;}
.m_wrapper .m_main {padding:58px 20px 55px;max-width: 1300px;margin:0 auto;background:#fff;box-shadow: 0 10px 10px rgba(0,0,0,0.2);}
.m_wrapper .m_sub {padding:0 54px;}

.m_main section{transition: ease-in-out .3s;overflow-y:hidden;max-height:0;}
.m_main section.on{max-height: 1000px;}

section > h2{font-size:20px;font-weight:bold;text-align:center;}

.m_wrapper .m_main .word{/*font-size:28px;*/font-size:20px;font-weight:bold;margin-bottom:15px;}
.m_wrapper .m_main .word span{display: inline-block;padding-right:60px;position: relative;}
.m_wrapper .m_main .box.required .word span::after{font-size:14px;line-height:24px;color:#fff;display: block;content:"必須";position: absolute;right: 0;top:3px;width: 44px;height:24px;background-color: #CF3A43;}
.m_wrapper .m_main input[type="text"]{font-size:20px;width:100%;border:2px solid #ffd900;border-radius: 5px;padding:24px 35px;background:#fff;}
.m_wrapper .m_main input[type="text"].is_active{background:#fff;}
.m_wrapper .m_main select{font-size:20px;width:100%;border:2px solid #ffd900;border-radius: 5px;padding:24px 35px;background: url(../img/select_arrow.png) no-repeat 98% 50% #fff;color:#999;font-weight:bold;appearance: none;}

.m_wrapper .m_main .error input[type="text"],
.m_wrapper .m_main .error select{border-color:#ffd900;}

.m_wrapper .m_main .divine_input{font-size:20px;padding-right:10px;display: flex;align-items: flex-end;justify-content: space-between;}
.m_wrapper .m_main .divine_input select{width:calc(100% - 65px);}

.m_wrapper .m_main .warnning {padding:5px 0 0 18px;color:#cf3a43;text-align:left;font-weight:bold;display:none;}
.m_wrapper .m_main .error .warnning{display:block;}

.m_wrapper .m_main .step_navi {margin:30px auto 0;max-width:528px;}
.m_wrapper .m_main .step_navi ul{display:flex;}
.m_wrapper .m_main .step_navi li{width: 50%;height:83px;}
.m_wrapper .m_main .step_navi li.back{padding-left:12px;}
.m_wrapper .m_main .step_navi li.step{padding-left:2px;}
.m_wrapper .m_main .step_navi li a{display: block;-webkit-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

.m_wrapper .m_main .step_navi li.back a{color:#999;position: relative;font-weight:bold;padding:19px 0 19px 42px;text-align:left;font-size:16px;}
.m_wrapper .m_main .step_navi li.back a::after{position: absolute;content:"‹";display:block; top:50%;left:8px;margin-top:-10px;width:14px;font-size:20px;font-weight:bold;height:20px;line-height: 20px;}

.m_wrapper .m_main .step_navi li.step a{font-weight:bold;font-size:15px;background:url(../img/yellow_arrow.png) 100% 50% no-repeat;padding:7px 35px 5px 0;height:83px;text-align:center;}
.m_wrapper .m_main .step_navi li.step a span{font-size:27px;line-height: 32px;}

.m_wrapper .m_main .step_navi.regist{padding-top:90px;position: relative;}
.m_wrapper .m_main .step_navi.regist li.end a{position:absolute;width:100%;height:105px;top:0;left:0;}


.hope_consult .add {font-size:20px;font-weight:bold;margin:0 auto 10px;padding:0 31px;position: relative;max-width:292px;color:#c81e29;}
.hope_consult .add::after,.hope_consult .add::before{bottom:2px;position: absolute;content:"";display:block;height:17px;width:17px;background:none 50% 50% no-repeat;}
.hope_consult .add::after{left:0;background-image:url(../img/redline_left.jpg);}
.hope_consult .add::before{right:0;background-image:url(../img/redline_right.jpg);}
.hope_consult .word {font-weight: bold;padding-bottom:20px;margin-bottom: 16px;position: relative;}

.hope_consult .box {max-width:704px;margin:0 auto;}
.hope_consult .box ul {width:100%;display:flex;flex-wrap: nowrap;justify-content: space-between;}
.hope_consult .box li {max-width:334px;width:47.44%}
.hope_consult .box li a{font-size:28px;display: block;border:3px solid #ffd900;padding:18px;background-color: #ffd900;font-weight: bold;border-radius: 10px;-webkit-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

.occupation {max-width:560px;margin: 0 auto;}
.occupation .status {margin-bottom:30px;}
.occupation .plus {max-width:174px;margin:15px auto 0;color:#999;font-weight:bold;display: inline-block;}
.occupation .box#occ_02,.occupation .box#occ_03{margin-top: 14px;}

.base_info {max-width:560px;margin: 0 auto;}
.base_info .status {margin-bottom:30px;}
.base_info .box{margin-bottom:30px;}
.base_info .agree{margin-bottom:55px;padding-top:11px;}
.base_info .agree .in_box{background:url(../img/icon_imp.jpg) no-repeat 0% 50%;display: inline-block;}
.base_info .agree a{text-decoration:underline;font-weight:bold;}
.base_info .agree .in_box.checked{background-image:url(../img/icon_check.jpg);}
.base_info .agree .in_box label{display:block;}
.base_info .agree .in_box label input{opacity:0;}
.base_info .agree .in_box label:hover,
.base_info .agree .in_box label input:hover{cursor:pointer;}

.complete {max-width:560px;margin: 0 auto;}
.complete .status {margin-bottom:30px;}
.complete .box .announce {font-weight:bold;font-size:13px;margin-bottom: 62px;}
.complete .box .button {margin-bottom: 57px;font-weight:bold;}
.complete .box .button p{font-size:13px;margin: 0 auto 12px;color:#ffd900;display: inline-block;padding:0 35px;position: relative;}
.complete .box .button p::after,.complete .box .button p::before{bottom:2px;position: absolute;content:"";display:block;height:17px;width:17px;background:none 50% 50% no-repeat;}
.complete .box .button p::after{left:0;background-image:url(../img/redline_left.jpg);}
.complete .box .button p::before{right:0;background-image:url(../img/redline_right.jpg);}
.complete .box .button a {font-size:15px;background-color: #fff;line-height:24px;padding:15px 10px;display: block;border-radius: 20px;border: 2px solid #ffd900;-webkit-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

.m_wrapper .complete .step_navi {max-width:150px;}
.m_wrapper .m_main .complete .step_navi li.back{width:100%;}

.m_sub h2{font-weight:bold;font-size:32px;min-height:40px;margin:0 -54px 28px;line-height:38px;color:#ffd900;position: relative;overflow-x: hidden;}
.m_sub h2::before{content:"";border-bottom:1px dashed #333;display: block;position: absolute;top:50%;left:50%;width:50%;height:1px;margin-left:186px}
.m_sub h2::after{content:"";border-bottom:1px dashed #333;display: block;position: absolute;top:50%;right:50%;width:50%;height:1px;margin-right:186px}
.m_sub h2 span{display: inline-block;padding:0 10px;position: relative;}
.m_sub .boxes {display: flex;flex-wrap: wrap;}
.m_sub .boxes .box {text-align:left;position: relative;width:23.07%;background:#fff;margin: 0 2.538% 40px 0;padding:45px 20px 40px;}
.m_sub .boxes .box:nth-child(4n){margin-right:0;}
.m_sub .boxes .box .new {position: absolute;top:0;right:0;width:84px;height:54px;background: url(../img/new.png) 100% 0% no-repeat;text-indent:-150%;overflow: hidden;}
.m_sub .boxes .box h3{font-size:18px;font-weight: bold;margin-bottom:45px;position: relative;}
.m_sub .boxes .box p{font-size:15px;color:#999;line-height:2;text-align: left;font-weight:bold;line-height:1.3;}
.m_sub .btn_area {max-width:600px;margin: 0 auto;}
.m_sub .btn_area p{font-size:15px;font-weight:bold;margin-bottom:5px;color:#ffd900;display: inline-block;padding:0 50px;position: relative;}
.m_sub .btn_area p::after,
.m_sub .btn_area p::before{content:"";background:none 50% 50% no-repeat;display: block;top:0;width:17px;height:17px;position: absolute;}
.m_sub .btn_area p::after{left:0;background-image:url(../img/redline_left.jpg);}
.m_sub .btn_area p::before{right:0;background-image:url(../img/redline_right.jpg);}
.m_sub .btn_area a.button {font-size:20px;font-weight:bold;line-height:24px;border:2px solid #ffd900;padding:18px 20px;background-color: #ffd900;color: #fff;border-radius: 20px;display: block;-webkit-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

.f_wrapper {position:relative;text-align:center;min-height:120px;}
.f_wrapper .box{left: 10%;bottom:13px;position: absolute;}
.f_wrapper .f_navi {padding: 60px 0 0 376px;display: flex;}
.f_wrapper .f_navi li{font-size:18px;margin-left: 45px;min-width: 90px;padding-bottom:13px;}
.f_wrapper .f_navi li a{color:#999;-webkit-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;}

.f_wrapper .f_privacy {display: flex;width:360px;align-items:flex-end;position:absolute;bottom:0;left:0;}
.f_wrapper .f_privacy img{width:100px;margin-right:5px;}
.f_wrapper .f_privacy figcaption{font-size:13px;color: #999;text-align:left;}
.f_wrapper .f_logos {position: absolute;bottom:13px;right:10%;width: 190px;text-align:center;}
.f_wrapper .f_logos .copy {padding-top: 5px;font-size:12px;}


@media (max-width: 1536px) {
    .m_wrapper .m_contents{padding:55px 40px 80px;}

    .m_wrapper .m_sub{padding:0;}
    .m_sub h2{margin-right:0;margin-left:0;}
    .m_sub .boxes{max-width:820px;margin:0 auto;}
    .m_sub .boxes .box{width:49%;margin-right:2%;}
    .m_sub .boxes .box:nth-child(2n){margin-right:0;}

    .f_wrapper{min-height:262px;}
    .f_wrapper .f_navi{padding:0 40px;display: block;text-align: left;}
    .f_wrapper .f_navi li{margin:0;padding-bottom:20px;}
    .f_wrapper .box{position: static;}
    .f_wrapper .f_privacy{left:40px;bottom:13px;}
    .f_wrapper .f_logos {right:40px;}
}
@media (max-width: 1320px) {
	.m_header .box{background-position:115% 50%;}
	.m_header .box .text{background-color:rgba(255,255,255,0.3);}
	.m_header .box .text h1{font-size:30px;}
}

@media (max-width: 1280px) {
    .m_wrapper .m_contents{padding-right:20px;padding-left:20px;}

    .f_wrapper .box{left:20px;}
    .f_wrapper .f_logos {right:20px;}
}

@media screen and (min-width:769px) and ( max-width:1080px) {
	.h_wrapper .h_visual{min-height:300px;}
}

@media (min-width: 768px) {
    .pc{}
    .sp{display: none;}
    
	.m_header{max-height: 430px;min-height: 360px;}
	.m_header:before{ padding-top: 22.395%;content:"";display: block; }
	.m_header .box{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background:url(../img/career_bg.png) 100% 50% no-repeat;-webkit-background-size:auto 100%;background-size:auto 100%;}
	.m_header .box .image{display:none;}
	.m_header .box .text{padding:100px 20px 0;}
    
    .m_wrapper .m_main .step_navi li a:hover{text-decoration: none;}
    .m_wrapper .m_main .step_navi li.back a:hover{color:#999;}

    .h_wrapper .h_visual::before {padding-top: 25.6%;}
    .h_wrapper .h_visual .image {background-image: url(../img/visual_pc.jpg);/* background-image: url(../img/visual_pc.png); */}

    .hope_consult .box li a:hover{color:#ffd900;background: #fff;text-decoration: none;}
    .complete .box .button a:hover{color:#fff;background-color:#ffd900;}
    
    .m_sub .boxes .box{box-shadow: 0 10px 10px rgba(0,0,0,0.2);border: 0.67px solid #ccc;}
    .m_sub .btn_area a.button:hover{background-color: #fff;color:#ffd900;}
    .f_wrapper .f_navi li a:hover{color:#ffd900;}
    
    #main[status="1"] .m_white_bg .base{height:664px;}
    #main[port="1"] .m_white_bg .base{height:752px;}
    #main[port="2"] .m_white_bg .base{height:792px;}
    #main[status="2"] .m_white_bg .base{height:772px;}
    #main[status="3"] .m_white_bg .base{height:912px;}
    #main[status="4"] .m_white_bg .base{height:758px;}
    #main[status=""] .m_white_bg .base{height:543px;}
    #main[status="100"] .m_white_bg .base{height:800px;}
}

@media (max-width: 767px) {
    .pc{display: none;}
    .sp{}
    
	.m_header .box .image{background: url(../img/career_bg.jpg) 100% 50% no-repeat;background-size: auto;-webkit-background-size: cover;background-size: cover;position: relative;height:240px;}
	.m_header .box .text{padding:40px 20px;}
	.m_header .box .text h1{font-size:24px;}

    .h_wrapper .h_visual {box-shadow: 0 10px 10px rgba(0,0,0,0.2);}
    .h_wrapper .h_visual::before {padding-top: 95.68%;}
    .h_wrapper .h_visual .image {background-image: url(../img/visual_sp.png);}

    .m_white_bg, .m_red_bg{display: none;}
    .m_wrapper .m_contents{padding:0;background: #ffd900;}
    .m_wrapper .m_main,
    .m_wrapper .m_sub{margin:0;position: relative;filter: drop-shadow(0 10px 10px rgba(0, 0, 0, 0.2));}
    .m_wrapper .m_main{margin-bottom:160px;padding-bottom:55px;}
    .m_wrapper .m_sub{background: #ffd900;padding:0px 20px 60px;}
    .m_wrapper .m_main::after,
    .m_wrapper .m_sub::after{content:"";display:block;position: absolute;bottom:-100px;left:0;width: 100%;height: 100px;}
    .m_wrapper .m_main::after{z-index:100;clip-path: polygon(100% 0%, 0 0, 0% 100%);background: #fff;}
    .m_wrapper .m_sub::after{z-index:90;clip-path: polygon(100% 100%, 0 0, 100% 0);background: #ffd900;}

    .m_wrapper .m_main .word{/*font-size:24px;*/font-size:20px;margin-bottom:10px;}
    .m_wrapper .m_main .status{overflow-x:hidden;}
    .m_wrapper .m_main .status img{max-width: 120%;width:120%;margin-left:-10%;}

    .m_wrapper .m_main input[type="text"]{padding:15px;font-size:16px;}
    .m_wrapper .m_main select{font-size:16px;padding:15px;}
    .m_wrapper .m_main .box.required .word span::after{top:2px;}
    .m_wrapper .m_main ..warnning{font-size:15px;padding-left:10px;}

    .m_wrapper .m_main .step_navi li.back{width:45%;}
    .m_wrapper .m_main .step_navi li.step{width:55%;}

    .m_wrapper .m_main .step_navi li.step a{font-size:14px;}
    .m_wrapper .m_main .step_navi li.step a span{font-size:16px;}

    .m_wrapper .m_main .step_navi.regist li.step a{font-size:13px;padding-right:20px;padding-top:10px;}
    .m_wrapper .m_main .step_navi.regist li.step a span{font-size:15px}
    
    .hope_consult .add{letter-spacing: 2px;}
    .hope_consult .add::after,
    .hope_consult .add::before{bottom:auto;top:8px;}
    .hope_consult .word{padding-bottom:28px;}
    .hope_consult .box{max-width:380px;}
    .hope_consult .box li{max-width: 170px;width: 46%;}
    .hope_consult .box li a{padding:30px 10px;border-radius: 10px;border-width: 4px;font-size:26px;background-color:#ffd900;color: #333;line-height:1.3;}

    .base_info .box{margin-bottom:35px;}
    .base_info .agree{padding-top:0;}

    .complete .box .button{margin-bottom:20px;}

    .m_sub h2{font-size:24px;margin:0 0 45px;border-bottom:2px solid #fff;padding-bottom:6px;color:#fff;}
    .m_sub h2::after,.m_sub h2::before{display: none;}
    .m_sub .boxes .box{width:100%;margin:0 0 20px;padding:30px 20px;border-radius: 20px;}
    .m_sub .boxes .box .new{background-image: url(../img/new_sp.png);width:65px;height:80px;right:26px;top:1px;background-size: auto 80px;}
    .m_sub .boxes .box h3{margin-bottom:18px;margin-right:72px;font-size:20px;}
    .m_sub .btn_area p{color:#fff;font-size:18px;}
    .m_sub .btn_area p::after,.m_sub .btn_area p::before{display: none;}
    .m_sub .btn_area a.button{background-color: #fff;color:#ffd900;}

    .f_wrapper{padding:25px 30px 20px;}
    .f_wrapper .box{margin-bottom:60px;}
    .f_wrapper .f_navi{padding:0;}
    .f_wrapper .f_navi li{font-size:15px;padding-bottom:12px;}
    .f_wrapper .f_privacy{position:static;padding-top:5px;display:block;margin: 0 auto;text-align: center;}
    .f_wrapper .f_privacy img{margin:0;width:90px;}
    .f_wrapper .f_privacy figcaption{text-align: center;margin-top:10px;}
    .f_wrapper .f_logos{position: static;margin:0 auto;width:218px;right:auto;bottom:auto;}
    .f_wrapper .f_logos .copy{padding-top:45px;font-size:15px;}
}

@media (max-width: 480px) {
    .m_wrapper .m_main .step_navi li.back{width:35%;}
    .m_wrapper .m_main .step_navi li.step{width:65%;}
}

#hide_form{display:none;opacity:0;}
#step00,#step01,#step02,#step03,#step04{opacity: 0; height: 0;visibility: hidden;transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;}
#step00.on,#step01.on,#step02.on,#step03.on,#step04.on{opacity: 1;visibility: visible;height: auto;}
#occ_02,#occ_03{display:none;}
#occ_02.is_open,#occ_03.is_open{display:block;}

.m_main{transition: height 0.5s ease-in-out;}