@charset "utf-8";

/* SUBPAGE
----------------------------------------*/

header{ position:fixed; top:0; left:0; bz-index:9999;}
#wrapper{ padding-top:167px;}
.section_visual{ height:80vh; margin:0 auto; position:relative;}
.section_visual .sec_visual_til{ position:absolute; left:50%; margin-left:-121px; top:52%; margin-top:-53px; opacity:0; z-index:3; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6 ease;
-o-transition: all 0.6 ease;
transition: all 0.6 ease;}
.section_visual .sec_visual_til.active{ opacity:1; transform: translate3d(0, 0, 0);}

/* SEC LOW VISUAL */

.section_v01{ background:url(../img/message/visual.jpg) no-repeat center top; background-size:cover; }
.section_v02{ background:url(../img/business/visual.jpg) no-repeat center top; background-size:cover; }
.section_v03{ background:url(../img/interview/visual.jpg) no-repeat center top; background-size:cover; }
.section_v04{ background:url(../img/recruit/visual.jpg) no-repeat center top; background-size:cover; }
.section_v05{ background:url(../img/data/visual.jpg) no-repeat center top; background-size:cover; }

.sec_head{ margin:0 auto 50px auto;}
.section_l_overtil{ margin:0 auto; padding:0 0 75px 0;}
.section_l_overtil02a{ margin:0 auto; padding:50px 0 75px 0;}
.section_l_overtil02{ margin:0 auto; padding:50px 0 50px 0;}
.section_l_overtil03{ margin:0 auto; padding:0px 0 50px 0;}

.section_l02{ width:100%; margin:0 auto; padding:130px 0 70px 0; clear:both;}
.section_l02inner{ opacity:0; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6 ease;
-o-transition: all 0.6 ease;
transition: all 0.6 ease;}
.section_l02inner.active{ opacity:1; transform: translate3d(0, 0, 0);}

.section_l02_box{ width:620px; margin:0 auto;}
.section_l02_box p{ text-align:center; font-size: 114%; line-height:175%; margin:0 auto 35px auto; letter-spacing:-0.05em;}
.section_l02_box p.section_l02_box_end{ margin:0 auto;}

.section_l02_box02{ width:770px; margin:0 auto;}
.section_l02_box02 p{ text-align:center; font-size: 114%; line-height:175%; margin:0 auto; letter-spacing:-0.05em;}
.section_l02_box02 p.section_l02_box_end{ text-align:right; padding-top:10px; margin:0 auto;}

.section_l03{ width:100%; margin:0 auto; padding:0px 0 100px 0; clear:both;}
.section_l03inner{ opacity:0; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6 ease;
-o-transition: all 0.6 ease;
transition: all 0.6 ease;}
.section_l03inner.active{ opacity:1; transform: translate3d(0, 0, 0);}
.section_l03_box{ width:770px; margin:0 auto;}
.section_l03_box p{ text-align:center; font-size: 114%; line-height:175%; margin:0 auto; letter-spacing:-0.05em;}

/* INTERVIEW
----------------------------------------*/
.interview_visual{ height:90vh; margin:0 auto; position:relative; opacity:0; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;}
.interview_visual.active{ opacity:1; transform: translate3d(0, 0, 0);}

.interview_visual img.tb_visual{ display:none;}
.interview_visual img.sp_visual{ display:none;}

/* INTERVIEW VISUAL */

