@charset "UTF-8";
/* normalize
-------------------*/

/*! normalize.css v2.0.1 | MIT License | git.io/normalize */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
  display: block
}

audio,
canvas,
video {
  display: inline-block
}

audio:not([controls]) {
  display: none;
  height: 0
}

[hidden] {
  display: none
}

html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  background-color: #FFF;
  font-size: 62.5%;
  /* sets the base font to 10px for easier math */
}

ul,
ol {
  list-style-type: none;
}

::selection {
  background-color: #888;
  color: #FFF;
  /* Safari */
}

::-moz-selection {
  background-color: #000;
  color: #FFF;
  /* Firefox */
}

body * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/* reset
-------------------*/

body,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
ul,
ol,
li,
dl,
dt,
dd,
p,
img {
  margin: 0;
  padding: 0;
}

h1 {
  font-size: 2em
}

abbr[title] {
  border-bottom: 1px dotted
}

b,
strong {
  font-weight: 700
}

dfn {
  font-style: italic
}

mark {
  background: #ff0;
  color: #000
}

code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em
}

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word
}

q {
  quotes: "\201C" "\201D" "\2018" "\2019"
}

small {
  font-size: 80%
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline
}

sup {
  top: -.5em
}

sub {
  bottom: -.25em
}

img {
  border: 0;
  width: 100%;
  line-height: 0;
}

svg:not(:root) {
  overflow: hidden
}

figure {
  margin: 0
}

fieldset {
  border: 1px solid silver;
  margin: 0 2px;
  padding: .35em .625em .75em
}

legend {
  border: 0;
  padding: 0
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  margin: 0
}

button,
input {
  line-height: normal
}

button,
html input[type="button"],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer
}

button[disabled],
input[disabled] {
  cursor: default
}

input[type=checkbox],
input[type=radio] {
  box-sizing: border-box;
  padding: 0
}

input[type=search] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0
}

