/*--------------------------------------------------------------------------
main
--------------------------------------------------------------------------*/
main {
  margin: 0 auto;
  padding: 70px 0 0;
  *zoom: 1; }
  main:after {
    content: "";
    display: table;
    clear: both; }
  main h2 {
    border-bottom: solid 4px #000;
    color: #000;
    display: inline-block;
    font-size: 30px;
    font-weight: 500;
    letter-spacing: 0.2em;
    height: auto !important;
    margin: 0 auto;
    padding: 0 0 20px; }
  main .inner {
    width: 1000px; }
  main #visual {
    background: url(../../images/visual.jpg) 50% 0 no-repeat;
    background-size: cover;
    height: 40vw;
    position: relative;
    width: 100%; }
  main .section {
    margin: 100px auto 0;
    padding: 0 90px;
    position: relative;
    *zoom: 1; }
    main .section:after {
      content: "";
      display: table;
      clear: both; }
    main .section h2 {
      height: 31px; }
    main .section p {
      color: #000;
      font-size: 15px;
      line-height: 2.2;
      margin: 36px auto 0;
      width: 570px; }
    main .section .image {
      margin: 50px auto 0;
      width: 1000px; }
    main .section .link {
      margin: 100px 0 0;
      *zoom: 1; }
      main .section .link:after {
        content: "";
        display: table;
        clear: both; }
    main .section .link a {
      background: #fff url(../../../assets/images/main/button-arrow-black.png) 50% 75% no-repeat;
      background-size: 37px 13px;
      display: block;
      float: left;
      font-size: 29px;
      font-weight: 500;
      letter-spacing: 0.2em;
      padding: 30px 0 60px;
      width: 50%; }
    main .section .link a:nth-child(1) {
      border-right: solid 2px #656565; }
  main #environment ul {
    margin: 100px auto 0;
    *zoom: 1; }
    main #environment ul:after {
      content: "";
      display: table;
      clear: both; }
  main #environment ul li {
    float: left;
    font-size: 21px;
    font-weight: 900;
    height: 307px;
    letter-spacing: 0.2em;
    line-height: 2.4;
    text-align: center;
    width: 307px; }
  main #environment ul li a {
    height: 100%;
    display: block; }
  main #environment ul li:nth-child(1) {
    background: url(../../images/environment-bg1.png) 0 0 no-repeat;
    background-size: 307px 307px;
    margin: 0 39px 0 0; }
    main #environment ul li:nth-child(1) a {
      padding: 85px 0 0; }
  main #environment ul li:nth-child(2) {
    background: url(../../images/environment-bg2.png) 0 0 no-repeat;
    background-size: 307px 307px;
    margin: 0 40px 0 0; }
    main #environment ul li:nth-child(2) a {
      padding: 105px 0 0; }
  main #environment ul li:nth-child(3) {
    background: url(../../images/environment-bg3.png) 0 0 no-repeat;
    background-size: 307px 307px; }
    main #environment ul li:nth-child(3) a {
      padding: 105px 0 0; }
  main #environment .button {
    margin: 50px auto 0; }
  main .visual {
    height: 300px;
    margin: 50px 0 0;
    position: relative;
    width: 1000px; }
    main .visual .visual-copy {
      position: absolute;
      left: 0;
      width: 100%; }
      main .visual .visual-copy p {
        color: #fff;
        font-size: 30px;
        font-weight: 700;
        letter-spacing: 0.2em;
        margin: 0;
        text-align: center;
        width: 100%; }
  main #goal {
    clear: left;
    margin: 150px auto 0;
    *zoom: 1; }
    main #goal:after {
      content: "";
      display: table;
      clear: both; }
    main #goal .visual .visual-copy {
      height: 130px;
      top: 85px; }
    main #goal #visual-goal {
      background: url(../../message/images/visual-goal.jpg) 50% 50% no-repeat;
      background-size: cover; }
    main #goal a {
      margin: 55px auto 0; }
  main #message {
    margin: 150px auto 0; }
    main #message .visual {
      height: 290px;
      margin: 50px 0 0;
      position: relative;
      width: 1000px; }
      main #message .visual .visual-copy {
        position: absolute;
        left: 0;
        top: 50px;
        width: 100%; }
        main #message .visual .visual-copy p {
          color: #fff;
          font-size: 30px;
          font-weight: 700;
          margin: 0;
          text-align: center;
          width: 100%; }
    main #message #visual-message {
      background: url(../../images/visual-message.jpg) 50% 50% no-repeat;
      background-size: cover; }
    main #message .button {
      margin: 50px auto 0; }
  main #crosstalk {
    clear: left;
    margin: 150px auto 0;
    *zoom: 1; }
    main #crosstalk:after {
      content: "";
      display: table;
      clear: both; }
    main #crosstalk a {
      margin: 55px auto 0; }
  main #member {
    margin: 150px 0 0; }
    main #member ul {
      margin: 50px 0 0; }
      main #member ul li {
        float: left;
        margin: 0 5% 5% 0;
        width: 30%; }
        main #member ul li:nth-child(2n) {
          margin-right: 5%; }
        main #member ul li:nth-child(3n) {
          margin-right: 0; }
        main #member ul li a {
          display: block;
          position: relative; }
        main #member ul li a h3 {
          color: #fff;
          font-size: 19px;
          font-weight: 700;
          position: absolute;
          bottom: 18%;
          text-align: center;
          width: 100%; }
        main #member ul li a img {
          height: auto;
          width: 100%; }
        main #member ul li a p {
          position: absolute;
          bottom: 5%;
          text-align: center;
          width: 100%; }
        main #member ul li a p img {
          height: 13px;
          width: auto; }
  main #info {
    background: url(../../images/info-image.jpg) 50% 50% no-repeat;
    background-size: cover;
    margin: 100px auto 0;
    padding: 80px 0; }
    main #info h2 {
      border-color: #fff;
      color: #fff; }
    main #info p {
      color: #fff; }
    main #info .button {
      background: url(../../../assets/images/main/button-arrow.png) 93% 16px no-repeat;
      background-size: 37px 13px;
      border-color: #fff;
      color: #fff;
      margin: 50px auto 0; }

