@charset "UTF-8";
/*=============================================================
	#interview
=============================================================*/
/* #interviewList
================================================ */
#interview #interviewList { padding: 40px 0 45px; background: url("../img/interview/bg_stripe01.png"); background-size: 8px; }
#interview #interviewList .head { padding: 0 0 18px 22px; }
#interview #interviewList .head .secTit { font-size: 2.3rem; font-weight: bold; line-height: 1.4; letter-spacing: 2px; margin-bottom: 4px; }
#interview #interviewList .head .lead { font-size: 1.2rem; font-weight: 500; }
#interview #interviewList .list .item { position: relative; }
#interview #interviewList .list .item.nolink:before { content: ""; display: block; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); position: absolute; top: 0; left: 0; z-index: 3; }
#interview #interviewList .list .item.nolink a { pointer-events: none; }
#interview #interviewList .list .item a { display: block; }
#interview #interviewList .list .item .txtBox { position: absolute; width: 100%; bottom: 0; left: 0; -webkit-box-sizing: border-box; box-sizing: border-box; }
#interview #interviewList .list .item .txtBox .name { display: table; font-size: 1.4rem; font-weight: 500; text-align: right; line-height: 1.3; position: relative; margin: 0 17px 10px auto; }
#interview #interviewList .list .item .txtBox .name:before { content: ""; display: block; width: 100%; height: 90%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; background: #fff; opacity: .4; z-index: 1; border-radius: 50%; box-shadow: 5px 5px 20px #fff,-5px 5px 20px #fff,-5px -5px 20px #fff,-5px -5px 20px #fff; }
#interview #interviewList .list .item .txtBox .name span { position: relative; z-index: 1; }
#interview #interviewList .list .item .txtBox .txt { min-height: 96px; color: #fff; font-size: 1.6rem; line-height: 1.4; padding: 15px 22px 13px; background: rgba(49, 49, 49, 0.5); -webkit-box-sizing: border-box; box-sizing: border-box; }
@media screen and (max-width: 375px) { #interview #interviewList .list .item .txtBox .txt { padding-left: 10px; padding-right: 5px; } }
@media screen and (min-width: 769px) { #interview #interviewList { padding: 85px 0 100px; }
  #interview #interviewList .head { padding: 0 0 50px 0; }
  #interview #interviewList .head .secTit { font-size: 4.8rem; letter-spacing: 2.5px; }
  #interview #interviewList .head .lead { font-size: 2.4rem; letter-spacing: 1px; }
  #interview #interviewList .list .item { width: 50%; float: left; }
  #interview #interviewList .list .item .img { transition: all 0.3s ease; }
  #interview #interviewList .list .item .txtBox .name { font-size: 1.8rem; margin: 0 31px 16px auto; }
  #interview #interviewList .list .item .txtBox .txt { min-height: 166px; font-size: 2.7rem; line-height: 1.5; padding: 24px 40px 22px; } }
  @media screen and (max-width: 768px) {
    #interview #interviewList .list .item .txtBox .name {
      text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff, 1px -1px 10px #fff, -1px -1px 10px #fff, 1px 1px 5px #fff, -1px 1px 5px #fff, 1px -1px 5px #fff, -1px -1px 5px #fff;
          -moz-text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff,1px -1px 10px #fff, -1px -1px 10px #fff,1px 1px 5px #fff, -1px 1px 5px #fff,1px -1px 5px #fff, -1px -1px 5px #fff;
          -webkit-text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff,1px -1px 10px #fff, -1px -1px 10px #fff,1px 1px 5px #fff, -1px 1px 5px #fff,1px -1px 5px #fff, -1px -1px 5px #fff;
    }
  }

/*=============================================================
	#interview / index
=============================================================*/
/* #lead
================================================ */
#interview.index #lead { border-bottom: 2px solid #e6e6e6; }
#interview.index #lead .tit { color: #313131; }
#interview.index #lead .inner { padding-bottom: 50px; }
@media screen and (max-width: 768px) { #interview.index #lead .tit { margin-bottom: 22px; } }
@media screen and (min-width: 769px) { #interview.index #lead .inner { padding-bottom: 74px; } }

/* #interviewList
================================================ */
#interview.index #interviewList { padding: 30px 0 65px; background: none; }
#interview.index #interviewList .head { display: none; }
@media screen and (min-width: 769px) { #interview.index #interviewList { padding: 117px 0 100px; } }

/* #question
================================================ */
#interview.index #question { padding: 0 0 50px; margin-bottom: 34px; background: url("../img/interview/bg_question01_sp.png") no-repeat center; background-size: cover; -webkit-box-sizing: border-box; box-sizing: border-box; }
#interview.index #question .tit { color: rgba(255, 255, 255, 0.4); font-size: 6.3rem; font-weight: 500; line-height: .85; letter-spacing: 1px; margin: 0 0 10px 15px; }
#interview.index #question .txt { text-align: center; font-size: 1.6rem; font-weight: 500; line-height: 1.6; margin-bottom: 13px; }
#interview.index #question .btn { max-width: 314px; margin: 0 auto; background: #1b1b1b; }
#interview.index #question .btn a { color: #fff; padding-top: 23px; padding-bottom: 23px; font-size: 1.4rem; }
#interview.index #question .btn a:after { right: -287%; background: rgba(74, 74, 74, 0.3); }
@media screen and (min-width: 769px) { #interview.index #question { width: 1200px; padding: 80px 100px 70px 80px; margin: 0 auto 94px; background-image: url("../img/interview/bg_question01_pc.png"); position: relative; }
  #interview.index #question .tit { font-size: 12.6rem; position: absolute; top: 20px; left: 30px; letter-spacing: 3px; }
  #interview.index #question .txt { width: 50%; float: left; font-size: 2rem; text-align: left; line-height: 2; margin-top: 15px; position: relative; z-index: 2; }
  #interview.index #question .btn { float: right; max-width: none; width: 480px; }
  #interview.index #question .btn a { font-size: 2rem; padding-top: 37px; padding-bottom: 37px; }
  #interview.index #question .btn a:hover:after { right: -100%; } }

/*=============================================================
	#interview (インタビューページ)
=============================================================*/
/* #mv
================================================ */
#interview #mv { padding: 0 0 15px; }
#interview #mv .imgBox { margin: 0 -15px 25px; position: relative; }
#interview #mv .imgBox .titBox { display: table; position: absolute; left: 43px; top: 0; bottom: 0; margin: auto; }
#interview #mv .imgBox .titBox .tit { font-size: 1.7rem; font-weight: 600; margin-bottom: 3px; }
#interview #mv .imgBox .titBox .name { font-weight: 500; font-size: 2.3rem; line-height: 1.5; }
#interview #mv .imgBox .titBox .name .prof { display: block; font-size: 1.5rem; }
#interview #mv .imgBox .titBox .shadow { position: relative; z-index: 1; }
#interview #mv .imgBox .titBox .shadow:before { content: ""; display: block; width: 100%; height: 40%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; background: #fff; opacity: .4; z-index: -1; border-radius: 50%; box-shadow: 5px 5px 20px #fff, -5px 5px 20px #fff, -5px -5px 20px #fff, -5px -5px 20px #fff; }
#interview #mv .careerList .tit { font-weight: 600; font-size: 2.5rem; line-height: 1; letter-spacing: 1px; margin: 0 0 -3px 2px; }
#interview #mv .careerList .txtBox { color: #fff; padding: 14px 16px 10px; margin-bottom: 15px; background: #1b1b1b; -webkit-box-sizing: border-box; box-sizing: border-box; }
#interview #mv .careerList .txtBox .txt { line-height: 1.8; }
#interview #mv .careerList .caution .txt { font-size: 1.1rem; line-height: 1.5; text-indent: -2.6em; padding-left: 2.6em; }
#interview #mv .careerList .caution .txt + .txt { margin-top: 14px; }
#interview #mv .careerList .caution .txt .bold { font-weight: bold; }
@media screen and (min-width: 769px) { #interview #mv { padding: 0; height: 675px; min-width: 1200px; position: relative; }
  #interview #mv .inner { height: 100%; }
  #interview #mv .imgBox { margin: 0 auto; }
  #interview #mv .imgBox .img { max-width: none; position: absolute; top: 0; left: 50%; width: 1920px; margin-left: -960px; z-index: 1; }
  #interview #mv .imgBox .titBox { left: 0; top: 207px; margin: 0; position: relative; z-index: 2; }
  #interview #mv .imgBox .titBox.pcHigh { top: 125px; }
  #interview #mv .imgBox .titBox .tit { font-size: 3rem; letter-spacing: 1px; line-height: 1.6; margin-bottom: 0; }
  #interview #mv .imgBox .titBox .name { font-size: 4rem; letter-spacing: 1.5px; }
  #interview #mv .imgBox .titBox .name .prof { display: inline-block; font-size: 2.4rem; margin-right: 35px; vertical-align: 5px; }
  #interview #mv .careerList { max-width: 1200px; position: absolute; z-index: 2; bottom: 60px; left: 0; right: 0; margin: auto; width: 100%; }
  #interview #mv .careerList .tit { font-size: 4rem; margin-bottom: -6px; }
  #interview #mv .careerList .txtBox { width: 800px; padding: 28px 40px 40px 58px; }
  #interview #mv .careerList .txtBox .txt { font-size: 1.6rem; line-height: 1.8; }
  #interview #mv .careerList .caution { position: absolute; left: 0; bottom: -15px; }
  #interview #mv .careerList .caution .txt { font-size: 1.3rem; text-indent: 0; padding-left: 0; }
  #interview #mv .careerList .caution .txt + .txt { margin-top: 7px; } }

  @media screen and (max-width: 768px) {
    #interview #mv .imgBox .titBox .name {
      text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff, 1px -1px 10px #fff, -1px -1px 10px #fff, 1px 1px 5px #fff, -1px 1px 5px #fff, 1px -1px 5px #fff, -1px -1px 5px #fff;
          -moz-text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff,1px -1px 10px #fff, -1px -1px 10px #fff,1px 1px 5px #fff, -1px 1px 5px #fff,1px -1px 5px #fff, -1px -1px 5px #fff;
          -webkit-text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff,1px -1px 10px #fff, -1px -1px 10px #fff,1px 1px 5px #fff, -1px 1px 5px #fff,1px -1px 5px #fff, -1px -1px 5px #fff;
    }
  }

/* #profile
================================================ */
#interview #profile { margin-bottom: 30px; }
#interview #profile .inner { padding: 0; }
#interview #profile .txtBox { color: #fff; padding: 14px 25px 17px; margin-bottom: 34px; background: #1b1b1b; }
#interview #profile .txtBox .name { font-weight: 500; }
#interview #profile .tit { font-size: 2.6rem; line-height: 1.4; letter-spacing: 1px; margin: 0 10px; }
@media screen and (min-width: 769px) { #interview #profile { padding-bottom: 65px; margin-bottom: -40px; background: url("../img/interview/bg_stripe01.png"); background-size: 8px; }
  #interview #profile .txtBox { height: 237px; width: 326px; float: right; font-size: 1.6rem; font-weight: 500; padding: 25px 40px 70px; margin-bottom: 0; -webkit-box-sizing: border-box; box-sizing: border-box; }
  #interview #profile .tit { display: table; float: left; font-size: 3.6rem; line-height: 1.55; letter-spacing: 2px; margin: 40px auto 0 5px; } }

/* #column
================================================ */
#interview #column { padding: 0 0 15px; }
#interview #column .box { margin-bottom: 37px; position: relative; z-index: 2; }
#interview #column .box .img { margin-bottom: 23px; }
#interview #column .box .txtBox .tit { text-align: center; font-size: 2.3rem; line-height: 1.4; margin-bottom: 13px; }
#interview #column .box .txtBox .txt + .txt { margin-top: 30px; }
#interview #column .box .txtBox .txt + .tit { margin-top: 30px; }
#interview #column .box.flow { margin: 0 -15px; }
#interview #column .box.flow .flowBox { color: #fff; padding: 40px 19px 36px; background: #1b1b1b; -webkit-box-sizing: border-box; box-sizing: border-box; }
#interview #column .box.flow .flowBox .tit { color: #fff; text-align: center; font-size: 2.3rem; line-height: 1.4; margin-bottom: 17px; }
#interview #column .box.flow .flowBox .txt + .txt { margin-top: 13px; }
#interview #column .box.flow .txtBox { padding: 45px 15px 18px; -webkit-box-sizing: border-box; box-sizing: border-box; }
#interview #column .box.flow .caution { font-size: 1.2rem; margin: 0 15px; }
#interview #column .bgImg { margin: 4px auto -50px; }
@media screen and (min-width: 769px) { #interview #column { padding: 0; }
  #interview #column .box { margin-bottom: 35px; }
  #interview #column .box.right { margin-top: 50px; }
  #interview #column .box.right .img { float: right; }
  #interview #column .box.right .txtBox { float: left; width: 46%; margin-top: 110px; }
  #interview #column .box.right .txtBox .tit { margin-bottom: 13px; }
  #interview #column .box .img { float: left; width: 569px; }
  #interview #column .box .txtBox { width: 50%; float: right; margin-top: 95px; }
  #interview #column .box .txtBox .tit { font-size: 3rem; text-align: left; letter-spacing: 1.5px; margin-bottom: 22px; }
  #interview #column .box .txtBox .txt { font-size: 1.6rem; line-height: 2; }
  #interview #column .box .txtBox .txt + .txt { margin-top: 33px; }
  #interview #column .box .txtBox .txt + .tit { margin-top: 65px; }
  #interview #column .box.flow { margin: 100px auto 0; }
  #interview #column .box.flow .flowBox { width: 50%; min-height: 695px; float: left; padding: 65px 45px 60px 0; margin: 63px auto 0 0; position: relative; }
  #interview #column .box.flow .flowBox:before { content: ""; display: block; width: 300%; height: 100%; background: #1b1b1b; position: absolute; top: 0; right: 0; z-index: -1; }
  #interview #column .box.flow .flowBox .tit { font-size: 3rem; text-align: left; letter-spacing: 1.5px; margin-bottom: 40px; }
  #interview #column .box.flow .flowBox .txt { font-size: 1.6rem; line-height: 2; }
  #interview #column .box.flow .flowBox .txt + .txt { margin-top: 34px; }
  #interview #column .box.flow .txtBox { padding: 0 0 50px; margin: 0; width: 50%; float: right; background: none; }
  #interview #column .box.flow .txtBox .img { width: 100%; margin-bottom: 38px; }
  #interview #column .box.flow .txtBox .tit { letter-spacing: .5px; margin: 0 0 20px 35px; }
  #interview #column .box.flow .txtBox .txt { margin: 0 0 0 50px; }
  #interview #column .box.flow .caution { clear: both; font-size: 1.4rem; margin: 0 auto; }
  #interview #column .bgImg { margin: 30px auto -50px; } }