textarea {
  overflow: auto;
  vertical-align: top
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

a[href*="tel:"] {
  pointer-events: painted;
  cursor: default;
  text-decoration: none;
}

a,
a:hover {
  color: #333;
  text-decoration: none;
  cursor: pointer;
  outline: none;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

/*---------
all
------------*/
@font-face {
  font-family: '遊ゴシック', 'YuGothic', sans-serif;
  font-weight: normal;
  src: url("/recruit/lib/cmn_css/fonts/Yu Gothic Medium.otf");
}

@font-face {
  font-family: '遊ゴシック', 'YuGothic', sans-serif;
  font-weight: bold;
  src: url("/recruit/lib/cmn_css/fonts/Yu Gothic Bold.otf");
}

body {
  font-family: 'Josefin Sans', '遊ゴシック', 'YuGothic', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', 'Osaka', "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #000;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.8;
  letter-spacing: 0.1em;
  margin: 0;
  padding: 0;
  text-align: left;
  list-style: none;
}

/*--------
clearfix
-----------*/
.clearfix:after {
  content: ".";
  height: 0;
  clear: both;
  display: block;
  font-size: 0.1em;
  line-height: 0;
  visibility: hidden;
}

.clearfix {
  display: inline-block;
  min-height: 1%;
}

/*-------
float
-----------*/
.fltL {
  float: left;
}

.fltR {
  float: right;
}

/*-------
textaline
-----------*/
.txtaC {
  text-align: center !important;
}

.txtaL {
  text-align: left !important;
}

/*-------
buttonHover
-----------*/
/*左から右下線 Underline From Left */
.UnderlineLeft {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
}

.UnderlineLeft:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 100%;
  bottom: -2px;
  background: #fdff50;
  height: 4px;
  -webkit-transition-property: right;
  transition-property: right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}

.UnderlineLeft:hover:before,
.UnderlineLeft:focus:before,
.UnderlineLeft:active:before {
  right: 0;
}

/*背景ドット入れる Dot 背景高さ指定*/
.dotWrap {
  position: relative;
}

.dotWrap::after {
  background: url(../cmn_img/dot.png) repeat center center;
  background-size: auto;
  position: absolute;
  content: "";
  left: 6%;
  bottom: -6%;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  width: 100%;
}

.dotWrap:hover::after {
  left: 0;
  bottom: 0;
}

/*左から右へ Right From Left */
.circleLeft {
  display: block;
  text-decoration: none;
  padding: 2.5rem;
  position: relative;
  overflow: hidden;
}

.circleLeft:before {
  content: "";
  position: absolute;
  right: auto;
  bottom: auto;
  left: -100px;
  top: -50px;
  width: 10px;
  height: 50px;
  background: #182a86;
  border-radius: 100%;
}

.circleLeft,
.circleLeft:before {
  -moz-transition: 0.7s;
  -o-transition: 0.7s;
  -webkit-transition: 0.7s;
  transition: 0.7s;
}

.circleLeft span {
  position: relative;
}

.circleLeft:hover {
  color: #ffffff;
}

.circleLeft:hover:before {
  width: 100%;
  height: 200px;
  opacity: 1;
  border-radius: 0px;
  left: 0px;
}

/*背景で拡大 */
.hvrLargeWrap .hvrLarge {
  position: relative;
  overflow: hidden;
}

.hvrLargeWrap .hvrLarge:after {
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -ms-background-size: cover;
  background-size: cover !important;
  transition: all .3s ease-out;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -ms-transition: all .3s ease-out;
}

.hvrLargeWrap .hvrLarge:hover:after {
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}

/*斜め左から右へ slide From Left */
.hvrSlide {
  color: #000;
  background-color: #fff;
  padding: 15px 0px 13px 28px;
  text-align: left;
  text-transform: uppercase;
  position: relative;
  overflow: hidden;
  transition: 0.5s;
  display: block;
  z-index: 0;
  border: 2px solid #000;
}

.hvrSlide:before {
  position: absolute;
  transition: 0.5s;
  content: '';
  width: 0;
  bottom: 0;
  background: #111;
  height: 120%;
  left: -20%;
  -webkit-transform: skewX(-15deg);
  transform: skewX(-15deg);
  z-index: -1
}

.hvrSlide:hover {
  color: #fff;
}

.hvrSlide:hover:before {
  width: 120%;
  left: -10%;
}

.nomalBtn {
  width: 100%;
  max-width: 305px;
  margin-top: 50px;
  position: relative;
}

.nomalBtn a {
  font-size: 18px;
  position: relative;
}

.nomalBtn::after {
  content: "";
  background: #000;
  width: 90px;
  height: 2px;
  position: absolute;
  top: 50%;
  right: -30px;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.nomalBtn:hover::after {
  right: -50px;
}

/*---------
HEADER
------------*/
.spDisp,
.sp580Disp {
  display: none;
}

.contentsInr {
  max-width: 1440px;
  margin: auto;
  width: 100%;
}

.header {
  position: fixed;
  z-index: 999;
  height: 72px;
  width: 100%;
  top: 0;
  transition: ease-in;
  font-size: 14px;
  font-style: italic;
}

.header::before {
  content: '';
  background-color: #8bb1db;
  height: 72px;
  width: 100%;
  position: absolute;
  top: -72px;
  left: 0;
  right: 0;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.header.active::before {
  top: 0;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.header .inr .logo {
  font-size: 12px;
  line-height: 1.3;
  position: absolute;
  padding: 17px 0 10px 30px;
  text-align: center;
  margin: 0;
}

.header .inr .logo img {
  width: 120px;
  height: 34px;
}

.header .inr .logo a {
  color: #fff;
  font-size: 17px;
  vertical-align: middle;
}

.header .inr .gNav {
  position: absolute;
  right: 27px;
  top: 24px;
  line-height: 1.8;
  margin-right: 20px;
}

.header .inr .gNav .gNav_inner {
  display: flex;
  align-items: center;
}

.header .inr .gNav .entry_btn a,
.header .inr .gNav .contact_btn a {
  padding: 8px 22px;
  border-radius: 69px;
  margin-top: -12px;
  color: #fff;
  display: inline-block;
  vertical-align: middle;
}

.header .inr .gNav li,
.header .inr .entry_btn {
  float: left;
  padding-left: 25px;
  line-height: 1.7;
}

/*---------
HEADER TATE
------------*/
.tateBtn li {
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  position: fixed;
  font-style: normal;
  left: calc(100% - 40px);
}

.tateBtn li.newEntry {
  top: 80px;
}

.tateBtn li.careerEntry {
  top: 320px;
}

.tateBtn li::after {
  position: absolute;
  content: '';
  width: 48px;
  border-radius: 48px;
  background-color: #000;
  top: 10px;
  height: 100%;
  z-index: -10;
  right: -7px;
}

.tateBtn li,
.tateBtn li.newEntry:hover,
.tateBtn li.careerEntry:hover,
.tateBtn li::after,
.tateBtn li.newEntry:hover::after,
.tateBtn li.careerEntry:hover::after {
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.tateBtn li.newEntry:hover {
  top: 90px;
}

.tateBtn li.newEntry:hover::after,
.tateBtn li.careerEntry:hover::after {
  top: 0;
}

.tateBtn li.careerEntry:hover {
  top: 330px;
}

.tateBtn li a {
  padding: 25px 13px;
  z-index: 20;
  width: 52px;
  border-radius: 26px;
  border: 2px solid #000;
  font-size: 18px;
  font-weight: 600;
}

.tateBtn li.newEntry a {
  background-color: #feffda;
  height: 210px;
}

.tateBtn li.careerEntry a {
  background-color: #b5d3f3;
  height: 250px;
}

/*---------
MV
------------*/
.mv {
  line-height: 0;
  position: relative;
  overflow: hidden;
}

/*---------
TOP以外のMV
------------*/
.mv .contTitle {
  position: absolute;
  top: 50%;
  left: 80px;
  line-height: 1.5;
}

/*---------
CONTENTS
------------*/
.allWrap {
  overflow: hidden;
}

.contentsWrap .wHalf {
  width: 50%;
  position: relative;
}

.contTitle {
  margin-bottom: 70px;
}

.contTitle span.ttlNoImg,
.contTitle span.ttlImg {
  color: #000;
  font-size: 50px;
  line-height: 1.3;
  font-style: italic;
  font-weight: bold;
}

.contTitle span.ttlImg {
  position: relative;
  display: inline-block;
  z-index: 1;
}

.contTitle span.ttlImg::after {
  position: absolute;
  content: '';
  width: 62px;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: -1;
  height: 62px;
  border-radius: 100%;
  background-color: #fdff50;
  left: -20px;
  top: -20px;
}

.contTitle span {
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  display: block;
  letter-spacing: 0.5rem;
  position: relative;
  z-index: 1;
}

.textBox .ttl {
  color: #3d6ea3;
  font-size: 22px;
}

.whiteBox {
  padding: 4px 12px 0px 12px;
  background-color: #fff;
  border: 2px solid #000;
  display: inline-block;
  position: relative;
}

.whiteBox::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 40px;
  right: -5px;
  bottom: -5px;
  background-color: #000;
  z-index: -2;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.dotWrap:hover .whiteBox::after {
  right: 0;
  bottom: 0;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

#breadChumbs {
  font-size: 13px;
  margin: 0 0 100px 80px;
  padding-top: 60px;
}

/*-------
footer
-----------*/
.entryArea {
  background: url(../cmn_img/borde.png) repeat center center;
}

.entryArea .contTitle {
  padding: 65px 81px 0;
}

.entryArea ul {
  width: 100%;
}

.entryArea ul li {
  width: 50%;
  float: left;
}

.entryArea ul li .hvrLarge .ttlBox {
  position: absolute;
  top: 20px;
  left: 60px;
  z-index: 10;
}

.entryArea ul li .hvrLarge .ttlBox .whiteBox {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 800;
}

.entryArea ul li.No01 .hvrLarge,
.entryArea ul li.No02 .hvrLarge {
  height: 300px;
}

.entryArea ul li.No01 .hvrLarge::after,
.entryArea ul li.No02 .hvrLarge::after {
  z-index: 0;
}

.entryArea ul li.No01 .hvrLarge::after {
  background: url(../cmn_img/new.jpg) no-repeat center center;
}

.entryArea ul li.No02 .hvrLarge:last-child::after {
  background: url(../cmn_img/career.jpg) no-repeat center center;
}

.entryArea ul li:hover .whiteBox::after {
  right: 0;
  bottom: 0;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.logoArea {
  background-color: #333;
  padding-top: 50px;
  color: #fff;
  text-align: center;
  margin-top: -11px;
}

.logoArea .logo {
  max-width: 200px;
  width: 98%;
  margin: 0 auto 25px;
}

.logoArea .txtaC a {
  color: #fff;
  line-height: 1;
  font-size: 13px;
}

.logoArea .copyright {
  padding: 10px;
  font-size: 11px;
}

/*--------------
interview
----------------*/
.interviewWrap {
  margin-right: -1%;
}

.interviewWrap li {
  width: 33%;
  position: relative;
}

.interviewWrap li::before {
  content: '';
  position: absolute;
  background-color: #333;
  opacity: 0.6;
  width: 100%;
  height: 100%;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.interviewWrap li:hover::before {
  opacity: 0.3;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.interviewWrap li .ttlBox {
  padding: 150px 0 80px;
  text-align: center;
  border: 1px solid #fff;
  width: 92%;
  margin: 4%;
  height: 420px;
}

.interviewWrap li .hvrLarge .ttlJa {
  font-size: 20px;
  color: #fff;
}

.interviewWrap li .hvrLarge .ttlJa span {
  font-size: 14px;
}

.hvrLarge::after {
  z-index: -1
}

.interviewWrap li.No01 .hvrLarge::after {
  background: url(../cmn_img/interview01.jpg) no-repeat center center;
}

.interviewWrap li.No02 .hvrLarge::after {
  background: url(../cmn_img/interview02.jpg) no-repeat center center;
}

.interviewWrap li.No03 .hvrLarge::after {
  background: url(../cmn_img/interview03.jpg) no-repeat center center;
}

.interviewWrap li.No04 .hvrLarge::after {
  background: url(../cmn_img/interview04.jpg) no-repeat center center;
}

.interviewWrap li.No05 .hvrLarge::after {
  background: url(../cmn_img/interview05.jpg) no-repeat center center;
}

.interviewWrap li .ttlBlack {
  background-color: #000;
  padding: 6px 10px 3px;
  font-size: 14px;
  border-radius: 3px;
}

.interviewWrap li .ttlEn {
  display: inline-block;
  margin-top: 20px;
}

.interviewWrap li.No02 .ttlEn {
  margin-top: 18px;
}

.interviewWrap li .name {
  font-size: 17px;
  text-align: left;
  padding-left: 10px
}

.interviewWrap li .name span {
  font-size: 10px;
}

.interviewWrap li .ttlBlack,
.interviewWrap li .name {
  display: table-cell;
  vertical-align: middle;
  color: #fff;
  line-height: 1.2;
}

@media only screen and (max-width: 980px) {

  .pcDisp,
  .sp580Disp {
    display: none;
  }

  .spDisp {
    display: block;
  }

  .contentsWrap .text {
    font-size: 80%;
  }

  /*-------
TITLE
-----------*/
  .mv .contTitle {
    left: 25px;
  }

  .contTitle {
    font-size: 50px;
    margin-bottom: 50px;
  }

  .contTitle span {
    font-size: 15px;
  }

  .textBox .ttl {
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 10px;
  }

  /*-------
BUTTON
-----------*/
  .nomalBtn {
    margin-top: 20px;
  }

  .nomalBtn a {
    font-size: 14px;
  }

  .hvrSlide {
    padding: 10px 0px 8px 20px;
  }

  /*-------
INTERVIEW
---------*/
  .interviewWrap li .ttlBox {
    height: 350px;
  }

  .interviewWrap ul {
    margin: 0;
  }

  .interviewWrap ul li {
    margin: 0 20px;
  }

  .interviewWrap ul li .interviewUnder {
    margin-left: 20%;
  }

  /*---------
HEADER
------------*/
  .header::before {
    height: 64px;
  }

  .header .inr .logo {
    width: 200px;
    position: relative;
    padding: 12px 0 0;
    margin: auto;
    display: block;
    text-align: center;
    font-size: 10px;
  }

  .header .inr .logo img {
    width: 110px;
  }

  .header .inr .logo a {
    font-size: 13px;
  }

  .drawer-hamburger {
    padding: 2.2rem 1.5rem 3rem 1.9rem !important;
  }

  .drawer-nav {
    background-color: #8bb1db !important;
  }

  .drawer-menu li a {
    transition: 0.3s;
    padding: 15px 20px;
    display: block;
  }

  .drawer-menu li:hover a {
    transition: 0.3s;
    background-color: #b5d3f3;
  }

  .tateBtn li {
    -webkit-writing-mode: horizontal-tb;
    -ms-writing-mode: horizontal-tb;
    writing-mode: horizontal-tb;
    position: relative;
    left: 10px;
  }

  .tateBtn li::after {
    border-radius: 48px;
    top: 0;
    height: 50px;
    left: 0;
  }

  .tateBtn li.newEntry::after {
    width: 180px;
  }

  .tateBtn li.careerEntry::after {
    width: 220px;
  }

  .tateBtn li:hover::after {
    top: -10px !important;
  }

  .tateBtn li.newEntry {
    top: 20px;
  }

  .tateBtn li.careerEntry {
    top: 60px;
  }

  .tateBtn li a {
    padding: 16px 20px 14px;
    width: auto;
  }

  .tateBtn li.newEntry:hover {
    top: 30px;
  }

  .tateBtn li.careerEntry:hover {
    top: 70px;
  }

  /*-------
footer
-----------*/
  .logoArea .logo {
    max-width: 150px;
    margin: 0 auto 20px;
  }
}

@media only screen and (max-width: 800px) {
  #breadChumbs {
    font-size: 11px;
    margin: 0 0 20px 20px;
    padding-top: 20px;
  }

  .interviewWrap li .ttlBox {
    padding: 120px 0 20px;
  }

  .entryArea ul li {
    width: 100%;
    float: none;
  }

  .entryArea ul li .hvrLarge .ttlBox {
    left: 20px;
  }
}

@media only screen and (max-width: 580px) {

  .borderR::before,
  .borderL::before {
    border: solid 5px #ebeff2;
  }

  .pcDisp,
  .mv .spDisp {
    display: none;
  }

  .spDisp,
  .mv .sp580Disp {
    display: block;
  }

  /*-------
TITLE
-----------*/
  .contTitle {
    font-size: 40px;
    margin-bottom: 40px;
    line-height: 1;
  }

  .contTitle span {
    font-size: 14px;
  }

  .contTitle span.ttlImg::after {
    width: 52px;
    height: 52px;
  }

  .contTitle span.ttlImg,
  .contTitle span.ttlImgSP {
    font-size: 35px;
  }

  .textBox .ttl {
    font-size: 16px;
    line-height: 1.4;
  }

  .inrTtl {
    font-size: 23px;
    margin-bottom: 10px;
  }

  /*-------
BUTTON
-----------*/
  .nomalBtn {
    margin: 20px auto;
    max-width: 250px;
  }

  .nomalBtn a {
    font-size: 16px;
  }

  .nomalBtn a::after {
    width: 70px;
  }

  .interviewWrap ul li .interviewUnder {
    margin-left: 20%;
  }

  /*-------
COMMON
-----------*/
  .contentsWrap section {
    padding: 60px 10px 30px;
  }

  /*-------
INTREVIEW
-----------*/
  .interviewWrap li .hvrLarge .ttlJa span {
    font-size: 12px;
  }

  .interviewWrap li .hvrLarge .ttlJa {
    font-size: 16px;
    color: #fff;
  }

  .interviewWrap li .name {
    font-size: 15px;
    padding-left: 6px;
  }

  .interview .slick-next {
    right: -20px !important;
  }

  .interview .slick-prev {
    left: -20px !important;
  }

  .slick-prev::before,
  .slick-next::before {
    color: #000 !important;
  }

  .contents04 ul li .ttlBox .ttlJa {
    font-size: 18px;
    line-height: 1.3;
  }

  .contents04 ul li .ttlBox .ttlEn {
    margin-top: 10px;
  }

  .contents04 ul li .ttlBox .ttlEn .name {
    padding: 0 10px;
    font-size: 14px;
  }
}

@media only screen and (max-width: 360px) {
  .contTitle span.ttlImg {
    text-align: left;
  }
}





/*-------
ドロワーメニュー「募集要項」ボタン
-----------*/
.simpleBox {
  margin: -7px 0 0 20px;
}

@media only screen and (max-width: 980px) {
  .simpleBox {
    padding: 0 20px;
    margin: 10px 0;
  }
}

.simpleBox a {
  display: inline-block;
  font-weight: bold;
  font-style: normal;
  background-color: #fff;
  border: 3px solid #000;
  padding: 9px 20px 6px;
  line-height: 1;
}

@media only screen and (max-width: 980px) {
  .simpleBox a {
    padding: 10px 30px 7px;
  }
}