.int_v01{ background:url(../img/interview/01main.jpg) no-repeat center top,#fff; background-size:contain; }
.int_v02{ background:url(../img/interview/02main.jpg) no-repeat center top,#fff; background-size:contain; }
.int_v03{ background:url(../img/interview/03main.jpg) no-repeat center top,#fff; background-size:contain; }
.int_v04{ background:url(../img/interview/04main.jpg) no-repeat center top,#fff; background-size:contain; }
.int_v05{ background:url(../img/interview/05main.jpg) no-repeat center top,#fff; background-size:contain; }
.int_v06{ background:url(../img/interview/06main.jpg) no-repeat center top,#fff; background-size:contain; }

.section_interview{ padding:100px 0 60px 0; margin:0 auto; clear:both;}
.section_interview_head{ margin:0 auto 60px auto; text-align:center; max-width:92%;}
.section_interview h2{ margin:0 auto 35px auto; line-height:157%; font-size:200%; font-weight:bold;}
.section_interview h3{ margin:0 auto 45px auto; font-size:185%; line-height:157%;}
.section_interview h3 span{ font-size:61%;}
.sec_int_txt{ text-align:left; width:900px; margin:0 auto 50px auto; line-height:175%; font-size:114%;}
.section_interview h4{ margin:0 auto 55px auto;}

.int_move01,.int_move02,.int_move03,.int_move04{ opacity:0; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;}
.int_move01.active,.int_move02.active,.int_move03.active,.int_move04.active{ opacity:1; transform: translate3d(0, 0, 0); }

/* DATA
---------------------------------------*/
.section_data{ width:1120px; margin:0 auto; padding:80px 0 80px 0; clear:both;}
.section_data_catch{ font-size: 150%; font-weight:bold; line-height:2; text-align:center; margin:0 auto 60px auto;}
.data_box{ overflow:hidden; clear:both; background:#fff; padding:38px;}
.data_box ul li{ float:left; margin:0 0 50px 0; width:480px;}
.data_box ul li:nth-child(2n){ float:right; margin:0 0 50px 0; }
.data_box ul li h2{ margin:0 auto 18px auto; position:relative; line-height:1.1; border-bottom:3px solid #333; padding-bottom:6px; text-align:left; font-size: 242%; font-weight:bold;}
.data_box ul li h2 span{ display:block; position:absolute; right:0; bottom:6px; font-size:41%; font-weight:normal;}

.data_box_inner01,.data_box_inner02,.data_box_inner03,.data_box_inner04,.data_box_inner05,.data_box_inner06,.data_box_inner07,.data_box_inner08{ opacity:0; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6 ease;
-o-transition: all 0.6 ease;
transition: all 0.6 ease;}
.data_box_inner01.active,.data_box_inner02.active,.data_box_inner03.active,.data_box_inner04.active,.data_box_inner05.active,.data_box_inner06.active,.data_box_inner07.active,.data_box_inner08.active{ opacity:1; transform: translate3d(0, 0, 0);}

/* RECRUIT
----------------------------------------*/
.section_recruit{ width:1130px; margin:0 auto; overflow:hidden; clear:both; padding:115px 0 40px 0;}
.section_recruit h2{ margin:0 auto 50px auto;}
.section_recruit p{ text-align:center; line-height:200%; font-size:114%; margin:0 auto 35px auto;}
.section_recruit p.sec_rec_plst{ margin:0 auto 50px auto;}

.recruit_til{ margin:0 auto 35px auto; clear:both; font-size: 200%; text-align:left; font-weight:bold; }
.recruit_list { border-bottom:2px solid #cdcdcd; margin:0 auto 80px auto; clear:both;}
.recruit_list li{ margin:0 auto; padding: 0; background:#fff; overflow:hidden; text-align:left;}
.recruit_list li .rec_list_l{ border-top:2px solid #cdcdcd; float:left; width:250px; padding:15px 20px; font-size:114%; line-height:175%;color:#b60030; font-weight:bold; }
.recruit_list li .rec_list_r{ border-top:2px solid #cdcdcd; float:right; width:880px; padding:15px 20px; color:#000; font-size:114%; line-height:175%;}

.rec_move01,.rec_move02,.rec_move03{ opacity:0; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all 0.6s ease;}
.rec_move01.active,.rec_move02.active,.rec_move03.active{ opacity:1; transform: translate3d(0, 0, 0); }

@media screen and (max-width: 1220px) {

/* DATA
---------------------------------------*/
.section_data{ width:92%; margin:0 auto; padding:80px 0 80px 0; clear:both;}
.section_data_catch{ font-size: 150%; font-weight:bold; line-height:2; text-align:center; margin:0 auto 60px auto;}
.data_box{ overflow:hidden; clear:both; background:#fff; padding:30px 4%;}
.data_box ul li{ float:left; margin:0 0 50px 0; width:46%;}

/* RECRUIT
----------------------------------------*/
.section_recruit{ width:92%; margin:0 auto; overflow:hidden; clear:both; padding:75px 0 40px 0;}
.section_recruit h2{ margin:0 auto 50px auto;}
.section_recruit p{ text-align:center; line-height:200%; font-size:114%; margin:0 auto 35px auto;}
.section_recruit p.sec_rec_plst{ margin:0 auto 50px auto;}

.recruit_til{ margin:0 auto 35px auto; clear:both; font-size: 171%; text-align:left; font-weight:bold; }
.recruit_list { border-bottom:2px solid #cdcdcd; margin:0 auto 60px auto; clear:both;}
.recruit_list li{ margin:0 auto; padding: 0; background:#fff; overflow:hidden; text-align:left;}
.recruit_list li .rec_list_l{ border-top:2px solid #cdcdcd; float:left; width:22%; padding:15px 20px; font-size:114%; line-height:175%;color:#b60030; font-weight:bold; }
.recruit_list li .rec_list_r{ border-top:2px solid #cdcdcd; float:right; width:78%; padding:15px 20px; color:#000; font-size:114%; line-height:175%;}

}

@media screen and (max-width: 1024px) {

#wrapper{ padding-top:60px;}

.sec_head{ margin:0 auto 50px auto;}
.section_l_overtil{ margin:0 auto; padding:0 0 75px 0;}
.section_l_overtil02a{ margin:0 auto; padding:50px 0 75px 0;}
.section_l_overtil02{ margin:0 auto; padding:50px 0 50px 0;}
.section_l_overtil03{ margin:0 auto; padding:0px 0 50px 0;}

.section_l02{ width:100%; margin:0 auto; padding:70px 0 60px 0; clear:both;}

.section_l03{ width:100%; margin:0 auto; padding:0px 0 60px 0; clear:both;}
.section_l03inner.active{ opacity:1; transform: translate3d(0, 0, 0);}

/* INTERVIEW
----------------------------------------*/
.interview_visual{ height:auto; margin:0 auto; position:relative; }
.interview_visual img.tb_visual{ display:block;}
.interview_visual img.sp_visual{ display:none;}

/* INTERVIEW VISUAL */

.int_v01{ background:none; }
.int_v02{ background:none; }
.int_v03{ background:none; }
.int_v04{ background:none; }
.int_v05{ background:none; }
.int_v06{ background:none; }

.section_interview{ padding:100px 0 60px 0; max-width:92%; margin:0 auto; clear:both;}
.section_interview_head{ margin:0 auto 60px auto; text-align:center; max-width:92%;}
.section_interview h2{ margin:0 auto 35px auto; line-height:157%; font-size:185%; font-weight:bold;}
.section_interview h3{ margin:0 auto 45px auto; font-size:142%; line-height:157%;}
.section_interview h3 span{ font-size:70%;}
.sec_int_txt{ text-align:left; width:100%; margin:0 auto 50px auto; line-height:175%; font-size:114%;}
.section_interview h4{ margin:0 auto 30px auto;}

}

@media screen and (max-width: 767px) {

.section_visual{ height:350px; margin:0 auto; position:relative;}
.section_visual .sec_visual_til{ width:60%; position:absolute; left:50%; margin-left:-30%; top:36%; margin-top:0%; opacity:0; z-index:3; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6 ease;
-o-transition: all 0.6 ease;
transition: all 0.6 ease;}

/* SEC LOW VISUAL */

.section_v01{ background:url(../img/message/sp_visual.jpg) no-repeat center top; background-size:cover; }
.section_v02{ background:url(../img/business/sp_visual.jpg) no-repeat center top; background-size:cover; }
.section_v03{ background:url(../img/interview/sp_visual.jpg) no-repeat center top; background-size:cover; }
.section_v04{ background:url(../img/recruit/sp_visual.jpg) no-repeat center top; background-size:cover; }
.section_v05{ background:url(../img/data/sp_visual.jpg) no-repeat center top; background-size:cover; }

.sec_head{ margin:0 auto 50px auto; max-width:92%;}
.section_l_overtil{ margin:0 auto; padding:0 0 75px 0;}
.section_l_overtil02a{ margin:0 auto; padding:50px 0 75px 0;}
.section_l_overtil02{ margin:0 auto; padding:50px 0 50px 0;}
.section_l_overtil03{ margin:0 auto; padding:0px 0 50px 0;}

.section_l02{ width:100%; margin:0 auto; padding:60px 0 60px 0; clear:both;}

.section_l02_box{ width:92%; margin:0 auto;}

.section_l02_box02{ width:92%; margin:0 auto;}

.section_l03{ width:92%; margin:0 auto; padding:0px 0 50px 0; clear:both;}
.section_l03_box{ width:100%; margin:0 auto;}

/* INTERVIEW
----------------------------------------*/
.interview_visual{ height:auto; margin:0 auto; position:relative; }
.interview_visual img.tb_visual{ display:none;}
.interview_visual img.sp_visual{ display:block;}

/* INTERVIEW VISUAL */

.section_interview{ padding:50px 0 50px 0; margin:0 auto; clear:both;}
.section_interview h4{ margin:0 auto 0px auto;}
.section_interview h4 img{ width:100%;}

.section_interview_head{ margin:0 auto 30px auto; text-align:center; max-width:92%;}

/* DATA
---------------------------------------*/
.section_data{ width:92%; margin:0 auto; padding:50px 0 50px 0; clear:both;}
.data_box ul li{ float:none; margin:0 auto 40px auto; width:100%;}
.data_box ul li:nth-child(2n){ float:none; margin:0 auto 30px auto; }
.data_box ul li h2{ margin:0 auto 18px auto; position:relative; line-height:1.1; border-bottom:3px solid #333; padding-bottom:6px; text-align:left; font-size: 200%; font-weight:bold;}
.data_box ul li h2 span{ display:block; position:absolute; right:0; bottom:6px; font-size:42%; font-weight:normal;}

/* RECRUIT
----------------------------------------*/
.section_recruit{ width:92%; margin:0 auto; overflow:hidden; clear:both; padding:55px 0 40px 0;}
.section_recruit h2{ margin:0 auto 50px auto;}
.section_recruit p{ text-align:center; line-height:200%; font-size:114%; margin:0 auto 35px auto;}
.section_recruit p.sec_rec_plst{ margin:0 auto 50px auto;}

.recruit_til{ margin:0 auto 35px auto; clear:both; font-size: 142%; text-align:left; font-weight:bold; }
.recruit_list { border-bottom:2px solid #cdcdcd; margin:0 auto 50px auto; clear:both;}
.recruit_list li{ margin:0 auto; padding: 0; background:#fff; overflow:hidden; text-align:left;}
.recruit_list li .rec_list_l{ border-top:2px solid #cdcdcd; float:none; width:100%; padding:15px 20px; font-size:114%; line-height:175%;color:#b60030; font-weight:bold; }
.recruit_list li .rec_list_r{ border-top:none; float:none; width:100%; padding:0px 20px 15px 20px; color:#000; font-size:114%; line-height:175%;}

}

@media screen and (max-width: 480px) {

.section_visual{ height:260px; margin:0 auto; position:relative;}
.section_visual .sec_visual_til{ width:60%; position:absolute; left:50%; margin-left:-30%; top:30%; margin-top:0%; opacity:0; z-index:3; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6 ease;
-o-transition: all 0.6 ease;
transition: all 0.6 ease;}

}


@media screen and (max-width: 420px) {

.section_visual{ height:240px; margin:0 auto; position:relative;}
.section_visual .sec_visual_til{ width:60%; position:absolute; left:50%; margin-left:-30%; top:30%; margin-top:0%; opacity:0; z-index:3; transform: translate3d(0, 100px, 0);
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6 ease;
-o-transition: all 0.6 ease;
transition: all 0.6 ease;}

}