@charset "UTF-8";
/* CSS Document ---------------------------------------------------------------------------------------------------------------- */
/* (C)Tankdesign */
/* Default Style Reset --------------------------------------------------------------------------------------------------------- */
body,form,fieldset{margin: 0px;padding: 0px;}
fieldset          {border:none;}
h1,h2,h3,h4,h5,h6,p,pre,blockquote,ul,ol,dl,dd{margin: 0px;padding: 0px;}
blockquote,li,dt,dd{}
li                {list-style:none;}
input,textarea    {font-size: 1em;}
img{border: 0px none;margin: 0;padding: 0;vertical-align: bottom;}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

html              {height: 100%;}
body              {height: 100%;}

/* Tag Castam ----------------------------------------------------------------------------------------------------------------- */
body              {font-family: "ヒラギノ角ゴ Pro W6", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
                   font-size: 80%;line-height: 150%;background: #fff;}
em                {font-weight: normal;font-style: normal;}
strong            {}
a                 {text-decoration: none;color: #000;}
a:link            {}
a:hover           {text-decoration: none;}
a:visited         {}
a:active          {}
input,textarea    {margin: 3px;padding: 2px;}

/* navigation -------------------------------------------------------------------------------------------- */
#toggle {display: none;}
#overlay{display: none;}

/* header -------------------------------------------------------------------------------------------------------------------- */
#header           {width: 100%;height: auto;margin: 0;padding: 25px 35px;display: block;position: absolute;left: 0;top: 0;z-index: 100;}
#header::after    {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#id               {width: 290px;height: 50px;display: block;float: left;}
#id img           {width: 100%;}

/* nav */
#nav              {padding: 10px 0 0 0;float: right;}
#nav li           {margin: 0 12px;float: left;font-size: 13px;letter-spacing: 0.1em;font-weight: bold;}

/* footer -------------------------------------------------------------------------------------------------------------------- */
#footer                  {width: 100%;height: auto;margin: 0;padding: 100px 0 20px;display: block;text-align: center;}
#footer::after           {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#id_foot                 {margin: 0 0 30px;}
#foot_nav                {margin: 0 0 40px;}
#foot_nav li             {padding: 0 20px;font-size: 13px;line-height: 100%;font-weight: bold;border-right: solid 1px #000;}
#foot_nav li:first-child {border-left: solid 1px #000;}
#copy                    {font-size: 13px;font-family: 'Poppins', sans-serif;font-weight: 700;}

/* --------------------------------------------------------------------------------------------------------------------------- */
.pos-a            {position: absolute;}
.flex             {display: -webkit-box;display: -ms-flexbox;display: flex;}
.flex1            {-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
.flex2            {webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}

.left             {float: left;}
.right            {float: right;}
.center           {text-align: center;}
.text             {font-size: 15px;line-height: 200%;}
.text-m           {font-size: 18px;line-height: 200%;letter-spacing: 0.1em;}

.recruit .container              {width: 980px;height: auto;margin: 0 auto;display: block;}
.recruit .container::after       {content: "";height: 0;clear: both;visibility: hidden;display: block;}


/* [Home] -------------------------------------------------------------------------------------------------------------------- */
/* stage */
#stage            {width: 100%;height: 100vh;margin: 0 0 100px;padding-top: 100px;display: block;position: relative;overflow: hidden;
                   background-image: url(../img/recruit/bg.svg);background-repeat: no-repeat;background-size: contain;background-position: right bottom;}
#stage #main      {width: 1080px;height: 620px;margin: auto;display: block;}
#stage .text_box  {font-size: 130px;font-family: 'Poppins', sans-serif;font-weight: 900;line-height: 80%;position: absolute;left: 20px;bottom: 20px;}
#stage .text_box span  {display: block;float: left;}
#stage .text_box .first{color: #13e4ad;}
#stage .btn       {width: 282px;height: 260px;display: block;position: absolute;right: 30px;bottom: 30px;animation: horizontal 1s ease-in-out infinite alternate;
                   background: url("../img/recruit/intern_btn2_02.png") no-repeat;}
#stage .btn a     {width:  100%;height:  100%;animation: vertical 1s ease-in-out infinite alternate;}
#stage .btn a img       {opacity: 1;transition: .5s;}
#stage .btn a:hover img {opacity: 0;}


@keyframes horizontal {
    0% { transform:translateX( -10px); }
  100% { transform:translateX(  0px); }
}
@keyframes vertical {
    0% { transform:translateY(-10px); }
  100% { transform:translateY(  0px); }
}

/* cont_body */
#cont_body        {width: 96%;max-width: 1200px;height: auto;margin: 0 auto 100px;display: block;}
#cont_body::after {content: "";height: 0;clear: both;visibility: hidden;display: block;}

.bg_green         {padding: 70px 110px;background-color: #13e4ad;display: block;color: #fff;}
.bg_green::after  {content: "";height: 0;clear: both;visibility: hidden;display: block;}
.bg_green .btn    {width: 160px;height: 40px;margin: auto;display: block;position: relative;
                   font-family: 'Poppins', sans-serif;font-size: 18px;font-weight: bold;text-align: center;letter-spacing: 0.1em;}
.bg_green .btn a  {width:  100%;height: 100%;padding: 8px 0 0 0;display: block;color: #fffe00;border: solid 2px #fffe00;position: absolute;left: 0;top: 0;z-index: 2;
                   overflow: hidden;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.bg_green .btn a::before{content: "";z-index: -1;position: absolute;width: 100%;height: 100%;top: 0;left: -100%;background-color: #fffe00;
                         -webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.bg_green .btn a:hover        {color: #13e4ad;}
.bg_green .btn a:hover::before{left: 0;}

/* message */
#Home #message          {margin: 0 0 100px;}
#Home #message .left    {padding-top: 80px;}
#Home #message h2       {margin: 0 0 30px;}
#Home #message .text    {margin: 0 0 50px;font-size: 14px;line-height: 180%;letter-spacing: 0.1em;}


/* activities */
#Home #activities           {width: 960px;margin: 0 auto 100px;}
#Home #activities h2        {margin: 0 0 50px;}
#Home #activities .list_box {margin: 0 0 50px;}
#Home #activities dl        {margin: 0 0 10px;letter-spacing: 0.1em;}
#Home #activities dl::after {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#Home #activities dt        {width: 12%;padding: 6px 0 0;display: block;float:  left;font-size: 15px;}
#Home #activities dd        {width: 88%;display: block;float: right;font-size: 15px;}
#Home #activities dd .ico   {width: 170px;height: 28px;display: block;float: left;font-size: 14px;text-align: center;}
#Home #activities dd .ico a {width: 100%;height: 100%;padding: 5px 0 0;display: block;color: #fff;
                             border-radius: 4px;-webkit-border-radius: 4px;-moz-border-radius: 4px;}
#Home #activities dd .text  {padding: 6px 0 0 10px;display: block;float: left;}
#Home #activities dd .text a{color: #00b4ff;text-decoration: underline;}
#Home #activities dd .text a:hover{text-decoration: none;}

.ico1 a       {background: #3e9de7;}
.ico2 a       {background: #3ec1e7;}
.ico3 a       {background: #67dc9b;}
.ico4 a       {background: #F35B57;}
.ico5 a       {background: #F7A229;}
.ico6 a       {background: #4C91CD;}

#activities .btn              {width: 200px;height: 50px;margin: auto;display: block;position: relative;text-align: center;font-size: 14px;font-weight: bold;letter-spacing: 0.4em;background: #fff;}
#activities .btn::after       {content: "";width:  100%;height: 100%;background: url(../img/bg_stripe1.png) repeat;position: absolute;left: 10px;bottom: -10px;z-index: 0;}
#activities .btn a            {width:  100%;height: 100%;padding: 14px 0 0;display: block;border: solid 2px #000;background: #fff;position: absolute;left: 0;top: 0;z-index: 2;
                               overflow: hidden;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#activities .btn a::before    {content: "";z-index: -1;position: absolute;width: 100%;height: 100%;top: 0;left: -100%;background-color: #000;
                               -webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#activities .btn a:hover      {color: #fff;}
#activities .btn a:hover::before{left: 0;}


/* voice */
#Home #voice               {width: 100%;height: auto;margin: 0 0 100px;display: flex;flex-wrap: wrap;justify-content: space-between;}
#Home #voice .box          {width:  48%;margin-bottom: 40px;position: relative;}
#Home #voice .box::after   {content: "";width: 100%;padding-top: 84.5%;display: block;}
#Home #voice .box h2       {width: 100%;height: 100%;display: block;border: solid 10px #fffe00;position: absolute;left: 0;top: 0;}
#Home #voice .box h2 img   {position: absolute;left: 50%;top: 50%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}
#Home #voice .box.list     {background-image: url(../img/recruit/voice_li_bg.svg);background-repeat: no-repeat;background-size: cover;background-position: left bottom;}

#Home #voice .text_box      {position: absolute;left: 40px;top: 0;font-weight: bold;letter-spacing: 0.1em;}
#Home #voice .text_box .text{margin: 0 0 80px;padding: 100px 0 0;font-size: 15px;line-height: 200%;}

#Home #voice .name_box      {width: 200px;padding: 0 0 20px;display: block;
                             background-image: url(../img/recruit/arrow.svg);background-repeat: no-repeat;background-size: 100% auto;background-position: left bottom;}
#Home #voice .name_box .name{padding-top: 14px;font-size: 20px;}

#Home #voice .pict_box     {width: 100%;height: 100%;position: absolute;left: 0;top: 0;overflow: hidden;}
#Home #voice .pict_box img {position: absolute;left: 0;top: 0;}
#Home #voice .pict_box .cover      {width: 100%;height: 100%;display: block;position: absolute;left: 0;top: 0;opacity: 0;transition: .5s;background-size: cover;}
#Home #voice .pict_box:hover .cover{opacity: 1;}
#Home #voice .pict_box .base       {width: 100%;height: 100%;display: block;position: absolute;left: 0;top: 0;opacity: 1;transition: .5s;background-size: cover;}
#Home #voice .pict_box:hover .base {opacity: 0;}

#Home #voice #v1 .cover    {background-image: url(../img/recruit/voice1-2.png);}
#Home #voice #v1 .base     {background-image: url(../img/recruit/voice1-1.png);}
#Home #voice #v2 .cover    {background-image: url(../img/recruit/voice2-2.png);}
#Home #voice #v2 .base     {background-image: url(../img/recruit/voice2-1.png);}
#Home #voice #v3 .cover    {background-image: url(../img/recruit/voice3-2.png);}
#Home #voice #v3 .base     {background-image: url(../img/recruit/voice3-1.png);}
#Home #voice #v4 .cover    {background-image: url(../img/recruit/voice4-2.png);}
#Home #voice #v4 .base     {background-image: url(../img/recruit/voice4-1.png);}
#Home #voice #v5 .cover    {background-image: url(../img/recruit/voice5-2.png);}
#Home #voice #v5 .base     {background-image: url(../img/recruit/voice5-1.png);}


/* banner_box1 */
#banner_box1               {width: 1080px;height: auto;margin: 0 auto 150px;display: block;}
#banner_box1::after        {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#banner_box1 .box2         {margin-top: 180px;}

/* banner_box2 */
#banner_box2 .left         {width: 58%;}
#banner_box2 .right        {width: 42%;padding-top: 100px;}
#banner_box2 h2            {margin: 0 0 10px;font-size: 70px;font-family: 'Poppins', sans-serif;font-weight: 900;line-height: 100%;}
#banner_box2 h3            {margin: 0 0 70px;font-size: 30px;letter-spacing: 0.2em;}


/* ----------------------------------------------------------------------------------------------------- */
/* [先輩の声] ------------------------------------------------------------------------------------------ */
#Voice                       {padding: 5% 0 0;}
#Voice .h_voice              {width: 96%;height: 96%;margin: 0 auto 60px;display: block;background: url(../img/recruit/voice_h_bg.png) repeat;position: relative;}
#Voice .h_voice img          {display: block;position: absolute;left: 38%;top: 45%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}
#Voice .list_box             {width: 100%;height: auto;margin: 0 0 100px;display: flex;flex-wrap: wrap;justify-content: space-between;}
#Voice .box                  {width:  48%;margin-bottom: 40px;position: relative;}
#Voice .box::after           {content: "";width: 100%;padding-top: 84.5%;display: block;}
#Voice .box h2               {width: 100%;height: 100%;display: block;border: solid 10px #fffe00;position: absolute;left: 0;top: 0;}
#Voice .box h2 img           {position: absolute;left: 50%;top: 50%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}
#Voice .box.list             {background-image: url(../img/recruit/voice_li_bg.svg);background-repeat: no-repeat;background-size: cover;background-position: left bottom;}

#Voice.recruit .text_box       {position: absolute;left: 40px;top: 0;font-weight: bold;letter-spacing: 0.1em;}
#Voice.recruit .text_box .text {margin: 0 0 80px;padding: 100px 0 0;font-size: 15px;line-height: 200%;}

#Voice .name_box             {width: 200px;padding: 0 0 20px;display: block;
                              background-image: url(../img/recruit/arrow.svg);background-repeat: no-repeat;background-size: 100% auto;background-position: left bottom;}
#Voice .name_box .name       {padding-top: 14px;font-size: 20px;}

#Voice .pict_box             {width: 100%;height: 100%;position: absolute;left: 0;top: 0;overflow: hidden;}
#Voice .pict_box img         {position: absolute;left: 0;top: 0;}

#Voice .pict_box .cover      {opacity: 0;transition: .5s;}
#Voice .pict_box:hover .cover{opacity: 1;}
#Voice .pict_box .base       {opacity: 1;transition: .5s;}
#Voice .pict_box:hover .base {opacity: 0;}

/* [個人ページ] */
#Voice.detail                {padding: 240px 0 0;}
#Voice.detail                {background-image: url(../img/recruit/voice_bg.svg);background-repeat: no-repeat;background-size: cover;}
#Voice.detail #cont_body h2  {width: 320px;height: 130px;margin: -90px 0 0 -160px;display: block;position: absolute;left: 50%;z-index: 10;}

#Voice .main_image           {width: 1080px;height: 520px;margin: 0 auto 120px;display: block;position: relative;}
#Voice .main_image::after    {content: "";width: 1080px;height: 520px;display: block;background: url(../img/recruit/stripe1.png) repeat;position: absolute;top: 30px;right: -30px;z-index: -1;}

#Voice.detail .container        {width: 980px;height: auto;margin: 0 auto 100px;display: block;}
#Voice.detail .container::after {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#Voice.detail .text_box         {width: 420px;padding: 20px 0 0;line-height: 200%;letter-spacing: 0.1em;}
#Voice.detail .text_box h3      {margin: 0 0 20px;font-size: 15px;}
#Voice.detail .text_box .text   {margin: 0 0 40px;font-size: 14px;}
#Voice.detail .btn_box          {width: 750px;height: auto;margin: auto;padding: 50px 0;display: flex;justify-content: space-between;}
#Voice.detail .btn_box .item    {width: 160px;text-align: center;}
#Voice.detail .btn_box .pict    {margin: 0 0 10px;}
#Voice.detail .btn_box .name    {font-weight: bold;letter-spacing: 0.1em;}


/* ----------------------------------------------------------------------------------------------------- */
/* [Message] ------------------------------------------------------------------------------------------- */
#Message #main                  {width: 100%;height:  96%;margin: 0;padding: 0;display: block;position: relative;
                                 background-image: url(../img/recruit/message_main.jpg);background-size: cover;background-repeat: no-repeat;}
#Message #main h2               {position: absolute;left: 34%;top: 50%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}

#Message #h_box                 {width: 100%;height: 400px;margin: 0 0 60px;display: block;background: #8ab5c5;color: #fff;}
#Message #h_box .container      {width: 980px;margin: auto;padding: 0 0 0 100px;}
#Message #h_box h3              {padding: 150px 0 0 80px;font-family: 'Poppins', sans-serif;font-weight: 700;font-size: 50px;line-height: 100%;}
#Message .message               {width: 980px;margin: auto;font-size: 15px;line-height: 200%;letter-spacing: 0.1em;}


/* ----------------------------------------------------------------------------------------------------- */
/* [Career] -------------------------------------------------------------------------------------------- */
#Career #main                   {width: 100%;height:  96%;margin: 0;padding: 0;display: block;position: relative;
                                 background-image: url(../img/recruit/career_main.jpg);background-size: cover;background-repeat: no-repeat;}
#Career #main h2                {position: absolute;left: 32%;top: 50%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}

/* system */
#system                         {width: 100%;height: auto;margin: 0 0 80px;padding: 90px 0;display: block;background: #fffe00;}
#system::after                  {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#system h2                      {font-family: 'Poppins', sans-serif;font-weight: 700;font-size: 50px;color: #13e4ad;line-height: 100%;}
#system h3                      {margin: 0 0 70px;font-size: 16px;}
#system .text                   {margin: 0 0 50px;font-size: 15px;line-height: 200%;}

/* posi */
#posi                           {width: 100%;height: auto;margin: 0;padding: 0;display: block;}
#posi h4                        {margin: 0 0 4px;font-size: 17px;letter-spacing: 0.2em;text-indent: 0.7em;}
#posi p                         {font-size: 14px;letter-spacing: 0.1em;}
#posi .item                     {height: 70px;margin: 0 0 10px;padding: 15px 0 0;display: block;float: right;
                                 background-color: #fff;background-image: url(../img/recruit/career_bg.jpg);background-repeat: no-repeat;}
#posi #posi1                    {width:  78%;}
#posi #posi2                    {width:  82%;}
#posi #posi3                    {width:  86%;}
#posi #posi4                    {width:  90%;}
#posi #posi5                    {width:  94%;}
#posi #posi6                    {width:  98%;}

/* training */
#training                       {text-align: center;}
#training .cont_box             {padding: 70px 0;}

#training .detail               {font-size: 14px;line-height: 200%;text-align: left;}
#training .detail dl            {margin: 0 0 20px;padding: 0 0 10px;display: block;border-bottom: solid 1px #13e4ad;}
#training .detail dl::after     {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#training .detail dt            {width: 30%;display: block;float: left;font-size: 16px;letter-spacing: 0.1em;color: #13e4ad;}
#training .detail dd            {width: 70%;display: block;float: right;}

#training h2                    {margin: 0 0 50px;padding: 6px 12px;display: inline-block;border: solid 2px #000;font-size: 18px;letter-spacing: 0.3em;text-indent: 0.3em;}
#training h3                    {margin: 0 0 40px;color:#13e4ad;font-size: 18px;}


/* ----------------------------------------------------------------------------------------------------- */
/* [Intern] -------------------------------------------------------------------------------------------- */
#Intern                     {padding: 5% 0 0;}
#Intern .h_intern           {width: 96%;height: 96%;margin: 0 auto 60px;display: block;background: url(../img/recruit/h_intern_bg.jpg) repeat;position: relative;}
#Intern .h_intern img       {display: block;position: absolute;left: 30%;top: 45%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}
#Intern .dl_pdf             {padding: 50px 0;}
#Intern .dl_pdf a           {display: inline;}
#Intern .dl_pdf a:hover     {opacity: 0.5;}

/* ----------------------------------------------------------------------------------------------------- */
/* [Require] ------------------------------------------------------------------------------------------- */
#Require #main              {width: 100%;height:  96%;margin: 0 0 80px;padding: 0;display: block;position: relative;
                             background-image: url(../img/recruit/require_main.jpg);background-size: cover;background-repeat: no-repeat;}
#Require #main h2           {position: absolute;left: 34%;top: 58%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);
                             font-size: 70px;letter-spacing: 0.4em;text-indent: 0.4em;color: #fff;}
#Require .container         {text-align: center;}
#Require .container h3      {margin: 0 0 50px;padding: 6px 12px;display: inline-block;border: solid 2px #000;font-size: 18px;letter-spacing: 0.3em;text-indent: 0.3em;}
#Require .container .detail {font-size: 14px;line-height: 200%;text-align: left;}
#Require .detail dl         {margin: 0 0 20px;padding: 0 0 10px;display: block;border-bottom: solid 1px #13e4ad;}
#Require .detail dl::after  {content: "";height: 0;clear: both;visibility: hidden;display: block;}
#Require .detail dt         {width: 20%;display: block;float: left;font-size: 16px;letter-spacing: 0.1em;color: #13e4ad;}
#Require .detail dd         {width: 80%;display: block;float: right;}


@media only screen and (max-width: 768px) {
/* header -------------------------------------------------------------------------------------------------------------------- */
#header           {width: 100%;height: auto;margin: 0;padding: 10px;display: block;position: static;}
#id               {width: 200px;height: auto;display: block;float: none;}
#id img           {width: 100%;}

/* nav */
#nav              {display: none;}

/* navigation -------------------------------------------------------------------------------------------- */
#toggle {display: block;}
#overlay{display: block;}

.button_container {
  position: fixed;
  top: 2.5%;
  right: 3.6%;
  height: 20px;
  width: 26px;
  cursor: pointer;
  z-index: 2000;
  -webkit-transition: opacity .25s ease;
  transition: opacity .25s ease;
}
.button_container:hover {
  opacity: .7;
}
.button_container.active .top {
  -webkit-transform: translateY(6px) translateX(0) rotate(45deg);
          transform: translateY(6px) translateX(0) rotate(45deg);
}
.button_container.active .middle {
  opacity: 0;
}
.button_container.active .bottom {
  -webkit-transform: translateY(-6px) translateX(0) rotate(-45deg);
          transform: translateY(-6px) translateX(0) rotate(-45deg);
}
.button_container span {
  background: #000;
  border: none;
  height: 2px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all .35s ease;
  transition: all .35s ease;
  cursor: pointer;
}
.button_container span:nth-of-type(2) {
  top: 6px;
}
.button_container span:nth-of-type(3) {
  top: 12px;
}

.overlay {
  position: fixed;
  z-index: 1000;
  background: #fefe00;
  top: 0;
  left: 0;
  width: 100%;
  height: 0%;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity .35s, visibility .35s, height .35s;
  transition: opacity .35s, visibility .35s, height .35s;
  overflow: hidden;
}
.overlay.open {
  opacity: .9;
  visibility: visible;
  height: 100%;
}
.overlay.open li {
  -webkit-animation: fadeIn .5s ease forwards;
          animation: fadeIn .5s ease forwards;
  -webkit-animation-delay: .35s;
          animation-delay: .35s;
}
.overlay.open li:nth-of-type(2) {
  -webkit-animation-delay: .4s;
          animation-delay: .4s;
}
.overlay.open li:nth-of-type(3) {
  -webkit-animation-delay: .45s;
          animation-delay: .45s;
}
.overlay.open li:nth-of-type(4) {
  -webkit-animation-delay: .50s;
          animation-delay: .50s;
}
.overlay.open li:nth-of-type(5) {
  -webkit-animation-delay: .55s;
          animation-delay: .55s;
}
.overlay nav {
  position: relative;
  height: 80%;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  font-size: 20px;
  letter-spacing: 0.2em;
  text-align: center;
}
.overlay ul {
  padding: 0;
  margin: 0 auto;
  display: inline-block;
  position: relative;
  height: 100%;
}
.overlay ul li {
  display: block;
  height: auto;
  margin: 0 0 30px;
  line-height: 140%;
  /* height: calc(100% / 6); */
  position: relative;
  opacity: 0;
}
.overlay ul li a {
  display: inline-block;
  position: relative;
  color: #000;
  text-decoration: none;
  overflow: hidden;
}
.overlay ul li a:hover:after, .overlay ul li a:focus:after, .overlay ul li a:active:after {
  width: 100%;
}
.overlay ul li a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  height: 3px;
  background: #FFF;
  -webkit-transition: .35s;
  transition: .35s;
}
.overlay ul .ico a:after {
  content: '';
  position: static;
  bottom: 0;
  left: 50%;
  width: 0%;
  -webkit-transform: none;
          transform: none;
  height: 0;
  background: #FFF;
  -webkit-transition:  none;
  transition:  none;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}


/* footer -------------------------------------------------------------------------------------------------------------------- */
#footer                  {width: 100%;height: auto;margin: 0;padding: 50px 0 10px;}
#id_foot                 {width: 50%;margin: 0 auto 20px;}
#id_foot img             {width: 100%;}
#foot_nav                {display: none;}
#copy                    {font-size: 10px;}

/* --------------------------------------------------------------------------------------------------------------------------- */
.pos-a            {position: absolute;}
.flex             {display: -webkit-box;display: -ms-flexbox;display: flex;}
.flex1            {-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;}
.flex2            {webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;}

.left             {float: none;}
.right            {float: none;}
.center           {text-align: center;}
.text             {font-size: 11px;}
.text-m           {font-size: 13px;}

.recruit .container              {width: 90%;height: auto;margin: 0 auto;display: block;}

/* [Home] -------------------------------------------------------------------------------------------------------------------- */
/* stage */
#stage            {width: 100%;height: 90vh;margin: 0 0 20px;padding: 0;}
#stage #main      {width: 90%;height: 90%;margin: auto;display: block;}
#stage .text_box  {font-size: 46px;left: 10px;bottom: 20px;}
#stage .btn       {width: 140px;height: 129px;right: 10px;bottom: 140px;background-size: cover;}
#stage .btn a img       {width: 100%;}


@keyframes horizontal {
    0% { transform:translateX( -10px); }
  100% { transform:translateX(  0px); }
}
@keyframes vertical {
    0% { transform:translateY(-10px); }
  100% { transform:translateY(  0px); }
}

/* cont_body */
#cont_body        {width: 96%;max-width: 96%;height: auto;margin: 0 auto 50px;}

.bg_green         {padding: 30px;}

.bg_green .btn    {width: 160px;height: 40px;margin: auto;font-size: 12px;}

/* message */
#Home #message          {margin: 0 0 40px;}
#Home #message .left    {padding: 0;}
#Home #message h2       {width: 50%;margin: 0 0 20px;}
#Home #message h2 img   {width: 100%;}
#Home #message .text    {margin: 0 0 30px;font-size: 12px;}
#Home #message .pict    {width: 100%;margin: 0 0 30px;}
#Home #message .pict img{width: 100%;}

/* activities */
#Home #activities           {width: 90%;margin: 0 auto 80px;}
#Home #activities h2        {width: 80%;margin: 0 0 30px;}
#Home #activities h2 img    {width: 100%;}
#Home #activities .list_box {margin: 0 0 30px;}
#Home #activities dl        {margin: 0 0 10px;letter-spacing: 0.1em;}
#Home #activities dt        {width: 100%;padding: 6px 0 0;display: block;float: none;font-size: 11px;}
#Home #activities dd        {width: 100%;display: block;float: none;font-size: 11px;}
#Home #activities dd .ico   {width: 100px;height: 24px;display: block;float: none;font-size: 10px;text-align: center;}
#Home #activities dd .ico a {width: 100%;height: 100%;padding: 3px 0 0;}
#Home #activities dd .text  {padding: 6px 0 0 0;display: block;float: none;}


#activities .btn              {font-size: 12px;}


/* voice */
#Home #voice               {width:  80%;height: auto;margin: 0 auto 60px;display: block;}
#Home #voice .box          {width: 100%;margin-bottom: 40px;position: relative;}
#Home #voice .box::after   {content: "";width: 100%;padding-top: 84.5%;display: block;}
#Home #voice .box h2       {width: 100%;height: 100%;display: block;border: solid 10px #fffe00;position: absolute;left: 0;top: 0;}
#Home #voice .box h2 img   {position: absolute;left: 50%;top: 50%;-webkit-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}

#Home #voice .text_box      {position: absolute;left: 20px;top: 0;z-index: 2;}
#Home #voice .text_box .text{margin: 0 0 10px;padding: 20px 0 0;font-size: 10px;line-height: 200%;}

#Home #voice .name_box      {width: 200px;padding: 0 0 20px;font-size: 10px;}
#Home #voice .name_box .name{padding-top: 11px;font-size: 12px;}

#Home #voice .pict_box     {width: 100%;height: 100%;position: absolute;left: 0;top: 0;overflow: hidden;z-index: 1;}
#Home #voice .pict_box img {width: 100%;position: absolute;left: 0;top: 0;}


/* banner_box1 */
#banner_box1               {width: 90%;height: auto;margin: 0 auto 50px;display: block;}
#banner_box1 .box2         {margin-top: 20px;}
#banner_box1 img           {width: 100%;}

/* banner_box2 */
#banner_box2 .left         {width: 100%;}
#banner_box2 .left img     {width: 100%;}
#banner_box2 .right        {width: 100%;padding-top: 10px;}
#banner_box2 h2            {margin: 0 0 10px;font-size: 30px;text-align: center;}
#banner_box2 h3            {margin: 0 0 30px;font-size: 14px;text-align: center;letter-spacing: 0.2em;}


/* ----------------------------------------------------------------------------------------------------- */
/* [Message] ------------------------------------------------------------------------------------------- */
#Message #main                  {width: 100%;height:  60%;background-position: center top;}
#Message #main h2               {width: 230px;height: 60px;margin: -30px 0 0 -115px;position: absolute;left: 50%;top: 50%;-webkit-transform: none;transform: none;}
#Message #main h2 img           {width: 100%;}

#Message #h_box                 {width: 100%;height: auto;margin: 0 0 30px;}
#Message #h_box .container      {width: 90%;margin: auto;padding: 0 0 0 20px;}
#Message #h_box .pict           {width: 30%;float: left;}
#Message #h_box .pict img       {width: 100%;}
#Message #h_box h3              {padding: 50px 0 0 30px;float: left;font-size: 21px;line-height: 100%;}
#Message .message               {width: 80%;font-size: 12px;}


/* ----------------------------------------------------------------------------------------------------- */
/* [先輩の声] ------------------------------------------------------------------------------------------ */
#Voice                       {padding: 5% 0 0;}
#Voice .h_voice              {width: 96%;height: 60%;margin: 0 auto 40px;}
#Voice .h_voice img          {width: 160px;height: 65px;display: block;margin: -32px 0 0 -80px;position: absolute;left: 50%;top: 45%;-webkit-transform: none;transform: none;}
#Voice .list_box             {width: 86%;height: auto;margin: 0 auto 60px;display: block;}
#Voice .box                  {width: 100%;margin-bottom: 40px;}
#Voice .box::after           {content: "";width: 100%;padding-top: 84.5%;display: block;}

#Voice.recruit .text_box       {position: absolute;left: 20px;top: 0;z-index: 2;}
#Voice.recruit .text_box .text {margin: 0 0 10px;padding: 20px 0 0;font-size: 10px;line-height: 200%;}

#Voice .name_box             {width: 200px;padding: 0 0 20px;font-size: 10px;}
#Voice .name_box .name       {padding-top: 11px;font-size: 12px;}

#Voice .pict_box             {width: 100%;height: 100%;position: absolute;left: 0;top: 0;overflow: hidden;z-index: 1;}
#Voice .pict_box img         {width: 100%;position: absolute;left: 0;top: 0;}

#Voice .pict_box .cover      {opacity: 0;transition: .5s;}
#Voice .pict_box:hover .cover{opacity: 1;}
#Voice .pict_box .base       {opacity: 1;transition: .5s;}
#Voice .pict_box:hover .base {opacity: 0;}

/* [個人ページ] */
#Voice.detail                  {padding: 0;}
#Voice.detail #cont_body h2    {width: 160px;height: 65px;margin: -32px 0 0 -80px;padding: 40px 0 0;display: block;position: absolute;left: 50%;z-index: 10;}
#Voice.detail #cont_body h2 img{width: 100%;}

#Voice .main_image           {width: 100%;height: auto;margin: 0 auto 40px;padding-top: 50px;display: block;position: relative;}
#Voice .main_image::after    {content: "";display: none;}
#Voice .main_image img       {width: 100%;}

#Voice.detail .container        {width: 86%;height: auto;margin: 0 auto 50px;}
#Voice.detail .pict img         {width: 100%;}
#Voice.detail .text_box         {width: 100%;padding: 20px 0 0;}
#Voice.detail .text_box h3      {margin: 0 0 20px;font-size: 13px;}
#Voice.detail .text_box .text   {margin: 0 0 40px;font-size: 12px;}
#Voice.detail .btn_box          {width: 100%;height: auto;margin: auto;padding: 20px 0;}
#Voice.detail .btn_box .item    {width: 23%;text-align: center;}
#Voice.detail .btn_box .pict    {margin: 0 0 10px;}
#Voice.detail .btn_box .pict img{width: 100%;}
#Voice.detail .btn_box .name    {font-size: 10px;}


/* ----------------------------------------------------------------------------------------------------- */
/* [Career] -------------------------------------------------------------------------------------------- */
#Career #main                   {width: 100%;height:  60%;background-position: center top;}
#Career #main h2                {width: 260px;height: 60px;margin: -30px 0 0 -130px;position: absolute;left: 50%;top: 50%;-webkit-transform: none;transform: none;}
#Career #main h2 img            {width: 100%;}

/* system */
#system                         {width: 100%;height: auto;margin: 0 0 80px;padding: 50px 0;}
#system h2                      {font-size: 30px;color: #13e4ad;line-height: 100%;}
#system h3                      {margin: 0 0 40px;font-size: 14px;}
#system .text                   {margin: 0 0 50px;font-size: 12px;}

/* posi */
#posi                           {width: 100%;height: auto;margin: 0;padding: 0;display: block;}
#posi h4                        {margin: 0 0 4px;font-size: 13px;}
#posi p                         {font-size: 10px;}
#posi .item                     {height: 70px;margin: 0 0 20px;padding: 10px 0 0;}

/* training */
#training .detail               {font-size: 12px;}
#training .detail dl            {margin: 0 0 10px;padding: 0 0 10px;}
#training .detail dt            {width: 100%;display: block;float: none;font-size: 13px;}
#training .detail dd            {width: 100%;display: block;float: none;}

#training .pict img             {width: 100%;}

#training h2                    {margin: 0 0 50px;padding: 6px 12px;display: inline-block;border: solid 2px #000;font-size: 16px;}
#training h3                    {margin: 0 0 40px;color:#13e4ad;font-size: 14px;}


/* ----------------------------------------------------------------------------------------------------- */
/* [Intern] -------------------------------------------------------------------------------------------- */
#Intern                     {padding: 5% 0 0;}
#Intern .h_intern           {width: 96%;height: 60%;margin: 0 auto 40px;}
#Intern .h_intern img       {width: 290px;height: 60px;margin: -30px 0 0 -145px;left: 50%;top: 50%;-webkit-transform: none;transform: none;}
#Intern .dl_pdf             {width: 60%;margin: auto;padding: 50px 0;}
#Intern .dl_pdf img         {width: 100%;}
#Intern .dl_pdf a           {display: inline;}
#Intern .dl_pdf a:hover     {opacity: 0.5;}


/* ----------------------------------------------------------------------------------------------------- */
/* [Require] ------------------------------------------------------------------------------------------- */
#Require #main              {width: 100%;height:  60%;margin: 0 0 60px;background-position: center top;}
#Require #main h2           {position: absolute;left: 30%;top: 58%;font-size: 30px;}
#Require .container h3      {margin: 0 0 50px;font-size: 14px;}
#Require .container .detail {font-size: 12px;}
#Require .detail dl         {margin: 0 0 10px;}
#Require .detail dt         {width: 100%;float: none;font-size: 13px;s}
#Require .detail dd         {width: 100%;float: none;}

}
.btn_entry {
    padding: 10px 20px;
    border: 1px solid #D4D4D4;
    width: 300px;
    margin: auto;
    text-decoration: none;
    display: block;
    background-image: -webkit-linear-gradient(270deg,rgba(245,245,245,1.00) 0%,rgba(228,228,228,1.00) 100%);
    background-image: -moz-linear-gradient(270deg,rgba(245,245,245,1.00) 0%,rgba(228,228,228,1.00) 100%);
    background-image: -o-linear-gradient(270deg,rgba(245,245,245,1.00) 0%,rgba(228,228,228,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(245,245,245,1.00) 0%,rgba(228,228,228,1.00) 100%);
    font-weight: normal;
    color: #333333!important;
    text-align: center;
}

.tbl_internship {
    
}
.tbl_internship th,
.tbl_internship td{
    border-bottom: 1px solid #DCDCDC!important;
    padding: 10px 15px;
}
.nav_text li a{
    color: #fff;
}