.modal .closebt {
  height: 52px;
  margin: 100px 0;
  width: 52px; }
.modal .modal-container {
  width: 985px; }
  .modal .modal-container table {
    letter-spacing: 0.25em;
    margin: 0;
    width: 100%; }
  .modal .modal-container table th {
    width: 50%; }
  .modal .modal-container table td {
    background: #fff;
    padding: 70px 0 60px 2%;
    position: relative;
    vertical-align: top;
    width: 50%; }
    .modal .modal-container table td h3 {
      color: #656565;
      font-size: 19px;
      font-weight: 700; }
    .modal .modal-container table td p {
      color: #656565;
      font-size: 19px;
      font-weight: 300;
      margin: 70px 0 0 2%; }
  .modal .modal-container p {
    color: #fff;
    font-size: 19px;
    font-weight: 300;
    letter-spacing: 0.25em;
    margin: 50px 0 0;
    text-align: left; }

#member1 table th {
  background: url(../../interview/member/images/image-member1.jpg) 50% 0 no-repeat;
  background-size: cover; }

#member2 table th {
  background: url(../../interview/member/images/image-member2.jpg) 50% 0 no-repeat;
  background-size: cover; }

#member3 table th {
  background: url(../../interview/member/images/image-member3.jpg) 50% 0 no-repeat;
  background-size: cover; }
#member3 table td h3 {
  letter-spacing: 0.1em; }

#member4 table th {
  background: url(../../interview/member/images/image-member4.jpg) 50% 0 no-repeat;
  background-size: cover; }

#member5 table th {
  background: url(../../interview/member/images/image-member5.jpg) 50% 0 no-repeat;
  background-size: cover; }

#member6 table th {
  background: url(../../interview/member/images/image-member6.jpg) 50% 0 no-repeat;
  background-size: cover; }
#member6 table td h3 {
  letter-spacing: 0.1em; }

