/* カスタマイズ用CSS */
html, body, div, span, applet, object, iframe, figure,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption,
tbody, tfoot, thead, table, label, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  outline: 0;
  vertical-align: baseline;
  list-style: none;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif; }

* {
  box-sizing: border-box; }

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

html {
  font-size: 62.5%; }

body {
  color: #202020;
  font-size: 1.4rem;
  line-height: 1.8;
  overflow-x: hidden; }

a {
  color: inherit;
  text-decoration: none; }
  a:hover {
    color: inherit;
    text-decoration: none; }

p:empty {display: none;}

img, iframe {
  max-width: 100%;
  height: auto; }

input {
  border: none;
  /* Google Chrome, Safari, Opera 15+, Android, iOS */
  /* Firefox 18- */
  /* Firefox 19+ */
  /* IE 10+ */ }
  input:placeholder-shown {
    color: #a8a8a8; }
  input::-webkit-input-placeholder {
    color: #a8a8a8; }
  input:-moz-placeholder {
    color: #a8a8a8;
    opacity: 1; }
  input::-moz-placeholder {
    color: #a8a8a8;
    opacity: 1; }
  input:-ms-input-placeholder {
    color: #a8a8a8; }

textarea {
  /* Google Chrome, Safari, Opera 15+, Android, iOS */
  /* Firefox 18- */
  /* Firefox 19+ */
  /* IE 10+ */ }
  textarea:placeholder-shown {
    color: #a8a8a8; }
  textarea::-webkit-input-placeholder {
    color: #a8a8a8; }
  textarea:-moz-placeholder {
    color: #a8a8a8;
    opacity: 1; }
  textarea::-moz-placeholder {
    color: #a8a8a8;
    opacity: 1; }
  textarea:-ms-input-placeholder {
    color: #a8a8a8; }
    
    
@media screen and (min-width: 768px) {

  .ec-newItemRole .ec-newItemRole__list {
    flex-wrap: wrap; }
  .ec-newItemRole .ec-newItemRole__listItem {
    width: calc((100% - 60px) / 4);
    margin-right: 20px; }
  .ec-newItemRole .ec-newItemRole__listItem:not(:last-of-type),
  .ec-newItemRole .ec-newItemRole__listItem:nth-child(odd) {
    margin-right: 20px; }
  .ec-newItemRole .ec-newItemRole__listItem:nth-child(4n),
  .ec-newItemRole .ec-newItemRole__listItem:last-child {
    margin-right: 0; }

}

@media screen and (max-width: 767px) {
    
  .ec-headerNav {
      display: flex;
      align-items: center;
  }

}