/*========================================================================*/
@media screen and (max-width: 1200px) {
  /*--------------------------------------------------------------------------
  main
  --------------------------------------------------------------------------*/
  main .inner {
    padding: 0 35px;
    width: 100%; }
  main .section {
    margin: 100px auto 0;
    padding: 0;
    position: relative;
    *zoom: 1; }
    main .section:after {
      content: "";
      display: table;
      clear: both; }
    main .section h2 {
      height: 31px; }
    main .section p {
      font-size: 15px;
      margin: 36px auto 0;
      width: 100%; }
    main .section .image {
      margin: 50px auto 0;
      width: 100%; }
      main .section .image img {
        height: auto;
        width: 100%; }
    main .section .link {
      margin: 100px 0 0;
      *zoom: 1; }
      main .section .link:after {
        content: "";
        display: table;
        clear: both; }
    main .section .link a {
      background: #fff url(../../../assets/images/main/button-arrow-black.png) 50% 75% no-repeat;
      background-size: 30px auto;
      display: block;
      font-size: 20px;
      padding: 30px 0 60px; }
  main #environment ul {
    margin: 100px auto 0;
    *zoom: 1; }
    main #environment ul:after {
      content: "";
      display: table;
      clear: both; }
  main #environment ul li {
    font-size: 18px;
    height: 30%;
    width: 30%; }
  main #environment ul li:nth-child(1) {
    background: url(../../images/environment-bg1.png) 0 50% no-repeat;
    background-size: 100% auto;
    margin: 0 5% 0 0; }
    main #environment ul li:nth-child(1) a {
      padding: 34% 0 30%; }
  main #environment ul li:nth-child(2) {
    background: url(../../images/environment-bg2.png) 0 50% no-repeat;
    background-size: 100% auto;
    margin: 0 5% 0 0; }
    main #environment ul li:nth-child(2) a {
      padding: 38% 0 36%; }
  main #environment ul li:nth-child(3) {
    background: url(../../images/environment-bg3.png) 0 50% no-repeat;
    background-size: 100% auto; }
    main #environment ul li:nth-child(3) a {
      padding: 38% 0 36%; }
  main #goal .visual {
    height: 300px;
    width: 100%; }
    main #goal .visual .visual-copy {
      top: 95px;
      width: 100%; }
      main #goal .visual .visual-copy p {
        font-size: 26px; }
  main #goal .visual .visual-copy {
    height: 110px;
    top: 95px; }
  main #member {
    margin: 150px 0 0; }
    main #member ul li a h3 {
      bottom: 21%;
      font-size: 14px; }
    main #member ul li a p {
      bottom: 7%; }
    main #member ul li a p img {
      height: 13px; }
  main #message .visual {
    height: 290px;
    width: 100%; }
    main #message .visual .visual-copy {
      top: 50px;
      width: 100%; }
      main #message .visual .visual-copy p {
        font-size: 26px; }
  main #info {
    padding: 60px 0; }
    main #info .button {
      margin: 30px auto 0; }

  .modal .closebt {
    height: 52px;
    margin: 70px 0;
    width: 52px; }
  .modal .modal-container {
    padding: 0 35px;
    width: 100%; }
    .modal .modal-container table td h3 {
      font-size: 16px; }
    .modal .modal-container table td p {
      font-size: 16px;
      margin: 70px 0 0; }
    .modal .modal-container p {
      font-size: 16px;
      margin: 50px 0 0; } }
/*========================================================================*/
@media screen and (max-width: 768px) {
  /*--------------------------------------------------------------------------
  main
  --------------------------------------------------------------------------*/
  main {
    margin: 0 auto;
    padding: 40px 0 0;
    *zoom: 1; }
    main:after {
      content: "";
      display: table;
      clear: both; }
    main h2 {
      border-bottom: solid 3px #000;
      display: inline-block;
      font-size: 16px;
      padding: 0 0 10px; }
    main .inner {
      padding: 0 12px;
      width: 100%; }
    main #visual {
      background: url(../../images/visual.jpg) 50% 0 no-repeat;
      background-size: 125% auto;
      height: 52vw;
      position: relative;
      width: 100%; }
    main .section {
      margin: 70px auto 0;
      padding: 0 0;
      position: relative;
      *zoom: 1; }
      main .section:after {
        content: "";
        display: table;
        clear: both; }
      main .section h2 {
        height: 20px; }
      main .section p {
        font-size: 11px;
        margin: 30px auto 0;
        width: 100%; }
      main .section .image {
        margin: 30px auto 0; }
      main .section .link {
        margin: 50px 0 0;
        *zoom: 1; }
        main .section .link:after {
          content: "";
          display: table;
          clear: both; }
      main .section .link a {
        background: #fff url(../../../assets/images/main/button-arrow-black.png) 50% 75% no-repeat;
        background-size: auto 8px;
        display: block;
        float: left;
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 0.2em;
        padding: 20px 0 30px;
        width: 50%; }
      main .section .link a:nth-child(1) {
        border-right: solid 1px #656565; }
    main #environment {
      margin: 50px auto 0; }
      main #environment ul {
        margin: 50px auto 0; }
      main #environment ul li {
        font-size: 9px;
        letter-spacing: 0.15em;
        line-height: 2.2;
        height: 31%;
        width: 31%; }
      main #environment ul li:nth-child(1) {
        background: url(../../images/environment-bg1.png) 50% 0 no-repeat;
        background-size: auto 100%;
        margin: 0 4% 0 0; }
        main #environment ul li:nth-child(1) a {
          padding: 20% 0 22%; }
      main #environment ul li:nth-child(2) {
        background: url(../../images/environment-bg2.png) 50% 0 no-repeat;
        background-size: auto 100%;
        margin: 0 3% 0 0; }
        main #environment ul li:nth-child(2) a {
          padding: 30% 0 32%; }
      main #environment ul li:nth-child(3) {
        background: url(../../images/environment-bg3.png) 50% 0 no-repeat;
        background-size: auto 100%; }
        main #environment ul li:nth-child(3) a {
          padding: 30% 0 32%; }
      main #environment .button {
        margin: 30px auto 0; }
    main #goal {
      margin: 70px auto 0; }
      main #goal .visual {
        height: 130px;
        margin: 30px 0 0; }
        main #goal .visual .visual-copy {
          height: 50px;
          top: 40px; }
          main #goal .visual .visual-copy p {
            font-size: 13px; }
      main #goal h1 {
        background: url(../../message/images/h1-goal.png) 0 0 no-repeat;
        background-size: auto 12px; }
      main #goal a {
        margin: 35px auto 0; }
    main #crosstalk {
      margin: 70px auto 0; }
      main #crosstalk a {
        margin: 30px auto 0; }
    main #member {
      margin: 70px auto 0; }
      main #member ul {
        margin: 30px 0 0; }
        main #member ul li {
          margin: 0 4% 3% 0;
          width: 48%; }
          main #member ul li:nth-child(3n) {
            margin-right: 4%; }
          main #member ul li:nth-child(2n) {
            margin-right: 0; }
          main #member ul li a h3 {
            bottom: 21%;
            font-size: 12px; }
          main #member ul li a img {
            height: auto;
            width: 100%; }
          main #member ul li a p {
            bottom: 7%; }
          main #member ul li a p img {
            height: 10px;
            width: auto; }
    main #message {
      margin: 70px auto 0; }
      main #message .visual {
        height: 150px;
        margin: 30px 0 0; }
        main #message .visual .visual-copy {
          height: 80px;
          top: 35px; }
          main #message .visual .visual-copy p {
            font-size: 13px; }
      main #message .button {
        margin: 40px auto 0; }
    main #info {
      background: url(../../../images/recruit-bg.jpg) 50% 50% no-repeat;
      background-size: cover;
      margin: 70px auto 0;
      padding: 30px 0 30px; }
      main #info h2 {
        border-color: #fff;
        color: #fff; }
      main #info p {
        color: #fff;
        margin: 20px auto 0; }
      main #info .button {
        background: url(../../../assets/images/main/button-arrow.png) 93% 13px no-repeat;
        background-size: 37px 13px;
        font-size: 12px;
        height: 40px;
        letter-spacing: 0.1em;
        margin: 20px auto 0;
        padding: 9px 50px 9px 12px;
        width: 160px; }

  .modal .closebt {
    height: 36px;
    margin: 30px 0;
    width: 36px; }
  .modal .modal-container {
    padding: 0 12px;
    width: 100%; }
    .modal .modal-container table th {
      display: block;
      height: 55vw;
      width: 100%; }
    .modal .modal-container table td {
      display: block;
      height: auto;
      padding: 30px 0 20px 4%;
      width: 100%; }
      .modal .modal-container table td h3 {
        font-size: 13px; }
      .modal .modal-container table td p {
        font-size: 13px;
        margin: 20px 0 0; }
    .modal .modal-container p {
      font-size: 13px;
      margin: 30px 0 10px; } }
/*========================================================================*/

/*# sourceMappingURL=home.css.map */