@charset "UTF-8";
/* ==========================================================
 keyframes
========================================================== */
/* fade-in */
@-webkit-keyframes fade-in {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}

/* zoom-in */
@-webkit-keyframes zoom-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  50% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}
@keyframes zoom-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  50% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}

/* shake-in */
@-webkit-keyframes shake-in {
  0% {
    opacity: 0;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  60% {
    opacity: 0;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  90% {
    opacity: 1;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  96% {
    opacity: 1;
    -webkit-transform: rotate(-8deg);
            transform: rotate(-8deg);
  }
  98% {
    opacity: 1;
    -webkit-transform: rotate(8deg);
            transform: rotate(8deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
}
@keyframes shake-in {
  0% {
    opacity: 0;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  60% {
    opacity: 0;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  90% {
    opacity: 1;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  96% {
    opacity: 1;
    -webkit-transform: rotate(-8deg);
            transform: rotate(-8deg);
  }
  98% {
    opacity: 1;
    -webkit-transform: rotate(8deg);
            transform: rotate(8deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
}
@-webkit-keyframes flash {
    0%{
      -webkit-transform: scale(1.1);
      transform: scale(1.1);
    }
    50%,100% {
      -webkit-transform: scale(1);
      transform: scale(1);
    }
}
@keyframes flash {
    0%{
      -webkit-transform: scale(1.1);
      transform: scale(1.1);
    }
    50%,100% {
      -webkit-transform: scale(1);
      transform: scale(1);
    }
}
@-webkit-keyframes pulsate {
  0% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 0.6;
  }
  50% {opacity: 0.3; }
  100% {
    -webkit-transform: scale(1.5, 1.5);
    transform: scale(1.5, 1.5);
    opacity: 0.0;
  }
}
@keyframes pulsate {
  0% {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    opacity: 0.6;
  }
  50% {opacity: 0.3; }
  100% {
    -webkit-transform: scale(1.5, 1.5);
    transform: scale(1.5, 1.5);
    opacity: 0.0;
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(360deg);
  }
}
@-ms-keyframes spin {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/* ==========================================================
 reseting
========================================================== */
body, div, pre, p, blockquote, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, th, td, button, figure, figcaption {
  margin: 0;
  padding: 0;
}

main, article, aside, figure, figcaption, footer, header, nav, section {
  display: block;
}

input, textarea {
  margin: 0;
  font-size: inherit;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

input, textarea, select, option, optgroup {
  font-family: inherit;
  font-style: normal;
}

textarea {
  height: auto;
  resize: none;
}

select {
  font-size: inherit;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

select::-ms-expand {
  display: none;
}

button {
  display: inline-block;
  padding: 0;
  border: none;
  overflow: visible;
  vertical-align: top;
  font: inherit;
  font-family: inherit;
  background: none;
  color: inherit;
  font-size: 100%;
  opacity: 1;
  cursor: pointer;
  outline: none;
  text-transform: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-appearance: none;
}

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

[disabled] {
  cursor: default;
}

label {
  cursor: pointer;
}

label img {
  pointer-events: none;
}

table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: inherit;
}

th, td {
  vertical-align: top;
}

fieldset, img {
  border: 0;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

address, caption, code, em, th {
  font-style: normal;
  font-weight: normal;
}

ol, ul {
  list-style: none;
}

caption, th {
  text-align: left;
}

h1, h2, h3, h4, h5, h6, strong, em {
  font-size: 100%;
  font-weight: normal;
}

em {
  font-style: normal;
}

b, strong {
  font-weight: bold;
}

sup {
  vertical-align: top;
}

sub {
  vertical-align: baseline;
}

br {
  font-size: 0;
  line-height: 0;
}

i {
  display: inline-block;
  vertical-align: middle;
  font-style: normal;
}

hr {
  display: block;
  height: 0;
  border: none;
  margin: 0;
}

*, *:before, *:after {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

::-ms-clear {
  display: none;
}

a, button, input, textarea {
  -webkit-tap-highlight-color: transparent;
}

/* ==========================================================
 setting
========================================================== */
html {
  overflow-y: scroll;
}

body {
  min-width: 1280px;
  position: relative;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
  line-height: 1.5;
  color: #474747;
  font-size: 16px;
  word-wrap: break-word;
  overflow-wrap: break-word;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
}

/* ==========================================================
 base Link
========================================================== */
a, p.js-work-title {
  color: #1e97cd;
  text-decoration: none;
  opacity: 1;
  transition: 0.3s;
}

a:hover,
button:hover,
p.js-work-title:hover {
  opacity: 0.6;
}

a[href^="tel"] {
  pointer-events: none;
  cursor: default;
  color: inherit;
}

.registration-terms .table-cmn-form-cell.table-cmn-form-detail a,
.required-prf-info li.list-cmn-notes-item a {
  text-decoration: underline;
}

a[href^="tel"]:hover {
  opacity: 1;
}

/* ==========================================================
 input
========================================================== */
input {
  width: 100%;
}

input[type="radio"],
input[type="checkbox"] {
  width: auto;
}

input[type="text"],
input[type="search"],
input[type="tel"],
input[type="email"],
input[type="url"],
input[type="password"] {
  display: inline-block;
  height: 40px;
  padding: 0 16px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background-color: #fff;
  outline: none;
  vertical-align: middle;
}



input[type="text"]:disabled,
input[type="search"]:disabled,
input[type="tel"]:disabled,
input[type="email"]:disabled,
input[type="url"]:disabled,
input[type="password"]:disabled {
  background-color: #e0ded5;
  zoom: normal;
}
input[type="text"]:read-only,
input[type="search"]:read-only,
input[type="tel"]:read-only,
input[type="email"]:read-only,
input[type="url"]:read-only,
input[type="password"]:read-only {
  background-color: #e0ded5;
  zoom: normal;
}

.registration-birth input[type="text"] {
  text-align: center;
}

.registration-prfctrs select,
.registration-display-name input[type="text"] {
  width: 290px;
}

/* ==========================================================
 textarea
========================================================== */
textarea {
  display: inline-block;
  width: 100%;
  height: 230px;
  padding: 12px 16px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background-color: #fff;
  outline: none;
  vertical-align: middle;
}

textarea:disabled {
  background-color: #e0ded5;
}

textarea:read-only {
  background-color: #e0ded5;
}

/* ==========================================================
 select
========================================================== */
select {
  display: inline-block;
  width: 100%;
  height: 40px;
  padding: 0 40px 0 16px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background: #fff url(../img/common/ico_select_01.png) right 17px center no-repeat;
  outline: none;
  font-size: 14px;
  vertical-align: middle;
}

select:disabled {
  background-color: #e0ded5;
  background-image: url(../img/common/ico_select_02.png);
}

/* ==========================================================
 hr
========================================================== */
hr {
  position: relative;
  width: 500%;
  height: 1px;
  margin: 40px 0 40px -250%;
  background-color: #e0ded5;
}

hr + [class]:not(.s-auto) {
  margin-top: 0;
}

/* ==========================================================
 layout style
========================================================== */
/* container
---------------------------------------------------------- */
.l-container {
  width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

.l-container-narrow {
  width: 960px;
  margin-left: auto;
  margin-right: auto;
}

.l-container-thin {
  width: 860px;
  margin-left: auto;
  margin-right: auto;
}

.l-container-form {
  width: 760px;
  margin-left: auto;
  margin-right: auto;
}

.l-container-form.uh-contents-wrapp {
  padding-bottom: 65px;
  width: auto;
}

.l-container-sp-header {
  width: 1160px;
  margin-left: auto;
  margin-right: auto;
}

/* core
---------------------------------------------------------- */
.l-core,
.l-core-pc {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

/* edge
---------------------------------------------------------- */
/* l-cont
---------------------------------------------------------- */
.l-cont {
  padding: 0 17px;
}

/* prev & next
---------------------------------------------------------- */
.l-prev {
  position: absolute;
  left: 20px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.l-close {
  position: absolute;
  right: 20px;
  top: 0;
  bottom: 0;
  margin: auto;
  text-align: right;
}

/* l-foot
---------------------------------------------------------- */
.l-foot {
  margin-left: -15px;
  margin-right: -15px;
  padding: 15px 15px 0;
  border-top: 1px solid #dcdcdc;
}

.l-foot--plus {
  padding-bottom: 5px;
}

/* l-fixed
---------------------------------------------------------- */
.l-fixed {
  width: 100%;
  position: fixed;
  bottom: 0;
  z-index: 10;
}

.l-fixed-in {
  width: 100%;
  position: absolute;
  bottom: 0;
  z-index: 10;
}

.l-fixed-in.is-scroll-end {
  z-index: 25;
}

/* l-list
---------------------------------------------------------- */
.l-list {
  margin-top: 30px;
}

.l-list:first-child {
  margin-top: 0;
}

.l-list-item {
  margin-top: 30px;
}

.l-list-item:first-child {
  margin-top: 0;
}

.l-list-message {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
}

/* l-menu
---------------------------------------------------------- */
.l-menu {
  margin-top: 30px;
}

.l-menu:first-child {
  margin-top: 0;
}

.l-menu-leave {
  margin-top: 100px;
}

.l-menu-item {
  margin-top: 30px;
}

.l-menu-item:first-child {
  margin-top: 0;
}

/* l-center
---------------------------------------------------------- */
.l-center,
.l-center-narrow,
.l-center-middle,
.l-center-thin,
.l-center-low,
.l-center-wide,
.l-center-long {
  margin-top: 60px;
  text-align: center;
  letter-spacing: -.5em;
}

.l-center:first-child,
.l-center-narrow:first-child,
.l-center-middle:first-child,
.l-center-thin:first-child,
.l-center-low:first-child,
.l-center-long:first-child {
  margin-top: 0;
}

.l-center > *,
.l-center-narrow > *,
.l-center-middle > *,
.l-center-thin > *,
.l-center-low > *,
.l-center-wide > *,
.l-center-long > * {
  letter-spacing: normal;
}

.l-center + .l-center,
.l-center-narrow + .l-center,
.l-center-middle + .l-center,
.l-center-thin + .l-center,
.l-center-low + .l-center,
.l-center-wide + .l-center,
.l-center-long + .l-center, .l-center +
.l-center-narrow,
.l-center-narrow +
.l-center-narrow,
.l-center-middle +
.l-center-narrow,
.l-center-thin +
.l-center-narrow,
.l-center-low +
.l-center-narrow,
.l-center-wide +
.l-center-narrow,
.l-center-long +
.l-center-narrow, .l-center +
.l-center-middle,
.l-center-narrow +
.l-center-middle,
.l-center-middle +
.l-center-middle,
.l-center-thin +
.l-center-middle,
.l-center-low +
.l-center-middle,
.l-center-wide +
.l-center-middle,
.l-center-long +
.l-center-middle, .l-center +
.l-center-thin,
.l-center-narrow +
.l-center-thin,
.l-center-middle +
.l-center-thin,
.l-center-thin +
.l-center-thin,
.l-center-low +
.l-center-thin,
.l-center-wide +
.l-center-thin,
.l-center-long +
.l-center-thin, .l-center +
.l-center-low,
.l-center-narrow +
.l-center-low,
.l-center-middle +
.l-center-low,
.l-center-thin +
.l-center-low,
.l-center-low +
.l-center-low,
.l-center-wide +
.l-center-low,
.l-center-long +
.l-center-low, .l-center +
.l-center-wide,
.l-center-narrow +
.l-center-wide,
.l-center-middle +
.l-center-wide,
.l-center-thin +
.l-center-wide,
.l-center-low +
.l-center-wide,
.l-center-wide +
.l-center-wide,
.l-center-long +
.l-center-wide, .l-center +
.l-center-long,
.l-center-narrow +
.l-center-long,
.l-center-middle +
.l-center-long,
.l-center-thin +
.l-center-long,
.l-center-low +
.l-center-long,
.l-center-wide +
.l-center-long,
.l-center-long +
.l-center-long {
  margin-top: 40px;
}

.l-center-narrow {
  margin-top: 50px;
}

.l-center-middle {
  margin-top: 40px;
}

.l-center-thin {
  margin-top: 30px;
}

.l-center-thin + .l-center-thin {
  margin-top: 30px;
}

.l-center-low {
  margin-top: 20px;
}

.l-center-wide {
  margin-top: 80px;
}

.l-center-long {
  margin-top: 100px;
}

/* l-right
---------------------------------------------------------- */
.l-right {
  margin-top: 30px;
  text-align: right;
  letter-spacing: -.5em;
}

.l-right:first-child {
  margin-top: 0;
}

.l-right > * {
  letter-spacing: normal;
}

.l-right + .l-right {
  margin-top: 40px;
}

/* l-right-top-fix
---------------------------------------------------------- */
/* l-grid
---------------------------------------------------------- */
.l-grid {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-left: -20px;
  margin-right: -20px;
}

.l-grid-col {
  margin-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}

.l-grid-col-pad-l-0 {
  padding-left: 0px;
}

.l-grid-layout .l-grid-col {
  margin-top: 0;
}

.l-grid-col-lg-1 {
  max-width: 8.33333%;
  -webkit-flex-basis: 8.33333%;
      -ms-flex-preferred-size: 8.33333%;
          flex-basis: 8.33333%;
}

.l-grid-col-lg-1-5 {
  max-width: 14.28571%;
  -webkit-flex-basis: 14.28571%;
      -ms-flex-preferred-size: 14.28571%;
          flex-basis: 14.28571%;
}

.l-grid-col-lg-2 {
  max-width: 16.66667%;
  -webkit-flex-basis: 16.66667%;
      -ms-flex-preferred-size: 16.66667%;
          flex-basis: 16.66667%;
}

.l-grid-col-lg-2-5 {
  max-width: 20%;
  -webkit-flex-basis: 20%;
      -ms-flex-preferred-size: 20%;
          flex-basis: 20%;
}

.l-grid-col-lg-3 {
  max-width: 25%;
  -webkit-flex-basis: 25%;
      -ms-flex-preferred-size: 25%;
          flex-basis: 25%;
}

.l-grid-col-lg-4 {
  max-width: 33.33333%;
  -webkit-flex-basis: 33.33333%;
      -ms-flex-preferred-size: 33.33333%;
          flex-basis: 33.33333%;
}

.l-grid-col-lg-5 {
  max-width: 41.66667%;
  -webkit-flex-basis: 41.66667%;
      -ms-flex-preferred-size: 41.66667%;
          flex-basis: 41.66667%;
}

.l-grid-col-lg-6 {
  max-width: 50%;
  -webkit-flex-basis: 50%;
      -ms-flex-preferred-size: 50%;
          flex-basis: 50%;
}

.l-grid-col-lg-7 {
  max-width: 58.33333%;
  -webkit-flex-basis: 58.33333%;
      -ms-flex-preferred-size: 58.33333%;
          flex-basis: 58.33333%;
}

.l-grid-col-lg-8 {
  max-width: 66.66667%;
  -webkit-flex-basis: 66.66667%;
      -ms-flex-preferred-size: 66.66667%;
          flex-basis: 66.66667%;
}

.l-grid-col-lg-9 {
  max-width: 75%;
  -webkit-flex-basis: 75%;
      -ms-flex-preferred-size: 75%;
          flex-basis: 75%;
}

.l-grid-col-lg-10 {
  max-width: 83.33333%;
  -webkit-flex-basis: 83.33333%;
      -ms-flex-preferred-size: 83.33333%;
          flex-basis: 83.33333%;
}

.l-grid-col-lg-11 {
  max-width: 83.33333%;
  -webkit-flex-basis: 83.33333%;
      -ms-flex-preferred-size: 83.33333%;
          flex-basis: 83.33333%;
}

.l-grid-col-lg-12 {
  max-width: 100%;
  -webkit-flex-basis: 100%;
      -ms-flex-preferred-size: 100%;
          flex-basis: 100%;
}

.l-grid-col-lg-main {
  max-width: 700px;
  -webkit-flex-basis: 700px;
      -ms-flex-preferred-size: 700px;
          flex-basis: 700px;
}

.l-grid-col-lg-sub {
  max-width: 300px;
  -webkit-flex-basis: 300px;
      -ms-flex-preferred-size: 300px;
          flex-basis: 300px;
}

.l-grid-col-lg-1:nth-child(-n+12), .l-grid-col-lg-1-5:nth-child(-n+7), .l-grid-col-lg-2:nth-child(-n+6), .l-grid-col-lg-2-5:nth-child(-n+5), .l-grid-col-lg-3:nth-child(-n+4), .l-grid-col-lg-4:nth-child(-n+3), .l-grid-col-lg-6:nth-child(-n+2), .l-grid-col-lg-12:nth-child(-n+1) {
  margin-top: 0;
}

.l-grid-col-required {
  vertical-align: -20px;
}

.l-grid-row {
  height: 100%;
}

.l-grid-order-lg-1 {
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1;
}

.l-grid-order-lg-2 {
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2;
}

.l-grid-order-lg-3 {
  -webkit-order: 3;
      -ms-flex-order: 3;
          order: 3;
}

.l-grid-order-lg-4 {
  -webkit-order: 4;
      -ms-flex-order: 4;
          order: 4;
}

.l-grid-order-lg-5 {
  -webkit-order: 5;
      -ms-flex-order: 5;
          order: 5;
}

.l-grid-order-lg-6 {
  -webkit-order: 6;
      -ms-flex-order: 6;
          order: 6;
}

.l-grid-order-lg-7 {
  -webkit-order: 7;
      -ms-flex-order: 7;
          order: 7;
}

.l-grid-order-lg-8 {
  -webkit-order: 8;
      -ms-flex-order: 8;
          order: 8;
}

.l-grid-order-lg-9 {
  -webkit-order: 9;
      -ms-flex-order: 9;
          order: 9;
}

.l-grid-order-lg-10 {
  -webkit-order: 10;
      -ms-flex-order: 10;
          order: 10;
}

.l-grid-order-lg-11 {
  -webkit-order: 11;
      -ms-flex-order: 11;
          order: 11;
}

.l-grid-order-lg-12 {
  -webkit-order: 12;
      -ms-flex-order: 12;
          order: 12;
}

/* ==========================================================
 header
========================================================== */
.header {
  border-bottom: 2px solid #dcdcdc;
  background-color: #fff;
}

.header-contents {
  overflow: hidden;
}

.header-logo {
  float: left;
  padding-top: 23px;
  font-size: 0;
}

.header-logo a {
  display: inline-block;
  width: 224px;
  height: 34px;
  background: url(../img/common/ico_logo_01.png) no-repeat 0 0;
}

.header-logo-main {
  width: 64px;
  vertical-align: bottom;
}

.header-logo-sub {
  width: 69px;
  margin-left: 6px;
  vertical-align: bottom;
}

.header-utility {
  display: table;
  float: right;
  padding: 15px 0 13px;
}

.header-lead {
  display: table-cell;
  padding-right: 25px;
  vertical-align: middle;
  overflow: hidden;
}

.header-lead-list {
  float: left;
  margin-left: 50px;
}

.header-lead-link {
  display: inline-block;
  position: relative;
  padding-left: 46px;
  color: #474747;
  font-size: 0;
}

.header-lead-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.header-lead-txt {
  font-size: 16px;
  font-weight: bold;
}

.header-links {
  display: table-cell;
  vertical-align: middle;
}

.header-links-list {
  float: left;
  margin-left: 15px;
}

.header-status {
  float: right;
  display: table;
  height: 78px;
  padding: 0 20px 0 27px;
  border-left: 1px solid #dcdcdc;
  border-right: 1px solid #dcdcdc;
}

.header-status:hover {
  background-color: #faf8f0;
  opacity: 1;
}

.header-status-ttl {
  display: table-cell;
  padding-right: 33px;
  vertical-align: middle;
  font-size: 18px;
  font-weight: bold;
  color: #1e97cd;
}

.header-status-ttl .link-cmn-arrow-right {
  color: #1e97cd;
}

.header-status-ttl .link-cmn-arrow-right:before {
  border-color: transparent transparent transparent #1e97cd;
}

.header-status-detail {
  display: table-cell;
  vertical-align: middle;
}

.header-status-item {
  position: relative;
  min-width: 138px;
  padding-left: 30px;
  margin: 4px 0;
  text-align: right;
  line-height: 1.05;
  color: #474747;
}

.header-status-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.header-status-item-num {
  font-size: 23px;
  font-weight: bold;
}

.header-status-item-unit {
  margin-left: 5px;
  font-size: 18px;
}

.header-status-item-unit-yen {
  font-size: 13px;
}

.header-status-account {
  width: 271px;
  padding: 18px 7px 13px 0;
}

.header-status-account-ttl {
  position: relative;
  padding-left: 19px;
  line-height: 1.05;
  font-size: 16px;
  font-weight: bold;
  color: #000;
}

.header-status-account-ico {
  position: absolute;
  left: 0;
  top: -5px;
  bottom: 0;
  margin: auto;
}

.header-status-account-txt {
  margin-top: 10px;
  line-height: 1.05;
  font-size: 16px;
  word-break: break-all;
}

.header-status-account-txt .link-cmn-arrow-right:before {
  top: 0;
  bottom: 0;
}

#header-org.is-disabled,#nav-org.is-disabled {
  pointer-events: none;
}

/* ==========================================================
 footer
========================================================== */
.footer {
  width: 100%;
  background-color: #333;
  font-size: 14px;
}

.footer-in {
  padding: 60px 0 80px;
}

.footer-utility {
  text-align: center;
  letter-spacing: -.5em;
  margin: 0 -14px;
}

.footer-utility-list {
  width: 210px;
  display: inline-block;
  letter-spacing: normal;
  margin: 0 14px;
}

.footer-utility-list:first-child {
  margin-left: 0;
}

.footer-utility-list:last-child {
  margin-right: 0;
}

.footer-utility-list:nth-child(5) {
  margin-right: 0;
}

.footer-utility-list:nth-child(6) {
  margin-top: 20px;
  margin-right: 14px;
  margin-left: 0;
}

.footer-utility-link {
  display: block;
  padding: 13px 20px;
  background-color: #474747;
  border-radius: 20px;
  line-height: 1.05;
  font-size: 14px;
  color: #c1c5c7;
}

.footer-utility-link.another-account{
  padding-left: 0;
  padding-right: 0;
}

.footer-links {
  margin-top: 50px;
  text-align: center;
  letter-spacing: -0.5em;
}

.footer-links-list {
  display: inline-block;
  padding: 0 20px;
  border-left: 1px solid #4b4b4b;
  letter-spacing: normal;
  line-height: 1.05;
  font-size: 12px;
}

.footer-links-list:first-child,
.br + .footer-links-list,
.only-pc + .footer-links-list {
  border-left: none;
}

.footer-links-link {
  color: #c1c5c7;
}

.footer-links-link span {
  font-size: 10px;
}

.footer-copyright {
  margin-top: 80px;
  text-align: center;
  line-height: 1.05;
  color: #fff;
}

.footer-order {
  position: fixed;
  width: 100%;
  min-width: 1280px;
  margin: auto;
  left: 0;
  bottom: 0;
  padding: 18px 60px 20px;
  border-top: 2px solid #44bac7;
  background-color: #fff;
  text-align: center;
  z-index: 10;
  letter-spacing: -.5em;
}

.footer-order-item {
  display: inline-block;
  margin: 0 20px;
  vertical-align: middle;
  letter-spacing: normal;
}

.footer-order-prev {
  display: inline-block;
  width: auto;
  padding-left: 25px;
  position: relative;
  height: 18px;
  line-height: 18px;
  top: 0;
  bottom: 0;
  margin-top: 20px;
  letter-spacing: normal;
}

.footer-order-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.footer-button-list-sp {
  font-size: 0px;
  border-top-style: solid; border-color:#D8D8D8; border-width: 1px;
  height: 78px;
}

.footer-button-sp {
  background-color:#F5F5F5;
  width:100%;
}

.footer-back-sp,
.footer-moveon-sp,
.footer-reload-sp,
.footer-top-sp {
  width: 25%;
  height:100%;
  text-align: center;
  display: inline-block;
}

.footer-button-fix {
  display: block;
  position: fixed;
  z-index: 1043;
  bottom: 0px;
}

.footer-back-sp-icon,.footer-moveon-sp-icon,.footer-reload-sp-icon,.footer-top-sp-icon {
  background-size: 100%;
  background-repeat: no-repeat;
  margin-top: 23px;
  width: 32px;
  height: 32px;
}

.footer-back-sp-icon {
  background-image: url(../img/common/icn_bb_back_on@3x.png);
}

.footer-moveon-sp-icon {
  background-image: url(../img/common/icn_bb_next_on@3x.png);
}

.footer-reload-sp-icon {
  background-image: url(../img/common/icn_bb_update_on@3x.png);
}

.footer-top-sp-icon {
  background-image: url(../img/common/icn_bb_home_on@3x.png);
}

/* ==========================================================
 wrapper
========================================================== */
.wrapper {
  background-color: #44bac7;
}

/* ==========================================================
 contents
========================================================== */
.contents {
  width: 100%;
  background-color: #faf8f0;
  overflow: hidden;
}

.contents-main {
  position: relative;
  padding: 50px 0 100px;
  background-color: #faf8f0;
}

.contents-fit {
  padding-top: 0;
  padding-bottom: 0;
}

.contents-just {
  padding: 0;
}

.contents-color,
.contents-color .contents-main {
  background-color: #fff;
}

.contents-head {
  padding: 36px 0;
  background-color: #44bac7;
  color: #fff;
}

.contents-head-in {
  position: relative;
}

.contents-head-prev, .contents-head-next {
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  height: 18px;
  line-height: 18px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
}

.contents-head-prev {
  left: 0;
  padding-left: 24px;
}

.contents-head-prev-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.contents-foot {
  border-top: 1px solid #e0ded5;
  padding: 60px 0;
}

.contents-breadcrumb {
  padding: 13px 0 12px;
  background-color: #3da7b3;
  color: #fff;
}

.contents-breadcrumb.contents-breadcrumb-client {
  padding: 20px 0;
}

.contents-primary {
  width: 860px;
  float: left;
}

.contents-primary-message {
  width: 800px;
  float: right;
}

.contents-secondary {
  width: 240px;
  float: right;
}

.contents-secondary-message {
  position: relative;
  width: 360px;
  float: left;
  border-left: 1px solid #e0ded5;
  border-right: 1px solid #e0ded5;
}

.contents-secondary-following {
  z-index: 2;
}

.contents-space {
  padding-top: 100px;
}

.contents-title {
  padding-top: 37px;
  padding-bottom: 37px;
}

/* ==========================================================
 pagetop
========================================================== */
.pagetop {
  display: none;
}

.pagetop a {
  position: fixed;
  right: 30px;
  bottom: 20px;
  display: block;
  white-space: nowrap;
  text-indent: -9999px;
  overflow: hidden;
  z-index: 11;
  transition: opacity 0.3s;
}

/* ==========================================================
 breadcrumb
========================================================== */
.breadcrumb-lists:after {
  content: '';
  display: block;
  clear: both;
}

.breadcrumb-list {
  float: left;
  font-size: 12px;
}

.breadcrumb-list:before {
  content: '';
  display: inline-block;
  margin: 0 9px;
  vertical-align: middle;
  background-image: url(../img/common/sprite.png);
  background-position: 0px -562px;
  width: 8px;
  height: 12px;
}

.breadcrumb-list:first-child:before {
  content: none;
}

.contents-breadcrumb-client .breadcrumb-list {
  font-size: 14px;
}

.breadcrumb-link {
  color: #fff;
  text-decoration: underline;
}

.breadcrumb-home {
  margin-right: 7px;
  margin-top: -3px;
}

/* ==========================================================
 print
========================================================== */
@media print {
  body {
    min-width: 0;
  }
  body.print .l-container {
    width: 100%;
  }
  body.print .contents-main {
    padding-top: 0;
    padding-bottom: 0;
  }
  body.print .btn-cmn {
    display: none;
  }
}

body.print .wrapper,
body.print .contents {
  background-color: #fff;
}

body.print .ttl-cmn-print-01 {
  text-align: center;
  padding-bottom: 10px;
  margin-bottom: 20px;
  border-bottom: 1px solid #e0ded5;
  font-size: 26px;
  font-weight: bold;
}

body.print .ttl-cmn-print-02 {
  text-align: center;
  padding-bottom: 10px;
  margin-bottom: 20px;
  border-bottom: 1px solid #e0ded5;
  font-size: 20px;
}

body.print .mod-cmn-print-head {
  text-align: right;
  margin-bottom: 20px;
}

body.print .mod-cmn-print-detail {
  margin-bottom: 20px;
  overflow: hidden;
}

body.print .mod-cmn-print-detail .mod-cmn-print-detail-ttl {
  float: left;
  width: 48%;
}

body.print .mod-cmn-print-detail .mod-cmn-print-detail-body {
  float: right;
  width: 48%;
}

body.print .table-cmn-stripe {
  border-bottom: none;
  border-top: 1px solid #e0ded5;
  border-left: 1px solid #e0ded5;
  border-right: 1px solid #e0ded5;
}

body.print .table-cmn-stripe-head .table-cmn-stripe-row:nth-child(2n+1) .table-cmn-stripe-cell {
  background-color: #808080;
  color: #fff;
}

body.print .table-cmn-stripe-cell {
  border-bottom: 1px solid #e0ded5;
  background: none;
}

body.print .table-cmn-stripe-ttl-in {
  border-color: #fff;
}

body.print .list-cmn-dot-item:before {
  background-color: #474747;
}

/* ==========================================================
 navi
========================================================== */
/* nav-cmn-global
---------------------------------------------------------- */
.nav-cmn-global {
  /* current */
  /* is-fixed */
}

.nav-cmn-global-wrap {
  width: 100%;
  height: 60px;
  background-color: #fff;
  border-bottom: 1px solid #44bac7;
}

.nav-cmn-global-contents {
  position: relative;
}

.nav-cmn-global-lists {
  padding: 22px 0;
}

.nav-cmn-global-lists:after {
  content: '';
  display: block;
  clear: both;
}

.nav-cmn-global-list {
  float: left;
  margin-right: 50px;
  line-height: 1.05;
  font-size: 0;
}

.nav-cmn-global-link {
  position: relative;
  padding-left: 44px;
  color: #474747;
}

.nav-cmn-global-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.nav-cmn-global-txt {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  font-size: 16px;
  font-weight: bold;
}

.nav-cmn-global-list-message .nav-cmn-global-txt,
.nav-cmn-global-list-luckybox .nav-cmn-global-txt  {
  padding-right: 33px;
}

.nav-cmn-global-txt-default .nav-cmn-global-txt {
  padding-right: 0;
}

.nav-cmn-global-count {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  border-radius: 50%;
  color: #fff;
  background-color: #ff5a5f;
  font-size: 15px;
}

.nav-cmn-global-order {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  height: 40px;
  margin: auto;
}

body.home .nav-cmn-global-list-home .nav-cmn-global-link,
body.keep .nav-cmn-global-list-keep .nav-cmn-global-link,
body.message .nav-cmn-global-list-message .nav-cmn-global-link,
body.mymenu .nav-cmn-global-list-mypage .nav-cmn-global-link,
body.setting .nav-cmn-global-list-setting .nav-cmn-global-link,
body.guide .nav-cmn-global-list-guide .nav-cmn-global-link,
body.luckybox .nav-cmn-global-list-luckybox .nav-cmn-global-link,
body.information .nav-cmn-global-list-information .nav-cmn-global-link,
body.help .nav-cmn-global-list-help .nav-cmn-global-link {
  color: #3da7b3;
}

body.home .nav-cmn-global-list-home .nav-cmn-global-ico {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3300px;
  width: 30px;
  height: 30px;
}

body.keep .nav-cmn-global-list-keep .nav-cmn-global-ico {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3552px;
  width: 32px;
  height: 30px;
}

body.message .nav-cmn-global-list-message .nav-cmn-global-ico {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4624px;
  width: 32px;
  height: 24px;
}

body.mymenu .nav-cmn-global-list-mypage .nav-cmn-global-ico,
body.setting .nav-cmn-global-list-setting .nav-cmn-global-ico {
  background: url(../img/common/mypage.png) no-repeat;
  background-size: 100%;
  width: 32px;
  height: 32px;
}


body.mymenu .nav-cmn-global-list-mypage .ico-cmn-mypage {
  background: url(../img/common/mypage_current.png) no-repeat;
  background-size: 100%;
  width: 32px;
  height: 32px;
}

body.information .nav-cmn-global-list-information .ico-cmn-notice {
  background: url(../img/common/notice_current.png) no-repeat;
  background-size: 100%;
  width: 30px;
  height: 26px;
}

body.help .nav-cmn-global-list-help .ico-cmn-help {
  background: url(../img/common/help_current.png) no-repeat;
  background-size: 100%;
  width: 32px;
  height: 32px;
}

body.is-fixed .nav-cmn-global-wrap {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 13;
  border-bottom: 1px solid #44bac7;
}

/* nav-cmn-local
---------------------------------------------------------- */
.nav-cmn-local {
  margin-bottom: 50px;
}

.contents-main > .nav-cmn-local:first-child {
  margin-top: -20px;
}

.nav-cmn-local-lists {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin: 0 -10px;
}

.nav-cmn-local-list {
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1 1 0%;
  padding: 0 10px;
  text-align: center;
}

.nav-cmn-local-link {
  position: relative;
  display: block;
  padding: 18px 10px 21px;
  height: 100%;
  font-size: 20px;
  font-weight: bold;
  color: #474747;
  background-color: #fff;
  border: 1px solid #e0ded5;
  border-bottom: none;
}

.nav-cmn-local-link:hover {
  opacity: 1;
}

.nav-cmn-local-link:before {
  content: '';
  position: absolute;
  left: -1px;
  bottom: 0;
  display: block;
  width: calc(100% + 2px);
  height: 4px;
  background-color: #e0ded5;
  transition: 0.3s;
}

.nav-cmn-local-list .nav-cmn-local-link:hover,
.nav-cmn-local-list.is-active .nav-cmn-local-link {
  color: #44bac7;
}

.nav-cmn-local-list .nav-cmn-local-link:hover:before,
.nav-cmn-local-list.is-active .nav-cmn-local-link:before {
  background-color: #44bac7;
}

.nav-cmn-local-select {
  display: none;
}

/* nav-cmn-sub
---------------------------------------------------------- */
.nav-cmn-sub {
  margin-bottom: 40px;
  overflow: hidden;
}

.nav-cmn-local + .nav-cmn-sub {
  margin-top: -30px;
}

.nav-cmn-sub-lists {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.nav-cmn-sub-list {
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1 1 0%;
  text-align: center;
  position: relative;
}

.nav-cmn-sub-link {
  display: block;
  padding: 16px 10px 19px;
  height: 100%;
  font-size: 16px;
  font-weight: bold;
  color: #474747;
  background-color: #fff;
  border-left: 1px solid #e0ded5;
  border-top: 1px solid #e0ded5;
}

.nav-cmn-sub-link:hover {
  opacity: 1;
}

.nav-cmn-sub-link:before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: calc(100% + 1px);
  height: 4px;
  background-color: #e0ded5;
  transition: 0.3s;
  z-index: 1;
}

.nav-cmn-sub-list:last-child .nav-cmn-sub-link {
  border-right: 1px solid #e0ded5;
}

.nav-cmn-sub-list .nav-cmn-sub-link:hover,
.nav-cmn-sub-list.is-active .nav-cmn-sub-link {
  color: #44bac7;
}

.nav-cmn-sub-list.is-active .nav-cmn-sub-link:before {
  background-color: #44bac7;
  z-index: 2;
}

.nav-cmn-sub-list.is-disabled .nav-cmn-sub-link {
  color: #999;
  pointer-events: none;
}

/* nav-cmn-pager
---------------------------------------------------------- */
.nav-cmn-pager {
  margin-top: 60px;
  text-align: center;
}

.nav-cmn-pager.uh-pager {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
}

.mod-cmn-select + .nav-cmn-pager {
  margin-top: -30px;
}

.nav-cmn-pager:first-child {
  margin-top: 0;
}

.nav-cmn-pager-item {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 60px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  background-color: #44bac7;
  font-size: 16px;
  color: #fff;
}

.uh-pager .nav-cmn-pager-item {
  display: block;
}

.nav-cmn-pager-item.nav-cmn-pager-only-list {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 60px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  font-family: RobotoSlab Light;
  font-size: 18px;
  color: #fff;
}

.nav-cmn-pager-item:hover {
  opacity: 1;
  background-color: #299eb1;
}

.nav-cmn-pager-item.is-active, .nav-cmn-pager-item.is-active:hover {
  background-color: #1b91a5;
}

.nav-cmn-pager-state {
  display: none;
}

.nav-cmn-pager-state.nav-cmn-pager-only-list  {
  display: none;
}

.nav-cmn-pager-state:hover {
  background-color: #44bac7;
}

.nav-cmn-pager-small .nav-cmn-pager-item {
  width: 45px;
  height: 45px;
  line-height: 45px;
  font-size: 14px;
}

.nav-cmn-pager-prev, .nav-cmn-pager-next, .nav-cmn-pager-prev-one, .nav-cmn-pager-next-one,
.nav-cmn-pager-prev-start, .nav-cmn-pager-prev-one-start, .nav-cmn-pager-next-one-end, .nav-cmn-pager-next-end {
  background-color: #ece8da;
}

.nav-cmn-pager-prev:hover, .nav-cmn-pager-next:hover, .nav-cmn-pager-prev-one:hover, .nav-cmn-pager-next-one:hover {
  background-color: #fff;
}

.nav-cmn-pager-prev-start:hover, .nav-cmn-pager-prev-one-start:hover, .nav-cmn-pager-next-one-end:hover, .nav-cmn-pager-next-end:hover {
  background-color: #ece8da;
}

.nav-cmn-pager-prev:before, .nav-cmn-pager-next:before, .nav-cmn-pager-prev-one:before, .nav-cmn-pager-next-one:before,
.nav-cmn-pager-prev-start:before, .nav-cmn-pager-prev-one-start:before, .nav-cmn-pager-next-one-end:before, .nav-cmn-pager-next-end:before {
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

.nav-cmn-pager-prev, .nav-cmn-pager-prev-start {
  border-radius: 8px 0 0 8px;
}

.nav-cmn-pager-prev:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6018px;
  width: 22px;
  height: 16px;
}

.nav-cmn-pager-prev-one:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6082px;
  width: 12px;
  height: 16px;
}

.nav-cmn-pager-next, .nav-cmn-pager-next-end {
  border-radius: 0 8px 8px 0;
}

.nav-cmn-pager-next:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4868px;
  width: 22px;
  height: 16px;
}

.nav-cmn-pager-next-one:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4932px;
  width: 12px;
  height: 16px;
}

.nav-cmn-pager-disabled {
  cursor: default;
}

.nav-cmn-pager-only-list-txt {
  font-family: RobotoSlab Light;
  font-size: 18px;
}

.nav-cmn-pager-prev-one-start:before {
  background-image: url(../img/common/nav_gray_arrow.png);
  width: 12px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center center;
}

.nav-cmn-pager-prev-start:before {
  background-image: url(../img/common/nav_gray_arrows.png);
  width: 21px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center center;
}

.nav-cmn-pager-next-one-end:before {
  background-image: url(../img/common/nav_gray_arrow.png);
  width: 12px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.nav-cmn-pager-next-end:before {
  background-image: url(../img/common/nav_gray_arrows.png);
  width: 21px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.contents-secondary-message .nav-cmn-pager {
  margin-top: 20px;
  margin-bottom: 40px;
}

.contents-secondary-message .nav-cmn-pager-item {
  display: none;
  width: 45px;
  height: 45px;
  line-height: 45px;
  margin-left: 1px;
}

.contents-secondary-message .nav-cmn-pager-item:last-child {
  margin-right: 1px;
}

.contents-secondary-message .nav-cmn-pager-state {
  display: inline-block;
  width: 136px;
}

.contents-secondary-message .nav-cmn-pager-prev, .contents-secondary-message .nav-cmn-pager-next, .contents-secondary-message .nav-cmn-pager-prev-one, .contents-secondary-message .nav-cmn-pager-next-one {
  display: inline-block;
}

/* nav-cmn-following
---------------------------------------------------------- */
.nav-cmn-following {
  width: 180px;
  position: absolute;
  top: 0;
}

.nav-cmn-following-lists {
  border-radius: 6px;
  overflow: hidden;
}

.nav-cmn-following-list {
  border-top: 1px solid #69c8d2;
}

.nav-cmn-following-link {
  position: relative;
  display: block;
  padding: 9px 16px 9px 47px;
  background-color: #44bac7;
  font-size: 14px;
  color: #fff;
}

.nav-cmn-following-link:hover {
  opacity: 1;
  background-color: #36acbc;
}

.nav-cmn-following-list:last-child .nav-cmn-following-link {
  box-shadow: inset 0px -2px 0px 0px rgba(4, 0, 0, 0.2);
}

.nav-cmn-following-ico {
  position: absolute;
  left: 16px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.nav-cmn-following-ico.ico-cmn-pulldown {
  left: 11px;
}

.nav-cmn-following-preview {
  border-bottom: 1px solid #e0ded5;
  padding-bottom: 40px;
}

/* ==========================================================
 area
========================================================== */
/* area-cmn-head
---------------------------------------------------------- */
.area-cmn-head {
  padding: 30px 0 30px;
  border-bottom: 1px solid #e0ded5;
  background-color: #fff;
}

.contents-title + .area-cmn-head {
  border-top: 1px solid #e0ded5;
}

.area-cmn-head + .contents-main {
  padding-top: 30px;
}

/* area-cmn-message
---------------------------------------------------------- */
.area-cmn-message {
  position: relative;
}

/* area-cmn-bnr
---------------------------------------------------------- */
.area-cmn-bnr {
  margin-top: 80px;
}

.area-cmn-bnr:first-child {
  margin-top: 0;
}

.area-cmn-bnr-item {
  margin-top: 60px;
}

.area-cmn-bnr-item:first-child {
  margin-top: 0;
}

/* area-cmn-aside
---------------------------------------------------------- */
.area-cmn-aside {
  padding-top: 60px;
  padding-bottom: 60px;
  background-color: #faf8f0;
  border-top: 1px solid #dcdcdc;
  text-align: center;
  letter-spacing: -.5em;
}

.area-cmn-aside-bnr {
  display: inline-block;
  margin: 0 20px;
  letter-spacing: normal;
}

/* ==========================================================
 section
========================================================== */
/* ==========================================================
 title
========================================================== */
/* ttl-cmn
---------------------------------------------------------- */
.ttl-cmn:first-child,
.ttl-cmn-01:first-child,
.ttl-cmn-02:first-child,
.ttl-cmn-03:first-child,
.ttl-cmn-04:first-child,
.ttl-cmn-05:first-child,
.ttl-cmn-head:first-child,
.ttl-cmn-detail:first-child,
.ttl-cmn-bold:first-child,
.ttl-cmn-tag:first-child,
.ttl-cmn-message:first-child,
.ttl-cmn-guide:first-child {
  margin-top: 0;
}

.ttl-cmn:last-child,
.ttl-cmn-01:last-child,
.ttl-cmn-02:last-child,
.ttl-cmn-03:last-child,
.ttl-cmn-04:last-child,
.ttl-cmn-05:last-child,
.ttl-cmn-head:last-child,
.ttl-cmn-detail:last-child,
.ttl-cmn-bold:last-child,
.ttl-cmn-tag:last-child,
.ttl-cmn-message:last-child,
.ttl-cmn-guide:last-child {
  margin-bottom: 0;
}

.ttl-cmn + [class]:not(.s-auto),
.ttl-cmn-01 + [class]:not(.s-auto),
.ttl-cmn-02 + [class]:not(.s-auto),
.ttl-cmn-03 + [class]:not(.s-auto),
.ttl-cmn-04 + [class]:not(.s-auto),
.ttl-cmn-05 + [class]:not(.s-auto),
.work-ttl-div + [class]:not(.s-auto),
.ttl-cmn-head + [class]:not(.s-auto),
.ttl-cmn-detail + [class]:not(.s-auto),
.ttl-cmn-bold + [class]:not(.s-auto),
.ttl-cmn-tag + [class]:not(.s-auto),
.ttl-cmn-message + [class]:not(.s-auto),
.ttl-cmn-guide + [class]:not(.s-auto) {
  margin-top: 0;
}

/* ttl-cmn-01
---------------------------------------------------------- */
.ttl-cmn-01 {
  text-align: center;
  margin-top: 40px;
  margin-bottom: 40px;
  line-height: 1.75;
  font-size: 26px;
  font-weight: bold;
}

section:not(:first-child) > .ttl-cmn-01:first-child {
  margin-top: 40px;
}

/* ttl-cmn-02
---------------------------------------------------------- */
.ttl-cmn-02 {
  margin-top: 40px;
  margin-bottom: 40px;
  line-height: 1.75;
  font-size: 26px;
  font-weight: bold;
  color: #44bac7;
  text-align: center;
  /* type */
}

section:not(:first-child) > .ttl-cmn-02:first-child {
  margin-top: 40px;
}

.ttl-cmn-02-a {
  margin-top: 60px;
  margin-bottom: 20px;
  text-align: left;
  font-size: 24px;
}

section:not(:first-child) > .ttl-cmn-02-a:first-child {
  margin-top: 60px;
}

/* ttl-cmn-03
---------------------------------------------------------- */
.ttl-cmn-03 {
  margin-top: 47px;
  margin-bottom: 47px;
  line-height: 1.5;
  font-size: 20px;
  font-weight: bold;
}

/* ttl-cmn-04
---------------------------------------------------------- */
.ttl-cmn-04 {
  margin-top: 60px;
  margin-bottom: 60px;
  border-bottom: 1px solid #44bac7;
  padding-bottom: 15px;
  line-height: 1.5;
  font-size: 20px;
  font-weight: bold;
  /* type */
}

.ttl-cmn-04-in {
  display: inline-block;
  position: relative;
  padding-left: 20px;
}

.ttl-cmn-04-in:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 5px;
  height: 100%;
  background-color: #44bac7;
  border-radius: 6px;
}

section:not(:first-child) > .ttl-cmn-04:first-child {
  margin-top: 60px;
}

.ttl-cmn-04-a {
  margin-bottom: 20px;
}

.ttl-cmn-04-b {
  margin-bottom: 20px;
  border-bottom: none;
  padding-bottom: 0;
}

.ttl-cmn-04-c {
  margin-bottom: 20px;
}

.ttl-cmn-04-cate {
  margin-bottom: 5px;
}

.ttl-cmn-04-cate .ttl-cmn-04-in {
  padding-left: 15px;
}

/* ttl-cmn-05
---------------------------------------------------------- */
.ttl-cmn-05 {
  margin-top: 30px;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: bold;
  color: #44bac7;
}

/* ttl-cmn-head
---------------------------------------------------------- */
.ttl-cmn-head {
  padding: 0 200px;
  text-align: center;
  font-size: 32px;
  font-weight: bold;
}

.ttl-cmn-head:only-child {
  padding: 0;
}

/* ttl-cmn-detail
---------------------------------------------------------- */
.ttl-cmn-detail {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 26px;
  font-weight: bold;
}

/* ttl-cmn-mark
---------------------------------------------------------- */
.ttl-cmn-mark {
  position: relative;
  padding-left: 56px;
  font-size: 26px;
  font-weight: bold;
}

.ttl-cmn-mark-ico {
  position: absolute;
  left: 6px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.ttl-cmn-mark-a {
  padding-left: 76px;
  font-size: 26px;
}

.ttl-cmn-mark-a .ttl-cmn-mark-ico {
  left: 0;
}

/* ttl-cmn-bold
---------------------------------------------------------- */
.ttl-cmn-bold {
  margin-top: 20px;
  line-height: 1.75;
  font-weight: bold;
}

/* ttl-cmn-order
---------------------------------------------------------- */
.ttl-cmn-order {
  position: relative;
  margin-top: 70px;
  margin-bottom: 20px;
  min-height: 34px;
  font-size: 20px;
  font-weight: bold;
}

.ttl-cmn-order:first-child {
  margin-top: 0;
}

.ttl-cmn-order-wrap .ttl-cmn-order {
  float: left;
  margin-top: 0;
  margin-bottom: 0;
}

.ttl-cmn-order-wrap {
  position: relative;
  margin-top: 50px;
  margin-bottom: 30px;
  overflow: hidden;
}

.ttl-cmn-order-wrap .mod-cmn-required {
  position: absolute;
  right: 0;
  top: 5px;
}
.mod-cmn-required + .ttl-cmn-order {
  padding-right: 70px;
}

.ttl-cmn-order-wrap:first-child {
  margin-top: 0;
}

.ttl-cmn-order-mark {
  display: block;
  float: left;
  display: inline-block;
  min-width: 70px;
  padding: 0 20px;
  height: 34px;
  line-height: 34px;
  margin-right: 18px;
  background-color: #44bac7;
  border-radius: 20px;
  color: #fff;
  text-align: center;
  font-size: 18px;
  font-weight: normal;
}

.ttl-cmn-order-mark-num {
  font-size: 20px;
}

.ttl-cmn-order-txt {
  display: block;
  overflow: hidden;
  padding-top: 2px;
}

.ttl-cmn-order-txt-strong {
  padding-top: 0;
  font-size: 24px;
  color: #44bac7;
}

.ttl-cmn-order-caption {
  float: right;
  padding-top: 6px;
  margin-left: 10px;
  font-size: 16px;
  font-weight: bold;
  color: #44bac7;
}

section:not(:first-child) > .ttl-cmn-order:first-child,
section:not(:first-child) > .ttl-cmn-order-wrap:first-child {
  margin-top: 70px;
}

/* ttl-cmn-tag
---------------------------------------------------------- */
.ttl-cmn-tag {
  display: block;
  margin-top: 30px;
  padding: 8px 15px;
  border-radius: 6px;
  background-color: #e0ded5;
}

.ttl-cmn-tag:first-child {
  margin-top: 0;
}

.ttl-cmn-tag + .table-cmn-form > .table-cmn-form-row:first-child > .table-cmn-form-cell {
  border-top: none;
}

section:not(:first-child) > .ttl-cmn-tag:first-child {
  margin-top: 30px;
}

/* ttl-cmn-complete
---------------------------------------------------------- */
.ttl-cmn-complete {
  margin-bottom: 50px;
  text-align: center;
  font-size: 36px;
  font-weight: bold;
  color: #44bac7;
}

/* ttl-cmn-separation
---------------------------------------------------------- */
.ttl-cmn-separation {
  position: relative;
  padding: 29px 0;
  margin: 70px 0 66px;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
}

.ttl-cmn-separation:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 500%;
  height: 100%;
  margin-left: -250%;
  background-color: #e0ded5;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  z-index: 1;
}

.ttl-cmn-separation-in {
  position: relative;
  font-size: 24px;
  font-weight: bold;
  z-index: 2;
}

/* ttl-cmn-message
---------------------------------------------------------- */
.ttl-cmn-message {
  text-align: center;
  margin-bottom: 26px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e0ded5;
  font-size: 18px;
  font-weight: bold;
}

/* ttl-cmn-guide
---------------------------------------------------------- */
.ttl-cmn-guide {
  margin-top: 60px;
  margin-bottom: 40px;
  padding: 15px 24px;
  border-radius: 6px;
  background-color: #474747;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
}

/* ==========================================================
 link
========================================================== */
/* link-cmn-arrow
---------------------------------------------------------- */
.link-cmn-arrow-left,
.link-cmn-arrow-right,
.link-cmn-arrow-top,
.link-cmn-arrow-bottom,
.link-cmn-toggle {
  position: relative;
  display: inline-block;
  padding-left: 16px;
}

.link-cmn-arrow-left:before,
.link-cmn-arrow-right:before,
.link-cmn-arrow-top:before,
.link-cmn-arrow-bottom:before,
.link-cmn-toggle:before {
  content: '';
  position: absolute;
  left: 0;
  top: .5em;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4.5px 0 4.5px 6px;
  border-color: transparent transparent transparent #1e97cd;
}

/* link-cmn-arrow-left
---------------------------------------------------------- */
.link-cmn-arrow-left:before {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

/* link-cmn-arrow-top
---------------------------------------------------------- */
.link-cmn-arrow-top {
  padding-left: 22px;
}

.link-cmn-arrow-top:before {
  top: .2em;
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 0 7px 10px;
  border-color: transparent transparent transparent #1e97cd;
}

/* link-cmn-arrow-bottom
---------------------------------------------------------- */
.link-cmn-arrow-bottom {
  padding-left: 22px;
}

.link-cmn-arrow-bottom:before {
  top: .2em;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 0 7px 10px;
  border-color: transparent transparent transparent #1e97cd;
}

/* link-cmn-toggle
---------------------------------------------------------- */
.link-cmn-toggle:before {
  top: .55em;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4.5px 0 4.5px 6px;
  border-color: transparent transparent transparent #1e97cd;
}

.link-cmn-toggle.is-active:before {
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg);
}

/* link-cmn-close
---------------------------------------------------------- */
.link-cmn-close {
  position: relative;
  display: inline-block;
  padding-left: 30px;
}

.link-cmn-close-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

/* link-cmn-cancel
---------------------------------------------------------- */
.link-cmn-cancel {
  position: relative;
  display: inline-block;
  padding-left: 20px;
}

.link-cmn-cancel-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

/* ==========================================================
 list
========================================================== */
/* list-cmn-terms
---------------------------------------------------------- */
.list-cmn-terms {
  letter-spacing: -.5em;
  font-size: 14px;
  padding-right: 36px;
}

.list-cmn-terms-item {
  display: inline-block;
  letter-spacing: normal;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/* list-cmn-form
---------------------------------------------------------- */
.list-cmn-form {
  margin-top: 25px;
  margin-bottom: -12px;
  letter-spacing: -.5em;
}

.list-cmn-form-mb-none,
.table-cmn-form-row:first-child .list-cmn-form {
  margin-top: 0;
  margin-bottom: -12px;
}

.list-cmn-form-item {
  display: inline-block;
  width: 100px;
  padding-right: 10px;
  margin-bottom: 12px;
  letter-spacing: normal;
  vertical-align: top;
}

.list-cmn-form-item.s-width-full {
  padding-right: 0;
}

/* list-cmn-notes
---------------------------------------------------------- */
.list-cmn-notes {
  margin-top: 8px;
  line-height: 1.75;
}

.list-cmn-notes:first-child {
  margin-top: 0;
}

.required-prf-info ul.list-cmn-notes {
  margin-top: 30px;
  font-size: 14px;
}

.list-cmn-notes-item {
  text-indent: -1em;
  margin-left: 1em;
  margin-top: 6px;
}

.list-cmn-notes-item:first-child {
  margin-top: 0;
}

.registration-mail-magazine li.list-cmn-notes-item {
  font-size: 12px;
}

/* list-cmn-dot
---------------------------------------------------------- */
.list-cmn-dot {
  line-height: 1.75;
}

.list-cmn-dot-item {
  position: relative;
  padding-left: 14px;
  margin-top: 12px;
}
.list-cmn-dot-item-cate {
  position: relative;
  padding-left: 21px;
  margin-top: 12px;
}

.list-cmn-dot-item:first-child {
  margin-top: 0;
}
.list-cmn-dot-item-cate:first-child {
  margin-top: 0;
}

.list-cmn-dot-item:before {
  content: '';
  display: block;
  position: absolute;
  left: 0.25em;
  top: 0.75em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #44bac7;
}
.list-cmn-dot-item-cate:before {
  content: '';
  display: block;
  position: absolute;
  left: 0.75em;
  top: 0.75em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #44bac7;
}

.list-cmn-dot-child {
  margin-top: 6px;
}

.list-cmn-dot-child-item {
  position: relative;
  padding-left: 1em;
  margin-top: 6px;
}

.list-cmn-dot-child-item:first-child {
  margin-top: 0;
}

.list-cmn-dot-child-item:before {
  content: "└";
  position: absolute;
  left: -.2em;
  top: 0;
  color: #44bac7;
}

.list-cmn-dot a {
  text-decoration: underline;
}

/* list-cmn-order
---------------------------------------------------------- */
.list-cmn-order {
  line-height: 1.75;
}

.list-cmn-order-item {
  position: relative;
  padding-left: 30px;
  margin-top: 6px;
}

.list-cmn-order-item:first-child {
  margin-top: 0;
}

.list-cmn-order-num {
  position: absolute;
  left: 0;
  top: 0;
}

/* list-cmn-status
---------------------------------------------------------- */
.list-cmn-status {
  margin-top: 30px;
  overflow: hidden;
}

.list-cmn-status:first-child {
  margin-top: 0;
}

.list-cmn-status-ttl {
  float: left;
  margin-left: 40px;
  font-weight: bold;
  color: #999;
}

.list-cmn-status-ttl:first-child {
  margin-left: 0;
}

.list-cmn-status-ttl:after {
  content: '-';
  margin: 0 6px;
}

.list-cmn-status-txt {
  float: left;
}

/* list-cmn-definition
---------------------------------------------------------- */
.list-cmn-definition {
  margin-bottom: 30px;
}

.list-cmn-definition:last-child {
  margin-bottom: 0;
}

.list-cmn-definition-ttl {
  float: left;
  width: 120px;
  padding-right: 10px;
  font-weight: bold;
  color: #44bac7;
}

.list-cmn-definition-txt {
  margin-bottom: 20px;
  overflow: hidden;
}

.list-cmn-definition-txt:last-child {
  margin-bottom: 0;
}

/* ==========================================================
 table
========================================================== */
/* table-cmn
---------------------------------------------------------- */
.table-cmn {
  margin-top: 20px;
  width: 100%;
  display: table;
}

.table-cmn:first-child {
  margin-top: 0;
}

.table-cmn-fixed {
  table-layout: fixed;
}

.table-cmn-row {
  display: table-row;
}

.table-cmn-cell {
  display: table-cell;
  vertical-align: middle;
  padding: 12px 20px;
  border-bottom: 1px solid #e0ded5;
}

.table-cmn-cell-w-01 {
  width: 19%;
}

/* table-cmn-form
---------------------------------------------------------- */
.table-cmn-form {
  display: table;
  width: 100%;
  line-height: 1.75;
  margin-top: 20px;
}

.table-cmn-form:first-child {
  margin-top: 0;
}

.table-cmn-form-row {
  display: table-row;
}

.table-cmn-form-row:first-child {
  margin-top: 0;
}

.table-cmn-form-row:last-child .table-cmn-form-cell {
  padding-bottom: 0;
}

.registration-category .table-cmn-form-row:last-child .table-cmn-form-cell,
.required-agreement .table-cmn-form-row:last-child .table-cmn-form-cell {
  padding-bottom: 15px;
}

.table-cmn-form-row:last-child .table-cmn-form-cell-border {
  padding-bottom: 15px;
}

.table-cmn-form-cell {
  display: table-cell;
  padding-top: 15px;
  padding-bottom: 15px;
  /* border */
}

.table-cmn-form-cell-in {
  padding-top: 15px;
  padding-bottom: 15px;
  border-top: 1px solid #e0ded5;
}

.table-cmn-form-cell-in:first-child {
  padding-top: 0;
  border-top: none;
}

.table-cmn-form-cell-in:last-child {
  padding-bottom: 0;
}

.table-cmn-form-cell-in-ttl {
  display: table-cell;
  width: 100px;
  padding-right: 4px;
  font-weight: bold;
}

.table-cmn-form-cell-in-ttl-edit {
  width: 138px;
}

.wid-plus .table-cmn-form-cell-in-ttl {
  width: 154px;
}

.table-cmn-form-cell-in-detail {
  display: table-cell;
}

.table-cmn-form-cell-border {
  border-bottom: 1px solid #e0ded5;
}

.table-cmn-form-row:first-child > .table-cmn-form-cell-border,
.first-item-border .table-cmn-form-cell-border {
  border-top: 1px solid #e0ded5;
}

.first-item-border-top .table-cmn-form-cell-border {
  border-top: 1px solid #e0ded5;
  border-bottom: 0px;
}

.table-cmn-form-cell-mark-wrap-client {
  position: relative;
  padding-right: 90px;
}

.table-cmn-form-cell-mark-wrap-worker {
  position: relative;
  padding-right: 78px;
}

.table-cmn-form-cell-mark-wrap-worker .form-cmn-mark {
  position: absolute;
  right: 30px;
  top: 0;
}

.table-cmn-form-cell-mark-wrap-client .form-cmn-mark {
  position: absolute;
  right: 40px;
  top: 0;
}

.table-cmn-form-ttl {
  width: 200px;
  padding-right: 20px;
  font-weight: bold;
}

.registration-category .table-cmn-form-cell.table-cmn-form-ttl {
  padding-right: 15px;
}

.required-prf-info .table-cmn-form-cell.table-cmn-form-ttl {
  padding-right: 25px;
}

.table-cmn-form-ttl-sub {
  line-height: 1.3;
  vertical-align: middle;
}

.table-cmn-form-ttl-item {
  display: table-cell;
  vertical-align: baseline;
}

.table-cmn-form-ttl-item:first-child {
  padding-right: 10px;
}

.registration-category .table-cmn-form-ttl-item:first-child {
  margin-right: 10px;
  width: 70%;
}

.table-cmn-form-ttl-wide {
  width: 300px;
}

.table-cmn-form-ttl-wide2 {
  width: 212px;
}

.table-cmn-form .form-cmn-check-single-top + label:before {
  top: 4px;
}

.table-cmn-form .form-cmn-check-single-top[type="radio"] + label:after {
  top: 7px;
}

.table-cmn-form .form-cmn-check-single-top[type="checkbox"] + label:after {
  top: 9px;
}

/* narrorws pattern */
.table-cmn-form-row[data-pattern] {
  display: none;
}

.table-cmn-form-row[data-pattern].is-active {
  display: table-row;
}

.table-cmn-form-row[data-pattern-hide] {
  display: table-row;
}

.table-cmn-form-row[data-pattern-hide].is-active {
  display: none;
}

.table-cmn-form-row.required-prf-info {
  display:inline-block;
  margin-top: 56px;
}

.table-cmn-form-row.registration-terms {
  display: inline-block;
}

.registration-terms .table-cmn-form-cell.table-cmn-form-detail {
  line-height: 1.75;
}

.table-cmn-form-detail-text {
  overflow-wrap: anywhere;
}

/* table-cmn-stripe
---------------------------------------------------------- */
.table-cmn-stripe {
  display: table;
  width: 100%;
  border-bottom: 1px solid #e0ded5;
  font-size: 14px;
  margin-top: 20px;
}

.table-cmn-stripe:first-child {
  margin-top: 0;
}

.table-cmn-stripe-head {
  display: table-header-group;
}

.table-cmn-stripe-head .table-cmn-stripe-row:nth-child(2n+1) .table-cmn-stripe-cell {
  background-color: #44bac7;
  color: #fff;
  text-align: center;
}

.table-cmn-stripe-head .table-cmn-stripe-ttl {
  font-weight: bold;
  color: #fff;
}

.table-cmn-stripe-head .table-cmn-stripe-ttl .form-cmn-check-single + label {
  color: #fff;
}

.table-cmn-stripe-head .table-cmn-stripe-cell {
  padding: 28px 0;
}

.table-cmn-stripe-body {
  display: table-row-group;
}

.table-cmn-stripe-body .table-cmn-stripe-cell {
  padding: 25px 20px 24px;
}

.table-cmn-stripe-body .table-cmn-stripe-cell-full {
  padding-left: 0;
  padding-right: 0;
}

.table-cmn-stripe-row {
  display: table-row;
}

.table-cmn-stripe-cell {
  display: table-cell;
  vertical-align: middle;
  background-color: #faf8f0;
}

.table-cmn-stripe-row:nth-child(2n+1) .table-cmn-stripe-cell {
  background-color: #fff;
}

.table-cmn-stripe-ttl-in {
  padding: 0 20px;
  border-left: 1px solid #b4e3e9;
  line-height: 1.05;
}

.table-cmn-stripe-ttl-in.js-mach {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.table-cmn-stripe-cell:first-child .table-cmn-stripe-ttl-in {
  border-left: none;
}

.table-cmn-stripe-mark {
  position: relative;
  padding-right: 23px;
}

.table-cmn-stripe-ico {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

/* table-cmn-colspan
---------------------------------------------------------- */
.table-cmn-colspan {
  position: relative;
}

.table-cmn-colspan-in {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  white-space: nowrap;
  height: calc(1em*1.5);
}

/* table-cmn-work
---------------------------------------------------------- */
.table-cmn-work {
  display: table;
  width: 100%;
  border-top: 1px solid #e0ded5;
  margin-top: 30px;
}

.table-cmn-work:first-child {
  margin-top: 0;
}

.table-cmn-work-row {
  display: table-row;
}

.table-cmn-work-cell {
  display: table-cell;
  padding: 15px 0;
  border-bottom: 1px solid #e0ded5;
}

.table-cmn-work-ttl {
  width: 200px;
  padding-right: 10px;
  font-weight: bold;
  color: #44bac7;
}

/* ==========================================================
 button
========================================================== */
/* btn-cmn
---------------------------------------------------------- */
.btn-cmn {
  display: inline-block;
  width: 360px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  outline: none;
  letter-spacing: normal;
  margin-left: 40px;
  margin-bottom: -4px;
  vertical-align: middle;
  transition: 0.1s;
  /*transform*/
}

.btn-cmn:first-child {
  margin-left: 0;
}

.btn-cmn.btn-cmn-small.extens-explain {
  margin-left:40px;
}

.btn-cmn.is-disabled:not(.tentame_answered_btn) {
  pointer-events: none;
}

.btn-cmn:hover {
  opacity: 1;
}

.btn-cmn-in {
  position: relative;
  display: block;
  padding: 12px 25px;
  margin-top: 0;
  margin-bottom: 4px;
  background-color: #44bac7;
  border-radius: 8px;
  box-shadow: 0px 4px 0px 0px #37959f;
  color: #fff;
}

.btn-cmn:hover:not(:disabled,.tentame_answered_btn,.footer-lp-btn) .btn-cmn-in {
  margin-top: 2px;
  margin-bottom: 2px;
  background-color: #3da7b3;
  box-shadow: 0px 1px 0px 0px #37959f;
  opacity: 1;
}

.btn-cmn:hover:not(:disabled) .icon-play {
  opacity: 0.6;
}

.btn-cmn-in.pressing_down {
  margin-top: 2px;
  margin-bottom: 2px;
  background-color: #3da7b3;
  box-shadow: 0px 1px 0px 0px #37959f;
  opacity: 1;
}

.btn-cmn-ico {
  margin-right: 10px;
}

.btn-cmn .btn-cmn-ico-toggle {
  display: none;
}

.btn-cmn.is-active .btn-cmn-ico-toggle {
  display: inline-block;
}

.btn-cmn-txt {
  display: inline-block;
  vertical-align: middle;
}

.btn-cmn-err-txt {
  color: #F00;
}

.btn-cmn-inline {
  display: inline-block;
  width: auto;
}

.btn-cmn-transform {
  width: 220px;
  font-size: 16px;
}

.btn-cmn-transform-txt {
  font-size: 10px;
  font-weight: normal;
}

.btn-cmn-transform .btn-cmn-in {
  padding: 7px 10px;
}

.btn-cmn.js-identity-verification-update {
  cursor: pointer;
}

/* btn-cmn-close
---------------------------------------------------------- */
.btn-cmn-close, .btn-cmn-close-small {
  display: block;
  position: relative;
  width: 36px;
  height: 36px;
  background-color: #808080;
  box-shadow: inset 0px -4px 0px 0px rgba(4, 0, 0, 0.2);
  border-radius: 50%;
}

.btn-cmn-close:hover, .btn-cmn-close-small:hover {
  background-color: #666;
  box-shadow: inset 0px -1px 0px 0px rgba(4, 0, 0, 0.2);
  opacity: 1;
}

.btn-cmn-close:before, .btn-cmn-close-small:before {
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  background-image: url(../img/common/sprite.png);
  background-position: 0px -674px;
  width: 14px;
  height: 14px;
}

.btn-cmn-close-small {
  width: 24px;
  height: 24px;
  box-shadow: inset 0px -2px 0px 0px rgba(4, 0, 0, 0.2);
}

.btn-cmn-close-small:hover {
  box-shadow: inset 0px -1px 0px 0px rgba(4, 0, 0, 0.2);
}

.btn-cmn-close-small:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -794px;
  width: 10px;
  height: 10px;
}

/* btn-cmn-sub
---------------------------------------------------------- */
.btn-cmn-sub {
  display: block;
  min-width: 120px;
  padding: 11px 10px;
  min-height: 50px;
  border-radius: 8px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  background-color: #fff;
  border: 2px solid #44bac7;
  box-shadow: inset 0px -2px 0 0 #e0e0e0;
  color: #44bac7;
}

.btn-cmn-sub:hover {
  background-color: #faf8f0;
  box-shadow: inset 0px -2px 0 0 #dcdad3;
  color: #128e9c;
  opacity: 1;
}

/* btn-cmn-simple
---------------------------------------------------------- */
.btn-cmn-simple {
  position: relative;
  display: inline-block;
  width: 100%;
  padding: 5px 9px;
  border: 1px solid #e0ded5;
  border-radius: 6px;
  background-color: #fff;
  word-break: break-all;
  text-align: center;
  color: #474747;
}

.btn-cmn-simple:hover {
  background-color: #ece8da;
  opacity: 1;
}

.btn-cmn-simple-left {
  text-align: left;
  padding-left: 35px;
}

.btn-cmn-simple-left .btn-cmn-simple-ico {
  position: absolute;
  left: 10px;
  top: 9px;
}

/* btn-cmn-color
---------------------------------------------------------- */
.btn-cmn-yellow .btn-cmn-in {
  box-shadow: 0px 4px 0px 0px #cdaa00;
  background-color: #ffd500;
  color: #474747;
}

.btn-cmn-yellow:hover:not(:disabled) .btn-cmn-in {
  box-shadow: 0px 1px 0px 0px #cdaa00;
  background-color: #ffcd00;
  color: #796a3c;
}
.btn-cmn-yellow2 .btn-cmn-in {
  display: block;
  min-width: 120px;
  padding: 15px 10px 11px;
  min-height: 50px;
  border-radius: 8px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  box-shadow: 0px 4px 0px 0px #cdaa00;
  background-color: #ffd500;
  color: #474747;
}

.btn-cmn-yellow2:hover:not(:disabled) .btn-cmn-in {
  margin-top: 2px;
  margin-bottom: 2px;
  box-shadow: 0px 1px 0px 0px #cdaa00;
  background-color: #ffcd00;
  color: #796a3c;
}

.btn-cmn-white .btn-cmn-in {
  box-shadow: 0px 3px 0px 0px rgba(4, 0, 0, 0.2);
  border: 1px solid #e0ded5;
  background-color: #fff;
  color: #474747;
}

.btn-cmn-white:hover:not(:disabled) .btn-cmn-in {
  box-shadow: none;
  background-color: #fff;
  color: #474747;
  opacity: 0.8;
}

.btn-cmn-gray .btn-cmn-in {
  box-shadow: 0px 4px 0px 0px #717070;
  background-color: #808080;
  color: #fff;
}

.btn-cmn-gray:hover:not(:disabled) .btn-cmn-in {
  box-shadow: 0px 1px 0px 0px #717070;
  background-color: #666;
  color: #fff;
}

.btn-cmn.is-disabled .btn-cmn-in,
.btn-cmn:disabled .btn-cmn-in {
  box-shadow: 0px 4px 0px 0px #808080;
  background-color: #808080;
  color: #d8d8d8;
}

.btn-cmn-pink .btn-cmn-in {
  box-shadow: 0px 4px 0px 0px #cd484c;
  background-color: #ff5a5f;
  color: #fff;
}

.btn-cmn-pink:hover:not(:disabled) .btn-cmn-in {
  box-shadow: 0px 1px 0px 0px #cd484c;
  background-color: #ff484c;
  color: #fff;
}
.btn-cmn-pink2 .btn-cmn-in {
  display: block;
  min-width: 120px;
  padding: 15px 10px 11px;
  min-height: 50px;
  border-radius: 8px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  box-shadow: 0px 4px 0px 0px #cd484c;
  background-color: #ff5a5f;
  color: #fff;
}

.btn-cmn-pink2:hover:not(:disabled) .btn-cmn-in {
  margin-top: 2px;
  margin-bottom: 2px;
  box-shadow: 0px 1px 0px 0px #cd484c;
  background-color: #ff484c;
  color: #fff;
}

.btn-cmn-yellow2 .btn-cmn-in-use-dpoint {
  padding-top: 10px;
  padding-bottom: 8px;
  min-height: 30px;
}

/* btn size
---------------------------------------------------------- */
.btn-cmn-space .btn-cmn-in {
  padding-left: 14px;
  padding-right: 14px;
}

.btn-cmn-low .btn-cmn-in,
.btn-cmn-small .btn-cmn-in,
.btn-cmn-mini .btn-cmn-in,
.btn-cmn-middle .btn-cmn-in,
.btn-cmn-header .btn-cmn-in,
.btn-cmn-narrow .btn-cmn-in,
.btn-cmn-thick .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px #37959f;
}

.btn-cmn-low.btn-cmn-yellow .btn-cmn-in,
.btn-cmn-small.btn-cmn-yellow .btn-cmn-in,
.btn-cmn-mini.btn-cmn-yellow .btn-cmn-in,
.btn-cmn-middle.btn-cmn-yellow .btn-cmn-in,
.btn-cmn-header.btn-cmn-yellow .btn-cmn-in,
.btn-cmn-narrow.btn-cmn-yellow .btn-cmn-in,
.btn-cmn-thick.btn-cmn-yellow .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px #cdaa00;
}

.btn-cmn-low.btn-cmn-white .btn-cmn-in,
.btn-cmn-small.btn-cmn-white .btn-cmn-in,
.btn-cmn-mini.btn-cmn-white .btn-cmn-in,
.btn-cmn-middle.btn-cmn-white .btn-cmn-in,
.btn-cmn-header.btn-cmn-white .btn-cmn-in,
.btn-cmn-narrow.btn-cmn-white .btn-cmn-in,
.btn-cmn-thick.btn-cmn-white .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px rgba(4, 0, 0, 0.2);
}

.btn-cmn-low.btn-cmn-gray .btn-cmn-in,
.btn-cmn-small.btn-cmn-gray .btn-cmn-in,
.btn-cmn-mini.btn-cmn-gray .btn-cmn-in,
.btn-cmn-middle.btn-cmn-gray .btn-cmn-in,
.btn-cmn-header.btn-cmn-gray .btn-cmn-in,
.btn-cmn-narrow.btn-cmn-gray .btn-cmn-in,
.btn-cmn-thick.btn-cmn-gray .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px #808080;
}

.btn-cmn-low.is-disabled .btn-cmn-in,
.btn-cmn-low:disabled .btn-cmn-in,
.btn-cmn-small.is-disabled .btn-cmn-in,
.btn-cmn-small:disabled .btn-cmn-in,
.btn-cmn-mini.is-disabled .btn-cmn-in,
.btn-cmn-mini:disabled .btn-cmn-in,
.btn-cmn-middle.is-disabled .btn-cmn-in,
.btn-cmn-middle:disabled .btn-cmn-in,
.btn-cmn-header.is-disabled .btn-cmn-in,
.btn-cmn-header:disabled .btn-cmn-in,
.btn-cmn-narrow.is-disabled .btn-cmn-in,
.btn-cmn-narrow:disabled .btn-cmn-in,
.btn-cmn-thick.is-disabled .btn-cmn-in,
.btn-cmn-thick:disabled .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px #808080;
}

.btn-cmn-low.btn-cmn-pink .btn-cmn-in,
.btn-cmn-small.btn-cmn-pink .btn-cmn-in,
.btn-cmn-mini.btn-cmn-pink .btn-cmn-in,
.btn-cmn-middle.btn-cmn-pink .btn-cmn-in,
.btn-cmn-header.btn-cmn-pink .btn-cmn-in,
.btn-cmn-narrow.btn-cmn-pink .btn-cmn-in,
.btn-cmn-thick.btn-cmn-pink .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px #cd484c;
}

.btn-cmn-low:hover:not(:disabled) .btn-cmn-in,
.btn-cmn-small:hover:not(:disabled) .btn-cmn-in,
.btn-cmn-mini:hover:not(:disabled) .btn-cmn-in,
.btn-cmn-middle:hover:not(:disabled) .btn-cmn-in,
.btn-cmn-header:hover:not(:disabled) .btn-cmn-in,
.btn-cmn-narrow:hover:not(:disabled) .btn-cmn-in,
.btn-cmn-thick:hover:not(:disabled) .btn-cmn-in {
  box-shadow: none;
}

.btn-cmn-low {
  width: auto;
  font-size: 16px;
}

.btn-cmn-low .btn-cmn-in {
  padding: 5px;
}

.btn-cmn-small {
  width: auto;
  font-size: 14px;
}

.btn-cmn-small .btn-cmn-in {
  padding-top: 7px;
  padding-bottom: 7px;
}

.btn-cmn-mini {
  font-size: 12px;
}

.btn-cmn-mini .btn-cmn-in {
  padding-top: 2px;
  padding-bottom: 2px;
}

.btn-cmn-middle .btn-cmn-in {
  padding-top: 8px;
  padding-bottom: 8px;
}

.btn-cmn-header .btn-cmn-in {
  padding-top: 7px;
  padding-bottom: 7px;
}

.btn-cmn-narrow .btn-cmn-in {
  font-size: 14px;
  padding-top: 7px;
  padding-bottom: 7px;
}

.btn-cmn-thick {
  height: 50px;
  font-size: 14px;
}

.btn-cmn-thick .btn-cmn-in {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  padding: 7px 10px;
}

/* btn-cmn-mfp-close
---------------------------------------------------------- */
.btn-cmn-mfp-close {
  width: 36px;
  height: 36px;
  text-decoration: none;
  text-align: center;
  background-color: #44bac7;
  box-shadow: inset 0px -2px 0px 0px rgba(4, 0, 0, 0.2);
  border-radius: 50%;
  overflow: visible;
  cursor: pointer;
  border: 0;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
}

.btn-cmn-mfp-close:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  display: block;
  background-image: url("../img/common/sprite.png");
  background-position: 0px -317px;
  width: 15px;
  height: 15px;
  background-size: 140px 5255px;
}

.btn-cmn-mfp-close:hover {
  background-color: #3da7b3;
  box-shadow: inset 0px -1px 0px 0px rgba(4, 0, 0, 0.2);
  opacity: 1;
}

/* btn-cmn-awareness
---------------------------------------------------------- */
.btn-cmn-awareness-txt {
  font-size: 13px;
}

/* ==========================================================
 box
========================================================== */
/* box-cmn-card
---------------------------------------------------------- */
.box-cmn-card {
  position: relative;
}

.box-cmn-card-in {
  display: block;
  padding: 26px 39px;
  border-radius: 8px;
  background-color: #fff;
  border: solid 1px #dcdcdc;
}

.box-cmn-card-in-attention {
  border-left: solid 10px #FF5B5E;
}

.box-cmn-card-in-attention:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10px;
  border-radius: 0 0 0 8px;
  border-bottom: solid 10px #FF5B5E;
}

.card-label .box-cmn-card-in {
  padding: 30px 40px 40px 30px;
}

.box-cmn-card-in:hover {
  opacity: 1;
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.2);
}

.box-cmn-card-in:hover .box-cmn-card-ttl {
  color: #1e97cd;
}

.card-label .box-cmn-card-in-strong {
  padding-top: 0;
  border-color: #ffb237;
}

.card-label .box-cmn-card-in-keep {
  padding-top: 0;
  border-color: #ece8da;
  padding-bottom: 20px;

}

.box-cmn-card-head {
  text-align: center;
  margin: 0 -40px 39px -30px;
  padding: 8px 39px;
  border-radius: 6px 6px 0 0;
}

.box-cmn-card-in-strong .box-cmn-card-head {
  background-color: #ffb237;
  color: #fff;
}

.box-cmn-card-in-keep .box-cmn-card-head {
  background-color: #ece8da;
  color: #44bac7;
  margin-bottom: 0px;
  text-align: left;
  font-weight: bold;
}

.box-cmn-card-in-strong + .box-cmn-card-ico {
  top: 70px;
}

.box-cmn-card-body {
  margin-top: 20px;
  margin-bottom: 3px;
  overflow: hidden;
}

.box-cmn-card-ttl {
  color: #474747;
  font-size: 28px;
  transition: 0.3s;
  font-weight: bold;
}

.box-cmn-card-ttl-search {
  color: #474747;
  font-size: 16px;
  transition: 0.3s;
  font-weight: bold;
  padding-right: 18px;
}

.box-cmn-card-lists {
  margin-top: 13px;
}

.box-cmn-card-list {
  color: #999;
  font-size: 16px;
}

.box-cmn-card-foot {
  overflow: hidden;
}

.box-cmn-card-indication {
  float: left;
  margin-right: 10px;
  padding-top: 10px;
  font-size: 20px;
  color: #999;
}

.box-cmn-card-indication-num {
  font-size: 20px;
}

.box-cmn-card-limit {
  float: left;
  margin-right: 10px;
}

.box-cmn-card-status {
  float: right;
  color: #999;
  line-height: 1.05;
  font-size: 20px;
  margin-top: 10px;
}

.box-cmn-card-icon-area {
  display: inline-block;
  margin-top: 22px;
  vertical-align: top;
  font-size:0;
}

.box-cmn-card-reward-area {
  float: right;
  vertical-align: top;
  text-align: right;
  margin-top: 21px;
}

.box-cmn-card-reward-area-period-limited-point {
  margin-top: 0px;
}

.box-cmn-card-status-or, .box-cmn-card-status-from {
  margin-left: 6px;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
  font-size: 18px;
}

.box-cmn-card-time {
  margin-right: 18px;
  font-size: 22px;
  font-weight: bold;
}

.box-cmn-card-time-unit {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
  font-size: 19px;
}

.box-cmn-card-point {
  display: inline-block;
  color: #ff5a5f;
  font-size: 40px;
}

.box-cmn-card-point-period-limited-point {
  height: 46px;
}

.box-cmn-card-period-limited-point-text {
  width: 100%;
  display: inline-block;
  font-size: 16px;
  text-align: right;
  color: #474747;
}

.box-cmn-card-point-unit {
  margin-left: 6px;
  font-size: 24px;
  color: #44bac7;
}

.box-cmn-card-point-unit-yen {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
  font-size: 20px;
  color: #44bac7;
}

.box-cmn-card-fancrew {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
  font-size: 18px;
  color: #ff5a5f;
}

.box-cmn-card-ico {
  position: absolute;
  right: 29px;
  top: 29px;
  z-index: 2;
  font-size: 0;
}

.box-cmn-card-ico input {
  display: none;
}

.box-cmn-card-ico-delete:hover {
  opacity: 1;
}

.box-cmn-card-ico-delete:before, .box-cmn-card-ico-delete:after {
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 3px;
  transition: 0.3s;
}

.box-cmn-card-ico-delete:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1718px;
  width: 22px;
  height: 30px;
  z-index: 1;
}

.box-cmn-card-ico-delete:after {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1810px;
  width: 22px;
  height: 30px;
  opacity: 0;
  z-index: 2;
}

.box-cmn-card-ico-delete:hover:after {
  opacity: 1;
}

.box-cmn-card-ico-delete-search:hover {
  opacity: 1;
}

.box-cmn-card-ico-delete-search:before, .box-cmn-card-ico-delete-search:after {
  content: '';
  display: block;
  position: absolute;
  right: 0;
  top: 30px;
  transition: 0.3s;
}

.box-cmn-card-ico-delete-search:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1718px;
  width: 22px;
  height: 30px;
  z-index: 1;
}

.box-cmn-card-ico-delete-search:after {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1810px;
  width: 22px;
  height: 30px;
  opacity: 0;
  z-index: 2;
}

.box-cmn-card-ico-delete-search:hover:after {
  opacity: 1;
}

.box-cmn-card-label {
  margin-top: 20px;
  letter-spacing: -.5em;
}

.box-cmn-card-thmbnl-area {
  background-color: #fff; 
  height: 170px;
  width: 204px;
  float: left;
  margin-right: 24px;
}

.box-cmn-card-thmbnl {
  height: 170px;
  width: 204px;
  object-fit: contain;
}

/* box-cmn-card-simple
---------------------------------------------------------- */
.box-cmn-card-simple {
  width: 100%;
  display: table;
  padding: 33px 40px 40px 30px;
  border-radius: 8px;
  background-color: #fff;
  border: 2px solid #ff5a5f;
}

.box-cmn-card-simple:hover {
  opacity: 1;
  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.2);
}

.box-cmn-card-simple:hover .box-cmn-card-simple-ttl {
  color: #1e97cd;
}

.box-cmn-card-simple-ico {
  width: 78px;
  display: table-cell;
  vertical-align: middle;
}

.box-cmn-card-simple-ttl {
  width: calc(100% - 78px);
  padding-right: 20px;
  display: table-cell;
  vertical-align: middle;
  color: #474747;
  font-size: 26px;
  transition: 0.3s;
}

.box-cmn-card-simple-status {
  width: 1%;
  display: table-cell;
  vertical-align: middle;
  text-align: right;
}

/* box-cmn-entry
---------------------------------------------------------- */
.box-cmn-entry {
  margin-top: 60px;
  text-align: center;
}

.box-cmn-entry:first-child {
  margin-top: 0;
}

.registration-category .box-cmn-entry {
  margin-top: 85px;
}

.required-agreement .box-cmn-entry {
  margin-top: 34px;
}

.box-cmn-entry-link {
  margin-top: 30px;
}

/* box-cmn-form
---------------------------------------------------------- */
.box-cmn-form {
  margin-top: 20px;
  text-align: left;
  /* js-work */
}

.box-cmn-form:first-child {
  margin-top: 0;
}

.box-cmn-form-wrap {
  min-height: 394px;
}

.box-cmn-form-body {
  border: 1px solid #e0ded5;
  border-top: none;
  padding: 26px 30px 19px;
  border-radius: 0 0 6px 6px;
  background-color: #fff;
}

.box-cmn-form-body.extens-input{
  padding: 10px 30px 30px;
}

.box-cmn-form .ttl-cmn-tag {
  border-radius: 6px 6px 0 0;
}

.box-cmn-form.is-disabled * {
  pointer-events: none;
}

.box-cmn-form-extended-item {
  margin-top: 30px;
  margin-bottom: 60px;
}

/* box-cmn-attention
---------------------------------------------------------- */
.box-cmn-attention {
  margin-top: 20px;
  padding: 20px;
  background-color: #ffd500;
  border-radius: 8px;
  line-height: 1.75;
}

.box-cmn-attention:first-child {
  margin-top: 0;
}

.box-cmn-attention a {
  text-decoration: underline;
}

.box-cmn-attention-small {
  width: 560px;
  margin-left: auto;
  margin-right: auto;
  font-size: 14px;
}

/* box-cmn-toggle
---------------------------------------------------------- */
a.box-cmn-toggle {
  display: none;
  padding-top: 30px;
}

/* box-cmn-toggle-view
---------------------------------------------------------- */
.box-cmn-toggle-view {
  max-height: 3.5em;
  overflow: hidden;
}

/* box-cmn-balloon
---------------------------------------------------------- */
.box-cmn-balloon {
  position: relative;
  margin-top: 40px;
  padding: 20px;
  background-color: #44bac7;
  border-radius: 8px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  font-size: 18px;
}

.box-cmn-balloon.profile-required {
  position: relative;
  padding: 20px;
  background-color: #fff;
  border-radius: 8px;
  color: #44bac7;
  font-weight: bold;
  text-align: center;
  font-size: 18px;
  border-style: solid;
  border-width: 2px;
  border-color: #44bac7;
  margin: 40px  0 30px;
  width:100%;
}

.box-cmn-balloon.profile-required:before {
  content: '';
  position: absolute;
  left: 50%;
  right: 0;
  top: calc(100% - 1px);
  margin-left: -15px;
  display: block;
  width: 35px;
  height: 20px;
  border-style: solid;
  border-width: 18px;
  border-color: #fff transparent transparent transparent;
  border-top: 18px solid #44bac7;
  margin-top: 2px;
}

.box-cmn-balloon.profile-required:after {
  content: '';
  position: absolute;
  left: 50%;
  right: 0;
  top: calc(100% - 1px);
  margin-left: -15px;
  display: block;
  width: 35px;
  height: 20px;
  border-style: solid;
  border-width: 18px;
  border-color: transparent;
  border-top: 18px solid #fff;
  margin-top:-0.5px;
}

.box-cmn-balloon:first-child {
  margin-top: 0;
}

.box-cmn-balloon:before {
  content: '';
  position: absolute;
  left: 50%;
  right: 0;
  top: calc(100% - 1px);
  margin-left: -17px;
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 17px 0 17px;
  border-color: #44bac7 transparent transparent transparent;
}

/* box-cmn-border
---------------------------------------------------------- */
.box-cmn-border-worker {
  padding: 0 0 30px 0;
  border-bottom: 1px solid #e0ded5;
}

.box-cmn-border-client {
  padding: 30px 0;
  border-top: 1px solid #e0ded5;
  border-bottom: 1px solid #e0ded5;
}

.box-cmn-border-client + .box-cmn-border-client {
  border-top: none;
}

/* ==========================================================
 mod
========================================================== */
/* mod-cmn-app
---------------------------------------------------------- */
.mod-cmn-app-ttl-in {
  padding-left: 30px;
  padding-right: 30px;
}

.mod-cmn-app-ttl-in:before, .mod-cmn-app-ttl-in:after {
  top: 5px;
}

.mod-cmn-app-lists {
  margin-top: 33px;
  text-align: center;
  letter-spacing: -.5em;
}

.mod-cmn-app-list {
  display: inline-block;
  margin: 0 20px;
  letter-spacing: normal;
}

.mod-cmn-app-link {
  display: block;
}

.mod-cmn-app-caption {
  display: block;
  margin-top: 8px;
  font-size: 16px;
  color: #474747;
}

/* mod-cmn-slider
---------------------------------------------------------- */
.mod-cmn-slider {
  overflow: hidden;
  height: 200px;
}

.mod-cmn-slider-wrap {
  margin: -6px 0 -14px;
}

.mod-cmn-slider-item {
  float: left;
}

.mod-cmn-slider-link {
  display: block;
  margin: 0 10px;
  background-color: #faf8f0;
  border-radius: 8px;
}

.mod-cmn-slider-link:hover {
  opacity: 1;
}

.mod-cmn-slider-img {
  width: 300px;
  height: 200px;
  border-radius: 8px;
  transition: 0.3s;
}

.mod-cmn-slider-link:hover .mod-cmn-slider-img {
  opacity: 0.6;
}

.mod-cmn-slider-control {
  margin-top: 20px;
  height: 26px;
  text-align: center;
}

.mod-cmn-slider-control-in {
  height: 26px;
  position: relative;
  display: inline-block;
  vertical-align: top;
  padding: 0 40px;
}

.mod-cmn-slider-control .slick-arrow {
  position: absolute;
  width: 26px;
  height: 26px;
  text-indent: -9999px;
}

.mod-cmn-slider-control .slick-arrow:before, .mod-cmn-slider-control .slick-arrow:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
}

.mod-cmn-slider-control .slick-arrow:before {
  transition: 0.3s;
  opacity: 1;
  z-index: 2;
}

.mod-cmn-slider-control .slick-arrow:after {
  z-index: 1;
}

.mod-cmn-slider-control .slick-arrow:hover:before {
  opacity: 0;
}

.mod-cmn-slider-control .slick-prev {
  left: 0;
}

.mod-cmn-slider-control .slick-prev:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8666px;
  width: 26px;
  height: 26px;
}

.mod-cmn-slider-control .slick-prev:after {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8702px;
  width: 26px;
  height: 26px;
}

.mod-cmn-slider-control .slick-next {
  right: 0;
}

.mod-cmn-slider-control .slick-next:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8594px;
  width: 26px;
  height: 26px;
}

.mod-cmn-slider-control .slick-next:after {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8630px;
  width: 26px;
  height: 26px;
}

.mod-cmn-slider-control .slick-dots {
  margin-top: 10px;
}

.mod-cmn-slider-control .slick-dots li {
  display: inline-block;
  height: 10px;
  margin: 0 7px;
  vertical-align: top;
}

.mod-cmn-slider-control .slick-dots li.slick-active button:before {
  background-color: #ffff33;
}

.mod-cmn-slider-control .slick-dots button {
  font-size: 0;
  line-height: 0;
  color: transparent;
}

.mod-cmn-slider-control .slick-dots button:before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  background-color: #e0ded5;
  border-radius: 50%;
  transition: 0.3s;
}

.mod-cmn-slider-control .slick-dots button:hover {
  opacity: 1;
}

.mod-cmn-slider-control .slick-dots button:hover:before {
  background-color: #ffff33;
}

/* mod-cmn-sort
---------------------------------------------------------- */
.mod-cmn-sort-wrap {
  position: relative;
  margin-bottom: 30px;
}

.mod-cmn-sort {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.mod-cmn-sort-head {
  overflow: hidden;
  padding-top: 5px;
  margin-right: 17px;
}

.mod-cmn-sort-head.fancrew-sort-count {
  margin-right: 20px;
}

.mod-cmn-sort-ttl {
  float: left;
  margin-bottom: 0;
  text-align: left;
  font-size: 24px;
}

.mod-cmn-sort-txt {
  float: right;
  padding-top: 4px;
  font-size: 20px;
  color: #0e5d66;
}

.mod-cmn-sort-txt-result {
  float: none;
  padding-top: 0;
  line-height: 1.05;
  font-size: 16px;
  color: #ff5a5f;
}

.mod-cmn-sort-txt-result-num {
  font-size: 30px;
}

.mod-cmn-sort-item {
  width: 260px;
}

.mod-cmn-sort-result {
  position: relative;
  margin-bottom: 30px;
  padding-bottom: 22px;
  border-bottom: 1px solid #e0ded5;
}

.mod-cmn-sort-result-ttl {
  float: left;
  margin: 0 35px 0 0;
  font-size: 16px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-sort-result-body {
  padding-top: 2px;
  overflow: hidden;
}

/* mod-cmn-freeword
---------------------------------------------------------- */
.mod-cmn-freeword {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1 1 0%;
  position: relative;
  margin-left: 15px;
}

.mod-cmn-freeword.freeword-page-search {
  margin-bottom: 30px;
  margin-left: 0;
}

.mod-cmn-freeword-form {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.mod-cmn-freeword-place-holder {
  display: inline-block;
  position: absolute;
  background-color: #fff;
  line-height: 1.05;
  font-size: 16px;
  color: #808080;
  top: 13px;
  left: 16px;
  letter-spacing: normal;
}

.mod-cmn-freeword-place-holder-search {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2509px;
  width: 18px;
  height: 18px;
  background-size: 101px 3783.5px;
  margin-right: 10px;
  position: relative;
  top: -3px;
}

input.mod-cmn-search-freeword {
  border-radius: 8px 0 0 8px;
}

.mod-cmn-btn-search-freeword {
  position: relative;
  left: -1px;
  height: 38px;
  border-radius: 0 4px 4px 0;
  width: 90px;
  background-color: #44bac7;
  box-shadow: 0px 2px 0px 0px #37959f;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  border: 0;
  vertical-align: top;
  cursor: pointer;
}

/* mod-cmn-ribbon
---------------------------------------------------------- */
.mod-cmn-ribbon {
  display: block;
  width: 84px;
  height: 84px;
  overflow: hidden;
  position: absolute;
  left: -5px;
  top: -5px;
  z-index: 2;
}

.mod-cmn-ribbon:before, .mod-cmn-ribbon:after {
  content: '';
  width: 0;
  height: 0;
  position: absolute;
  z-index: 1;
  border: 5px solid;
}

.mod-cmn-ribbon:before {
  top: 56px;
  left: -5px;
  border-color: transparent #c72d32 transparent transparent;
}

.mod-cmn-ribbon:after {
  top: -5px;
  right: 16px;
  border-color: transparent transparent #c72d32 transparent;
}

.mod-cmn-ribbon-in {
  display: inline-block;
  position: absolute;
  left: -20px;
  top: 14px;
  text-align: center;
  text-transform: uppercase;
  background: #ff5a5f;
  width: 90px;
  padding: 1px 10px;
  margin-top: -3px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  z-index: 2;
}

/* mod-cmn-category
---------------------------------------------------------- */
.box-cmn-card-ico + .mod-cmn-category {
  padding-right: 24px;
}

.mod-cmn-category-ico {
  width: 66px;
  display: table-cell;
  vertical-align: middle;
}

.mod-cmn-category-ico .ico-cmn-questionnaire {
  margin-top: -4px;
}

.mod-cmn-category-ico .ico-cmn-picture {
  margin-left: -8px;
}

.mod-cmn-category-ico .ico-cmn-other {
  margin-left: 6px;
}

.mod-cmn-category-body {
  display: table-cell;
  vertical-align: middle;
}

.mod-cmn-work .mod-cmn-category-body {
  padding-top: 6px;
}

.mod-cmn-category-labels {
  overflow: hidden;
  margin-top: -5px;
  margin-left: -5px;
  letter-spacing: -.5em;
}

.mod-cmn-category-label {
  float: left;
  margin: 5px 20px 5px 5px;
}

.mod-cmn-category-caption {
  margin-top: 8px;
  font-size: 14px;
  color: #999;
}

/* mod-cmn-label
---------------------------------------------------------- */
.mod-cmn-label {
  height: 33px;
  line-height: 33px;
  padding: 0 13px;
  display: inline-block;
  border-radius: 17px;
  background-color: #44bac7;
  border: solid 1px #44bac7;
  color: #fff;
  font-size: 16px;
  letter-spacing: normal;
}

.mod-cmn-label-mission {
  height: 33px;
  line-height: 33px;
  padding: 0 13px;
  display: inline-block;
  border-radius: 17px;
  background-color: #ffcd00;
  border: solid 1px #ffcd00;
  font-size: 16px;
  letter-spacing: normal;
}

.mod-cmn-label-fill {
  height: 28px;
  line-height: 28px;
  padding: 0 13px;
  display: inline-block;
  border-radius: 5px;
  background-color: #fff;
  border: solid 1px #44bac7;
  color: #44bac7;
  font-size: 14px;
  letter-spacing: normal;
}

.box-cmn-card .mod-cmn-label.is-disabled {
  height: 33px;
  line-height: 33px;
  padding: 0 13px;
  border-radius: 17px;
  background-color: #474747;
  border: solid 1px #474747;
  color: #fff;
  font-size: 16px;
  letter-spacing: normal;
  float: left;
  margin: 5px;
}

.mod-cmn-label.is-disabled {
  height: 33px;
  line-height: 33px;
  padding: 0 13px;
  border-radius: 17px;
  background-color: #474747;
  border: solid 1px #474747;
  color: #fff;
  font-size: 16px;
  letter-spacing: normal;
  float: left;
}

.mod-cmn-label-fill {
  color: #ff5a5f;
  border: none;
}

.mod-cmn-label-fill + .mod-cmn-label-fill {
  margin-left: 10px;
}

.mod-cmn-label-fill.is-disabled {
  background-color: #808080;
  border-color: #808080;
}

.mod-cmn-label-large {
  height: 35px;
  line-height: 35px;
  padding: 0 24px;
  font-size: 16px;
}

.card-label .mod-cmn-label-large {
  height: 35px;
  line-height: 49px;
  padding: 0 0 0 8px;
  font-size: 22px;
  font-weight: bold;
}

.mod-cmn-label-num {
  margin: 0 6px;
  font-size: 22px;
}

/* mod-cmn-search
---------------------------------------------------------- */
.mod-cmn-search {
  border: 2px solid #44bac7;
  border-radius: 11px;
}

.mod-cmn-search-wrap {
  background-color: #44bac7;
  border-radius: 11px;
}

.mod-cmn-search-item {
  position: relative;
}

.mod-cmn-search-ttl {
  position: relative;
  padding: 8px 15px 8px 15px;
  background-color: #44bac7;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  text-align: center;
}

.mod-cmn-search-ttl-top {
  border-radius: 5px 5px 0 0;
}

.mod-cmn-search-ttl-ico, .mod-cmn-search-ttl-ico:before, .mod-cmn-search-ttl-ico:after {
  display: inline-block;
  transition: 0.3s;
}

.mod-cmn-search-ttl-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 14px;
  height: 14px;
}

.mod-cmn-search-ttl-ico:before, .mod-cmn-search-ttl-ico:after {
  content: '';
  background-color: #fff;
  position: absolute;
  left: 15px;
  width: 100%;
  height: 2px;
}

.mod-cmn-search-ttl-ico:before {
  top: 5px;
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}

.mod-cmn-search-ttl-ico:after {
  top: 5px;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}

.mod-cmn-search-ttl.is-active .mod-cmn-search-ttl-ico:before {
  display: none;
}

.mod-cmn-search-ttl.is-active .mod-cmn-search-ttl-ico:after {
  top: 5px;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.mod-cmn-search-ttl.is-active + .mod-cmn-search-body {
  display: block;
  opacity: 1;
  -webkit-animation-duration: 0.3s;
          animation-duration: 0.3s;
  -webkit-animation-name: fade-in;
          animation-name: fade-in;
}

.mod-cmn-search-body {
  display: block;
  padding: 20px 13px;
  background-color: #fff;
  white-space: nowrap;
  z-index: 10;
}

.mod-cmn-search-body-lists-item {
  margin-top: 16px;
  font-size: 14px;
}

.mod-cmn-search-body-lists-item.mod-cmn-search-body-lists-item-hr {
  margin-top: 10px;
  font-size: 14px;
}

.mod-cmn-search-body-lists-item:first-child {
  margin-top: 0;
}

.mod-cmn-search-body-lists-item-hr:nth-child(n+2) {
  padding-top: 10px;
  border-top: 1px solid #e0ded5;
}

.mod-cmn-search-body-lists-item-child {
  padding-top: 10px;
  margin-top: 10px;
  border-top: 1px solid #e0ded5;
}

.mod-cmn-search-body-lists-item-child .mod-cmn-search-body-lists-item {
  padding-left: 17px;
}

.mod-cmn-search-set {
  position: relative;
  padding: 12px 14px;
  background-color: #fff;
  border-left: 1px solid #e0ded5;
  border-right: 1px solid #e0ded5;
  border-bottom: 1px solid #e0ded5;
  font-size: 12px;
  display: none;
}

.mod-cmn-search-item:first-child .mod-cmn-search-set {
  border-bottom: none;
}

.mod-cmn-search-set.is-word-over:after {
  content: '…';
  width: 1em;
  display: inline-block;
  position: absolute;
  right: 14px;
  bottom: 12px;
  background-color: #fff;
  text-align: center;
}

.mod-cmn-search-set-in {
  padding-right: 1em;
  overflow: hidden;
}

.mod-cmn-search-set.is-word-over .mod-cmn-search-set-in {
  height: 3em;
}

.mod-cmn-search-set-word:before {
  content: '/';
  margin: 0 .5em;
  color: inherit;
}

.mod-cmn-search-set-word:first-child:before {
  content: none;
}

.mod-cmn-search-set-leader:not(:last-child) {
  display: none;
}

.mod-cmn-search-display {
  padding: 10px 15px 14px;
  background-color: #fff;
}

.mod-cmn-search-display:last-child {
  padding: 10px 9px;
  border-radius: 0 0 10px 10px;
}

.mod-cmn-search-display-ttl {
  font-size: 14px;
  font-weight: bold;
}

.mod-cmn-search-display-ttl-in {
  cursor: pointer;
}

.mod-cmn-search-display-txt a {
  overflow: hidden;
}

.mod-cmn-search-display-txt a:last-child {
  display: none;
}

.mod-cmn-search-display-toggle {
  text-align: center;
  font-size: 12px;
}

.mod-cmn-search-display-toggle .link-cmn-toggle:before {
  top: .5em;
}

.mod-cmn-search-history {
  position: relative;
  height: 87px;
  overflow: hidden;
}

.mod-cmn-search-history.is-active {
  height: auto;
}

.mod-cmn-search-history.is-active a:first-child {
  display: none;
}

.mod-cmn-search-history.is-active a:last-child {
  display: inline-block;
}

.mod-cmn-search-history-txt {
  height: 36px;
  overflow: hidden;
  font-size: 12px;
}

.mod-cmn-search-history.is-active .mod-cmn-search-history-txt {
  height: auto;
}

.mod-cmn-search-result {
  line-height: 1.05;
  text-align: center;
  font-size: 20px;
  color: #ff5a5f;
  margin-bottom: 15px;
}

.mod-cmn-search-result-num {
  font-size: 34px;
}

.mod-cmn-search-btn {
  margin-top: 10px;
  margin-bottom: 4px;
}

.mod-cmn-search-btn .btn-cmn {
  font-size: 16px;
}

/* mod-cmn-work
---------------------------------------------------------- */
.mod-cmn-work {
  position: relative;
}

.mod-cmn-work-get {
  position: absolute;
  right: 70px;
  top: -2px;
}

.mod-cmn-work-price {
  position: relative;
  padding-top: 10px;
  padding-right: 70px;
  line-height: 1.2;
}

.mod-cmn-work .mod-cmn-category {
  padding-right: 250px;
}

.mod-cmn-work .mod-cmn-work-wrapp {
  position: relative;
}

.mod-cmn-work-star {
  position: absolute;
  right: 0;
  top: 18px;
}

.mod-cmn-work-wrapp .mod-cmn-work-star {
  top: auto;
  bottom: 5px;
  z-index: 1;
}

/* mod-cmn-terms
---------------------------------------------------------- */
.mod-cmn-terms {
  display: table;
  width: 100%;
  padding: 10px 0;
  margin-top: 20px;
  table-layout: fixed;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background-color: #fff;
}

.mod-cmn-terms:first-child {
  margin-top: 0;
}

.mod-cmn-terms-item {
  display: table-cell;
  vertical-align: middle;
  padding: 6px 30px;
  text-align: center;
}

.mod-cmn-terms-item:first-child .mod-cmn-terms-item-in:before {
  content: none;
}

.mod-cmn-terms-item-in {
  position: relative;
}

.mod-cmn-terms-item-in:before {
  content: '';
  position: absolute;
  left: -38px;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 1px;
  height: 30px;
  background-color: #e0ded5;
}

.mod-cmn-terms-ttl {
  font-size: 18px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-terms-ttl-progress {
  padding-bottom: 2px;
  color: #ff5a5f;
  font-weight: normal;
}

.mod-cmn-terms-detail {
  font-size: 18px;
}

.mod-cmn-terms-ttl-progress + .mod-cmn-terms-detail {
  border-top: 1px solid #e0ded5;
  padding-top: 2px;
}

/* mod-cmn-job
---------------------------------------------------------- */
.mod-cmn-job {
  margin-top: 40px;
  overflow: hidden;
}

.mod-cmn-job:last-child {
  margin-bottom: 26px;
}

.mod-cmn-job-detail {
  float: left;
  overflow: hidden;
}

.mod-cmn-job-detail-ttl {
  float: left;
  margin-right: 20px;
  font-weight: bold;
}

.mod-cmn-job-detail-txt {
  overflow: hidden;
}

.mod-cmn-job-link {
  float: right;
}

/* mod-cmn-wallet
---------------------------------------------------------- */
.mod-cmn-wallet {
  text-align: center;
  margin-top: 50px;
}

.mod-cmn-wallet:first-child {
  margin-top: 0;
}

.mod-cmn-wallet-body {
  position: relative;
  width: 370px;
  height: 370px;
  padding-top: 45px;
  border: 10px solid #e0ded5;
  background-color: #fff;
  border-radius: 50%;
  margin: auto;
}

.mod-cmn-wallet-body-color {
  background-color: #faf8f0;
}

.mod-cmn-wallet-ico {
  opacity: 1;
  -webkit-animation-duration: 1.6s;
          animation-duration: 1.6s;
  -webkit-animation-name: shake-in;
          animation-name: shake-in;
}

.mod-cmn-wallet-ttl {
  padding-top: 24px;
  line-height: 1.05;
  font-size: 20px;
  font-weight: bold;
}

.mod-cmn-wallet-txt {
  padding-top: 6px;
  line-height: 1.05;
  font-size: 70px;
  color: #ff5a5f;
}

.mod-cmn-wallet-txt-sub {
  margin-top: 4px;
  line-height: 1.05;
  font-size: 22px;
  font-weight: bold;
}

.mod-cmn-wallet-unit {
  margin-left: 3px;
  line-height: 1.05;
  font-size: 34px;
}

.mod-cmn-wallet-notes {
  margin-top: 10px;
  line-height: 1.75;
  font-size: 14px;
}

/* mod-cmn-reception
---------------------------------------------------------- */
.mod-cmn-reception {
  height: 556px;
  border-top: 1px solid #e0ded5;
  border-bottom: 1px solid #e0ded5;
}

.mod-cmn-reception-cli {
  height: 713px;
  position: absolute;
  width: 100%;
}

.mod-cmn-reception-cli.message-fixed {
  position: fixed;
  top: 186px;
  z-index: 5;
  width: 358px;
}

.mod-cmn-reception-wrap {
  width: 358px;
  position: absolute;
  top: 0;
}

.mod-cmn-reception-item {
  position: relative;
  display: block;
  padding: 18px 30px 16px 40px;
  background-color: #fff;
  border-bottom: 1px solid #e0ded5;
}

.mod-cmn-reception-item:last-child {
  border-bottom: none;
}

.mod-cmn-reception-item:before {
  content: '';
  display: block;
  position: absolute;
  left: 20px;
  top: 23px;
  width: 10px;
  height: 10px;
  background-color: #e0ded5;
  border-radius: 50%;
}

.mod-cmn-reception-item:after {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 10px;
  height: 100%;
  background-color: #44bac7;
}

.mod-cmn-reception-item.is-active:after {
  content: '';
}

.mod-cmn-reception-item.is-unread:before {
  background-color: #ff5a5f;
}

.mod-cmn-reception-item.is-unread-cli:before {
  background-color: #44bac7;
}

.mod-cmn-reception-item.mod-cmn-reception-item-title {
  padding: 13px 11px 9px 40px;
}

.mod-cmn-reception-item.mod-cmn-reception-item-user {
  padding-right: 11px;
}

.mod-cmn-reception-head {
  font-weight: bold;
  color: #474747;
}

.mod-cmn-reception-main {
  display: inline-block;
  width: 260px;
}

.mod-cmn-reception-sub {
  overflow: hidden;
}

.mod-cmn-reception-sub-ttl {
  float: left;
  width: 205px;
  font-size: 14px;
}

.mod-cmn-reception-sub-ttl.js-text-overflow {
  width: 295px;
}

.mod-cmn-reception-sub-ttl-cli {
  float: left;
  width: 205px;
  font-size: 14px;
}

.mod-cmn-reception-sub-ttl-cli.js-text-overflow {
  width: 260px;
}

.mod-cmn-reception-sub-mark {
  display: inline-block;
  width: 37px;
}

.mod-cmn-reception-sub-date {
  float: right;
/*   margin-left: 10px; */
  font-size: 12px;
  font-weight: normal;
  color: #808080;
}

.mod-cmn-reception-sub-name {
  font-size: 12px;
  font-weight: normal;
  color: #808080;
}

.mod-cmn-reception-sub-name + .mod-cmn-reception-sub-date {
  float: none;
  margin-left: 10px;
}

.mod-cmn-reception-ttl {
  margin-top: 6px;
  font-size: 16px;
}

.mod-cmn-reception-body {
  display: none;
  margin-top: 10px;
}

.mod-cmn-reception-txt {
  line-height: 1.75;
  color: #808080;
  font-size: 13px;
}

/* mod-cmn-message
---------------------------------------------------------- */
.mod-cmn-message {
  padding: 0 40px;
}

.mod-cmn-message-in {
  padding: 37px 0 330px;
}

.mod-cmn-message-in-cli {
  padding-top: 20px;
  padding-bottom: 40px;
  height: 770px;
}

.mod-cmn-message-item {
  width: 532px;
  margin-top: 40px;
  clear: both;
}

.mod-cmn-message-item:first-child {
  margin-top: 0;
}
.mod-cmn-message-item:last-child {
  margin-bottom: 40px;
}

.mod-cmn-message-item-client {
  float: left;
}

.mod-cmn-message-item-client .mod-cmn-message-head {
  padding-left: 30px;
}

.mod-cmn-message-item-client .mod-cmn-message-body {
  border-radius: 0 12px 12px 12px;
  background-color: #fff;
  color: #808080;
}

.mod-cmn-message-item-client .mod-cmn-message-foot {
  padding-left: 30px;
}

.mod-cmn-message-item-worker {
  float: right;
}

.mod-cmn-message-item-worker .mod-cmn-message-head {
  padding-right: 30px;
  text-align: right;
}

.mod-cmn-message-item-worker .mod-cmn-message-head-ttl {
  color: #128e9c;
}

.mod-cmn-message-item-worker .mod-cmn-message-body {
  border: 1px solid #44bac7;
  border-radius: 12px 0 12px 12px;
  background-color: #44bac7;
  color: #fff;
}

.mod-cmn-message-item-worker .mod-cmn-message-foot {
  padding-right: 30px;
  text-align: right;
}

.mod-cmn-message-head-sub-ttl {
  font-size: 14px;
  font-weight: bold;
  color: #999;
}

.mod-cmn-message-head-ttl {
  font-size: 14px;
  font-weight: bold;
}

.mod-cmn-message-body {
  margin-top: 10px;
  border: 1px solid #e0ded5;
  padding: 22px 30px;
  line-height: 1.75;
  font-size: 16px;
}

.mod-cmn-message-body-cli {
  font-size: 14px;
}

.mod-cmn-message-foot {
  margin-top: 12px;
}

.mod-cmn-message-foot-date {
  font-size: 14px;
  color: #808080;
}

.mod-cmn-message-foot-time {
  font-size: 14px;
  color: #808080;
  padding-left: 5px;
}

.mod-cmn-message-foot-unrd {
  font-size: 14px;
  color: #808080;
  padding-left: 5px;
  vertical-align: middle;
}

.mod-cmn-message-edit {
  width: 100%;
  padding: 0 40px;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
}

.mod-cmn-message-edit-in {
  position: relative;
/*   padding-bottom: 40px; */
  background-color: #faf8f0;
}

.mod-cmn-message-edit-btn {
/*   position: absolute; */
  left: 0;
  bottom: 40px;
  width: 100%;
  padding: 0 1px 1px;
  text-align: center;
}

.mod-cmn-message-edit-btn-in {
  padding: 19px 0;
  border-radius: 0 0 12px 12px;
/*   background-color: #fff; */
}

/* mod-cmn-menu
---------------------------------------------------------- */
.mod-cmn-menu {
  position: relative;
  display: block;
  background-color: #fff;
  border: 1px solid #e0ded5;
  padding: 24px;
  border-radius: 6px;
  color: #474747;
}

.mod-cmn-menu:hover {
  opacity: 1;
}

.mod-cmn-menu-link {
  padding-right: 68px;
}

.mod-cmn-menu-link:before, .mod-cmn-menu-link:after {
  content: '';
  display: inline-block;
  position: absolute;
  right: 29px;
  top: 0;
  bottom: 0;
  margin: auto;
  opacity: 1;
  transition: opacity 0.3s;
}

.mod-cmn-menu-link:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -356px;
  width: 16px;
  height: 28px;
  z-index: 2;
}

.mod-cmn-menu-link:after {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -440px;
  width: 16px;
  height: 28px;
  z-index: 1;
}

.mod-cmn-menu-link:hover:before {
  opacity: 0;
}

.mod-cmn-menu-link:hover .mod-cmn-menu-ttl {
  color: #44bac7;
}

.mod-cmn-menu-link:hover .mod-cmn-menu-status {
  color: #44bac7;
  opacity: 0.6;
}

.mod-cmn-menu-link:hover .mod-cmn-menu-ico:before {
  opacity: 0;
}

.mod-cmn-menu-wrap .mod-cmn-menu-link:hover .mod-cmn-menu-ttl {
  color: #474747;
}

.mod-cmn-menu-wrap .mod-cmn-menu-link .mod-cmn-menu-ttl-sub {
  transition: 0.3s;
}

.mod-cmn-menu-wrap .mod-cmn-menu-link:hover .mod-cmn-menu-ttl-sub {
  color: #44bac7;
}

.mod-cmn-menu-child {
  margin-top: -5px;
  padding-top: 20px;
  padding-bottom: 20px;
  border-radius: 0 0 6px 6px;
}

.mod-cmn-menu-child .mod-cmn-menu-ttl {
  padding-left: 110px;
  font-size: 16px;
}

.mod-cmn-menu-ico {
  position: absolute;
  left: 23px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.mod-cmn-menu-ico-child {
  position: absolute;
  left: 92px;
  top: -10px;
  bottom: 0;
  margin: auto;
}

.mod-cmn-menu-ttl {
  display: inline-block;
  font-size: 20px;
  transition: 0.3s;
}

.mod-cmn-menu-ico + .mod-cmn-menu-ttl {
  padding-left: 66px;
}

.mod-cmn-menu-mark {
  margin-left: 20px;
}

.mod-cmn-menu-attention {
  display: inline-block;
  margin-left: 20px;
  vertical-align: middle;
  font-size: 14px;
  color: #ff5a5f;
}

.mod-cmn-menu-ttl-mypage {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
}

.mod-cmn-menu-status {
  font-size: 15px;
  margin-top: 8px;
  position: absolute;
  right: 68px;
  opacity: 0.4;
  font-weight: bold;
}

.mod-cmn-menu-status-2l-pc {
  margin-top: 0px;
  text-align: right;
}

/* mod-cmn-direction
---------------------------------------------------------- */
.mod-cmn-direction {
  border: 1px solid #e0ded5;
  border-radius: 6px;
  background-color: #fff;
}

.mod-cmn-direction-item {
  display: table;
  width: 100%;
  border-bottom: 1px solid #e0ded5;
  padding: 26px 39px 26px 43px;
  line-height: 1.05;
}

.mod-cmn-direction-head {
  display: table-cell;
  vertical-align: middle;
  font-size: 22px;
}

.mod-cmn-direction-head-mp {
  display: inline-block;
  vertical-align: middle;
  font-size: 22px;
}

.mod-cmn-direction-ttl {
  display: inline-block;
  vertical-align: middle;
}

.mod-cmn-direction-ico {
  display: inline-block;
  width: 62px;
}

.mod-cmn-direction-body {
  display: table-cell;
  vertical-align: middle;
  text-align: right;
}

.mod-cmn-direction-body-mp {
  display: inline-block;
  vertical-align: middle;
  text-align: right;
}

.mod-cmn-direction-num {
  font-size: 48px;
  color: #ff5a5f;
}

.mod-cmn-direction-unit {
  margin-left: 6px;
  font-size: 30px;
  color: #ff5a5f;
}

.mod-cmn-direction-unit-yen {
  margin-left: 6px;
  font-size: 24px;
  color: #ff5a5f;
}

.mod-cmn-direction-foot {
  padding: 14px 20px;
  text-align: center;
}

.mod-cmn-direction-foot-txt {
  font-size: 16px;
}
.mod-cmn-direction-foot-txt-kai {
  margin-right: 5px;
  font-weight:bold;
  color: #ff5a5f;
}
.mod-cmn-direction-foot-num {
  margin: 0 5px;
  font-size: 26px;
  font-weight:bold;
  color: #ff5a5f;
}

.mod-cmn-direction-foot-unit {
  font-size: 18px;
  color: #ff5a5f;
}

.mod-cmn-direction-foot-link {
  margin-top: 6px;
}

.mod-cmn-direction-btn {
  margin-top: 40px;
  margin-bottom: 60px;
  text-align: center;
}

.mod-cmn-direction-foot-txt-font {
  margin:0 6px;
  font-size: 22px;
  font-weight: bold;
}

.mod-cmn-direction-item-bottom {
  padding-bottom: 10px;
}

.mod-cmn-direction-item-dpoint {
  display: table;
  width: 100%;
  line-height: 1.05;
}

.mod-cmn-direction-item-use-dpoint {
  width: 200px;
  float: right;
  padding-top: 5px;
}

/* mod-cmn-grade
---------------------------------------------------------- */
.mod-cmn-grade {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  border: 1px solid #e0ded5;
  border-radius: 6px;
  background-color: #fff;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1.05;
  margin-top: 42px;
}

.mod-cmn-grade:first-child {
  margin-top: 0;
}

.mod-cmn-grade-narrow {
  width: 560px;
  margin-left: auto;
  margin-right: auto;
}

.mod-cmn-grade-calc {
  width: 670px;
  padding: 25px 10px;
  text-align: center;
}

.mod-cmn-grade-calc-in {
  display: table;
  width: 100%;
  padding: 0 30px;
}

.mod-cmn-grade-calc-item {
  width: 50%;
  display: table-cell;
  vertical-align: middle;
}

.mod-cmn-grade-calc-ttl-in {
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
}

.mod-cmn-grade-calc-ico {
  margin-right: 12px;
}

.mod-cmn-grade-calc-ico.ico-cmn-yen-middle {
  margin-left: -30px;
}

.mod-cmn-grade-calc-result {
  margin-top: 14px;
  color: #ff5a5f;
}

.mod-cmn-grade-calc-num {
  font-size: 48px;
}

.mod-cmn-grade-calc-unit {
  margin-left: 5px;
  font-size: 24px;
}

.mod-cmn-grade-calc-plus {
  width: 1%;
  display: table-cell;
  padding-bottom: 5px;
  vertical-align: bottom;
  font-size: 34px;
  color: #999;
}

.mod-cmn-grade-calc-point-unit {
  margin-left: 5px;
  font-size: 30px;
}

.mod-cmn-grade-total {
  position: relative;
  padding: 25px 10px;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1 1 0%;
  text-align: center;
  border-left: 1px solid #e0ded5;
}

.mod-cmn-grade-total:only-child {
  border-left: none;
  padding: 30px 10px 35px;
}

.mod-cmn-grade-total:before, .mod-cmn-grade-total:after {
  left: -1px;
  top: 50%;
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.mod-cmn-grade-total:before {
  border-color: rgba(224, 222, 213, 0);
  border-left-color: #e0ded5;
  border-width: 25px;
  margin-top: -25px;
}

.mod-cmn-grade-total:after {
  border-color: rgba(255, 255, 255, 0);
  border-left-color: #fff;
  border-width: 24px;
  margin-top: -24px;
}

.mod-cmn-grade-total:only-child:before, .mod-cmn-grade-total:only-child:after {
  left: 50%;
  top: 100%;
}

.mod-cmn-grade-total:only-child:before {
  border-left-color: transparent;
  border-top-color: #e0ded5;
  margin-top: 0;
  margin-left: -25px;
}

.mod-cmn-grade-total:only-child:after {
  border-left-color: transparent;
  border-top-color: #fff;
  margin-top: 0;
  margin-left: -24px;
}

.mod-cmn-grade-total-txt {
  font-size: 18px;
}

.mod-cmn-grade-total-sub {
  margin-bottom: 18px;
  font-size: 24px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-grade-total-sub + .mod-cmn-grade-total-result {
  margin-bottom: 18px;
}

.mod-cmn-grade-total-result {
  display: block;
  margin-bottom: 10px;
}

.mod-cmn-grade-total-result-num {
  font-size: 60px;
  color: #ff5a5f;
}

.mod-cmn-grade-total-result-unit {
  margin-left: 5px;
  font-size: 34px;
  color: #ff5a5f;
}

.mod-cmn-grade-total-num {
  font-size: 20px;
  color: #ff5a5f;
}

.mod-cmn-grade-total-unit {
  margin-left: 5px;
  color: #ff5a5f;
}

.mod-cmn-grade-btn {
  margin-top: 23px;
  margin-bottom: 60px;
  text-align: center;
}

.mod-cmn-grade-btn:last-child {
  margin-bottom: 0;
}

.mod-cmn-grade-select {
  width: 260px;
  margin: 0 auto;
}

/* mod-cmn-board
---------------------------------------------------------- */
.mod-cmn-board {
  margin-top: 60px;
}

.mod-cmn-board.uh-prj-list-wrapp {
  margin-top: 0;
}

.mod-cmn-board:first-child {
  margin-top: 0;
}

.mod-cmn-board-head-in {
  display: table;
  width: 100%;
}

.mod-cmn-board-head-body {
  display: none;
  padding: 15px 30px 30px;
  background-color: #fff;
  border-left: 1px solid #e0ded5;
  border-right: 1px solid #e0ded5;
}

.mod-cmn-board-head-txt {
  display: table-cell;
  vertical-align: middle;
  padding: 15px 22px;
  background-color: #474747;
  border-radius: 8px 0 0 0;
  color: #fff;
}

.mod-cmn-board-head-txt:only-child {
  border-radius: 8px 8px 0 0;
}

.mod-cmn-board-head-txt-in {
  font-size: 20px;
  font-weight: bold;
}

.mod-cmn-board-head-slash {
  margin: 0 12px;
  font-size: 18px;
  opacity: .2;
}

.mod-cmn-board-head-result {
  font-size: 18px;
}

.mod-cmn-board-head-option {
  display: table-cell;
  width: 160px;
  text-align: center;
  vertical-align: middle;
  background-color: #44bac7;
  border-radius: 0 8px 0 0;
  box-shadow: inset 0px -4px 0px 0px rgba(4, 0, 0, 0.2);
  color: #fff;
  font-weight: bold;
}

.mod-cmn-board-head-option:hover {
  opacity: 0.8;
  box-shadow: inset 0px -1px 0px 0px rgba(4, 0, 0, 0.2);
}

.mod-cmn-board-head-option-txt-in {
  display: inline-block;
  vertical-align: middle;
}

.mod-cmn-board-head-option-ico {
  margin-right: 10px;
}

.mod-cmn-board-head-option-ico.ico-cmn-identify {
  display: inline-block;
}

.mod-cmn-board-head-option.is-active .mod-cmn-board-head-option-ico.ico-cmn-identify {
  display: none;
}

.mod-cmn-board-head-option-ico.ico-cmn-close {
  display: none;
}

.mod-cmn-board-head-option.is-active .mod-cmn-board-head-option-ico.ico-cmn-close {
  display: inline-block;
}

.mod-cmn-board-body, .mod-cmn-board-faq {
  border: 1px solid #e0ded5;
  border-top: none;
  border-radius: 0 0 6px 6px;
  background-color: #fff;
}

.mod-cmn-board-faq {
  border-radius: 0;
}

.mod-cmn-board-item {
  border-top: 1px solid #e0ded5;
  padding: 9px 0;
}

.mod-cmn-board-item-link {
  display: table;
  width: 100%;
  color: #474747;
}

.mod-cmn-board-item-head {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  width: 146px;
  padding: 10px;
  border-right: 1px solid #e0ded5;
  line-height: 1.05;
}

.mod-cmn-board-item-head-faq {
  width: 94px;
  border-right: none;
  vertical-align: top;
}

.mod-cmn-board-item-head-faq + .mod-cmn-board-item-body {
  padding-left: 0;
}

.mod-cmn-board-item-content {
  width: 380px;
  padding-right: 20px;
  display: table-cell;
  vertical-align: middle;
  text-align: right;
}

.mod-cmn-board-item-content.uh-prj-list-item-content {
  width: 390px;
  padding-right: 15px;
}

.mod-cmn-board-item-date {
  float: left;
  padding-top: 13px;
  color: #808080;
}

.mod-cmn-board-item-point {
  overflow: hidden;
  font-size: 32px;
  color: #ff5a5f;
}

.mod-cmn-board-item-point-unit {
  margin-left: 5px;
  margin-right: 3px;
  font-size: 20px;
}

.mod-cmn-board-item-yen-unit {
  margin-left: 4px;
  font-size: 16px;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
}

.mod-cmn-board-item-period-limited-point-text {
  display: inline-block;
  width: 126px;
  font-size: 14px;
  color: #474747;
}

.mod-cmn-board-item-q, .mod-cmn-board-item-a {
  font-size: 32px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-board-item-a {
  color: #ff5a5f;
}

.mod-cmn-board-item-body {
  display: table-cell;
  vertical-align: middle;
  padding: 10px 30px;
}

.mod-cmn-board-item-body-ttl {
  font-size: 18px;
}

.mod-cmn-board-item-set {
  display: table-cell;
  vertical-align: middle;
  width: 234px;
  padding-right: 30px;
  color: #808080;
}

.mod-cmn-board-item-approval {
  display: table-cell;
  padding-left: 30px;
  vertical-align: middle;
}

.mod-cmn-board-item-ttl {
  display: table-cell;
  vertical-align: middle;
}

.mod-cmn-board-item-detail-in {
  margin: 19px 19px 10px;
  padding: 24px 18px;
  background-color: #faf8f0;
  overflow: hidden;
  border-radius: 8px;
}

.mod-cmn-board-item-detail-in:only-child {
  margin-top: 10px;
}

.mod-cmn-board-item-detail-txt {
  margin-bottom: 18px;
}

.mod-cmn-board-item-detail-txt:last-child {
  margin-bottom: 0;
}

.mod-cmn-board-item-detail-faq {
  display: table-cell;
  vertical-align: top;
  text-align: center;
  width: 94px;
  padding: 0 10px;
  line-height: 1.05;
}

.mod-cmn-board-item-detail-faq-wrap {
  padding: 20px 20px 10px 0;
}

.mod-cmn-board-item-detail-faq + * {
  display: table-cell;
  word-break: break-all;
}

.mod-cmn-board-item-detail-fig {
  float: left;
  width: 260px;
  margin-right: 20px;
}

.mod-cmn-board-item-detail-body {
  overflow: hidden;
}

.mod-cmn-board-item-status {
  margin-left: -31px;
  margin-top: -10px;
  padding-left: 16px;
  font-size: 14px;
  overflow: hidden;
}

.mod-cmn-board-item-status-fit {
  padding-left: 0;
}

.mod-cmn-board-item-status-list {
  float: left;
  margin-top: 10px;
  padding: 0 30px;
  border-left: 1px solid #e0ded5;
  overflow: hidden;
}

.mod-cmn-board-item-status-list:first-child {
  border-left: none;
}

.mod-cmn-board-item-status-ttl {
  float: left;
  margin-right: 18px;
  font-weight: bold;
  color: #808080;
}

.mod-cmn-board-item-status-txt {
  overflow: hidden;
}

/* mod-cmn-accordion
---------------------------------------------------------- */
.mod-cmn-accordion {
  position: relative;
  padding-right: 57px;
}

.mod-cmn-accordion:hover {
  opacity: 1;
}

.mod-cmn-accordion:before, .mod-cmn-accordion:after {
  content: '';
  display: inline-block;
  position: absolute;
  right: 30px;
  top: 0;
  bottom: 0;
  margin: auto;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}

.mod-cmn-accordion:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -356px;
  width: 16px;
  height: 28px;
  z-index: 2;
  opacity: 1;
  transition: opacity 0.3s, -webkit-transform 0.3s;
  transition: opacity 0.3s, transform 0.3s;
  transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.mod-cmn-accordion:hover:before {
  opacity: 0;
}

.mod-cmn-accordion:after {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -440px;
  width: 16px;
  height: 28px;
  z-index: 1;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.mod-cmn-accordion.is-active:before, .mod-cmn-accordion.is-active:after {
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg);
}

.mod-cmn-accordion + * {
  display: none;
}

/* mod-cmn-attribute
---------------------------------------------------------- */
.mod-cmn-attribute {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.mod-cmn-attribute-item {
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1 1 0%;
  position: relative;
  margin-left: 40px;
}

.mod-cmn-attribute-item:before {
  content: '';
  position: absolute;
  left: -28px;
  top: 0;
  bottom: 0;
  margin: auto;
  background-image: url(../img/common/sprite.png);
  background-position: 0px -478px;
  width: 16px;
  height: 22px;
}

.mod-cmn-attribute-item:first-child {
  margin-left: 0;
}

.mod-cmn-attribute-item:first-child:before {
  content: none;
}

.mod-cmn-attribute-txt {
  height: 100%;
  padding-left: 21px;
  padding-right: 21px;
}

/* mod-cmn-calc
---------------------------------------------------------- */
.mod-cmn-calc {
  width: 565px;
  margin-left: 35px;
}

.mod-cmn-calc-box {
  margin-left: 5px;
  margin-right: 0;
  width: auto;
}

.mod-cmn-calc-item {
  position: relative;
  margin-top: 20px;
}

.mod-cmn-no-calc-item {
  position: relative;
  margin-top: 0px;
}

.mod-cmn-calc-item:first-child {
  margin-top: 0;
}

.mod-cmn-calc-item-total {
  margin-top: 44px;
}

.mod-cmn-calc-item-total:before, .mod-cmn-calc-item-total:after {
  content: '';
  display: block;
  width: 600px;
  height: 1px;
  position: absolute;
  left: -35px;
  background-color: #e0ded5;
}

.mod-cmn-calc-item-total:before {
  top: -20px;
}

.mod-cmn-calc-item-total:after {
  top: -23px;
}

.mod-cmn-calc-unit {
  margin: 0 12px;
}

.mod-cmn-calc-unit-tax {
  display: inline-block;
  width: 85px;
}

.mod-cmn-calc-unit:last-child {
  margin-right: 0;
}

.mod-cmn-calc-input-title {
  font-weight: bold;
  display: inline-block;
  width: 68px;
  text-align: right;
  padding-right: 20px;
}

.mod-cmn-calc-input-title-textonly {
  font-weight: bold;
  display: inline-block;
  width: 48px;
  text-align: right;
}

.mod-cmn-calc-input-title-textonly.is-chat-active {
  width: 128px;
}

.mod-cmn-calc-input-title.is-chat-active {
  width: 148px;
}

.mod-cmn-calc-input-title.is-reward-active {
  width: 100px;
  text-align: left;
}

.mod-cmn-calc-input-fixed-rate {
  font-weight: normal;
}

.mod-cmn-calc-input-unit {
  font-weight: bold;
}

.mod-cmn-calc-auto-title {
  font-size: 14px;
  width: 105px;
  display: inline-block;
}

.mod-cmn-calc-auto-title.is-chat-active {
  margin-left: 44px;
}

.mod-cmn-calc-auto-data {
  font-size: 13px;
  height: 40px !important;
}

.mod-cmn-calc-auto {
  font-size: 14px;
}

.mod-cmn-calc-plus, .mod-cmn-calc-minus, .mod-cmn-calc-multiply {
  position: relative;
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 0;
  font-size: 0;
}

.mod-cmn-calc-plus:before, .mod-cmn-calc-plus:after, .mod-cmn-calc-minus:before, .mod-cmn-calc-minus:after, .mod-cmn-calc-multiply:before, .mod-cmn-calc-multiply:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  width: 20px;
  height: 2px;
  background-color: #999;
}

.mod-cmn-calc-plus:after, .mod-cmn-calc-multiply:after {
  width: 2px;
  height: 20px;
}

.mod-cmn-calc-minus:after {
  content: none;
}

.mod-cmn-calc-multiply {
  margin: 0 44px 0 22px;
  color: #999;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.mod-cmn-calc-ico {
  position: absolute;
  left: -35px;
  top: 0;
  bottom: 0;
  margin: auto;
  font-size: 26px;
  color: #999;
}

.mod-cmn-calc-ttl {
  position: absolute;
  left: 22px;
  top: 0;
  bottom: 0;
  height: 1em;
  line-height: 1.05;
  margin: auto;
  color: #128e9c;
}

.mod-cmn-calc-ttl + input {
  padding-left: 200px;
}

.mod-cmn-calc-notes {
  margin-top: 12px;
  text-align: right;
  font-size: 14px;
}

.mod-cmn-calc-sys-fee {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  padding-right: 6px;
  margin-left: -32px;
  width: auto;
}

/* mod-cmn-progress
---------------------------------------------------------- */
.mod-cmn-progress {
  float: right;
  width: 630px;
  padding-top: 5px;
}

.mod-cmn-progress-wrap {
  margin-bottom: 50px;
}

.mod-cmn-progress-ttl {
  float: left;
}

.mod-cmn-progress-lists {
  position: relative;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.mod-cmn-progress-lists:before {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 2px;
  background-color: #e0ded5;
}

.mod-cmn-progress-list {
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1 1 0%;
  position: relative;
  padding-top: 22px;
  text-align: center;
}

.mod-cmn-progress-list:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -8px;
  margin: auto;
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: #fff;
  border-radius: 50%;
  border: 4px solid #44bac7;
  z-index: 2;
}

.mod-cmn-progress-list:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  margin-left: -50%;
  width: 200%;
  height: 2px;
  background-color: #e0ded5;
  z-index: 1;
}

.mod-cmn-progress-list:first-child:after, .mod-cmn-progress-list:last-child:after {
  content: none;
}

.mod-cmn-progress-list-01:before {
  border: 4px solid #44bac7;
}

.mod-cmn-progress-list-01.is-active .mod-cmn-progress-txt {
  background-color: #44bac7;
}

.mod-cmn-progress-list-02:before {
  border: 4px solid #128e9c;
}

.mod-cmn-progress-list-02.is-active .mod-cmn-progress-txt {
  background-color: #128e9c;
}

.mod-cmn-progress-list-03:before {
  border: 4px solid #1e97cd;
}

.mod-cmn-progress-list-03.is-active .mod-cmn-progress-txt {
  background-color: #1e97cd;
}

.mod-cmn-progress-list-04:before {
  border: 4px solid #ffb237;
}

.mod-cmn-progress-list-04.is-active .mod-cmn-progress-txt {
  background-color: #ffb237;
}

.mod-cmn-progress-list-05:before {
  border: 4px solid #a080ef;
}

.mod-cmn-progress-list-05.is-active .mod-cmn-progress-txt {
  background-color: #a080ef;
}

.mod-cmn-progress-list-06:before {
  border: 4px solid #ff5a5f;
}

.mod-cmn-progress-list-06.is-active .mod-cmn-progress-txt {
  background-color: #ff5a5f;
}

.mod-cmn-progress-list.is-active .mod-cmn-progress-txt {
  color: #fff;
}

.mod-cmn-progress-list-04.is-stop .mod-cmn-progress-txt {
  background-color: #bfbfbf;
  color: #fff;
}

.mod-cmn-progress-list-05.is-stop .mod-cmn-progress-txt {
  background-color: #bfbfbf;
  color: #fff;
}

.mod-cmn-progress-txt {
  display: block;
  padding: 8px 5px;
  border-radius: 6px;
  line-height: 1.05;
  font-size: 14px;
  color: #808080;
}

/* mod-cmn-task
---------------------------------------------------------- */
.mod-cmn-task-overview, .mod-cmn-task-history {
  padding: 26px 30px;
  height: 100%;
  min-height: 234px;
  max-height: 234px;
  border: 1px solid #e0ded5;
  border-radius: 6px;
  background-color: #fff;
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 14px;
}

.mod-cmn-task-overview-lists {
  margin-top: -18px;
  overflow: hidden;
}

.mod-cmn-task-overview-list {
  float: left;
  width: 50%;
  margin-top: 18px;
  overflow: hidden;
}

.mod-cmn-task-overview-list:nth-child(2n+1) {
  padding-right: 10px;
}

.mod-cmn-task-overview-ttl {
  float: left;
  width: 100px;
  padding-right: 10px;
  font-weight: bold;
  color: #999;
}

.mod-cmn-task-overview-txt {
  overflow: hidden;
}

.mod-cmn-task-history {
  height: 100%;
  background-color: #fff;
  overflow-y: auto;
  overflow-x: hidden;
}

.mod-cmn-task-history-lists {
  margin-top: -18px;
}

.mod-cmn-task-history-list {
  margin-top: 18px;
}

.mod-cmn-task-history-ttl {
  color: #999;
}

/* mod-cmn-situation
---------------------------------------------------------- */
.mod-cmn-situation-detail {
  text-align: center;
  letter-spacing: -.5em;
}

.mod-cmn-situation-item {
  display: inline-block;
  margin: 0 15px;
  letter-spacing: normal;
  line-height: 1.05;
}

.mod-cmn-situation-txt {
  font-size: 14px;
  margin-top: 16px;
  text-align: center;
}

.mod-cmn-situation-result {
  font-size: 14px;
  font-weight: bold;
}

.mod-cmn-situation-num {
  margin: 0 5px;
  font-size: 30px;
}

.mod-cmn-situation-rate {
  margin-left: 5px;
  font-weight: normal;
}

.mod-cmn-situation-grah {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  width: 100%;
  padding: 4px 5px;
  height: 30px;
  border: 1px solid #e0ded5;
  border-radius: 30px;
  background-color: #fff;
  margin-top: 18px;
  overflow: hidden;
}

.mod-cmn-situation-bar {
  width: 0;
  -webkit-flex-grow: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  height: 100%;
  background-color: #f00;
  transition: 3s;
}

.mod-cmn-situation-bar:first-child {
  border-radius: 20px 0 0 20px;
}

.mod-cmn-situation-bar:last-child {
  border-radius: 0 20px 20px 0;
}

/* mod-cmn-select
---------------------------------------------------------- */
.mod-cmn-select {
  margin-bottom: 30px;
}

.mod-cmn-select-ttl {
  padding-top: 8px;
  float: left;
}

.mod-cmn-select-ttl-order-job {
  margin-bottom: 28px;
  padding-top: 8px;
}

.mod-cmn-select-ttl .ttl-cmn-02 {
  line-height: 1.05;
}

.mod-cmn-select-ttl-txt {
  margin-right: 18px;
  display: inline-block;
  vertical-align: middle;
  font-weight: bold;
}

.mod-cmn-select-matter {
  float: left;
  padding-top: 6px;
}

.mod-cmn-select-matter-txt {
  font-size: 14px;
  color: #808080;
}

.mod-cmn-select-matter-num {
  margin-right: 4px;
  font-size: 20px;
}

.mod-cmn-select-txt {
  float: left;
  margin-top: -4px;
}

.mod-cmn-select-read {
  color: #808080;
}

.mod-cmn-select-notes {
  font-size: 14px;
  color: #808080;
}

.mod-cmn-select-num {
  margin: 0 3px;
  font-size: 20px;
  font-weight: bold;
}

.mod-cmn-select-balloon {
  float: right;
  position: relative;
  padding: 10px;
  margin-bottom: -2px;
  background: #ece8da;
  border-radius: 6px;
}

.mod-cmn-select-balloon:before {
  top: 100%;
  right: 48px;
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(236, 232, 218, 0);
  border-top-color: #ece8da;
  border-width: 10px;
  margin-left: -10px;
}

.mod-cmn-select-balloon-bottom {
  margin-top: 20px;
  margin-bottom: 0;
}

.mod-cmn-select-balloon-bottom:before {
  top: auto;
  bottom: 100%;
  border-top-color: transparent;
  border-bottom-color: #ece8da;
}

.mod-cmn-select-balloon-txt {
  display: inline-block;
  vertical-align: middle;
  margin-right: 20px;
  font-size: 14px;
}

.mod-cmn-select-balloon-lists {
  display: inline-block;
  vertical-align: middle;
}

.mod-cmn-select-balloon-list {
  float: left;
  margin-left: 10px;
}

.mod-cmn-select-balloon-list:first-child {
  margin-left: 0;
}

.mod-cmn-select-option {
  float: right;
  letter-spacing: -.5em;
}

.mod-cmn-select-option-order-job-status {
  letter-spacing: -.5em;
}

.mod-cmn-select-option-item {
  width: 160px;
  margin-left: 20px;
  display: inline-block;
  vertical-align: middle;
  letter-spacing: normal;
}

.mod-cmn-select-option-item-order-job-status {
  width: 160px;
  display: inline-block;
  vertical-align: middle;
  letter-spacing: normal;
}

.mod-cmn-select-option-item-wide {
  width: 260px;
}

.mod-cmn-select-option-item-auto {
  width: auto;
}

.mod-cmn-select-option-item-margin {
  margin-right: 30px;
}

.mod-cmn-select-option-item-txt {
  text-align: right;
  font-size: 14px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-select-option-order-size {
  letter-spacing: normal;
  float: right;
}

.mod-cmn-select-option-order-size-bottom .mod-cmn-select-option-item-size {
  justify-content: flex-end;
}

.mod-cmn-select-option-item-size {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.mod-cmn-select-option-item-size p {
  margin-right: 10px;
  line-height: 40px;
}

.mod-cmn-select-option-item-size select {
  width: 120px;
  direction: rtl;
}

.mod-cmn-select-option-balloon {
  position: relative;
  margin-right: 28px;
  padding: 12px 20px;
  display: inline-block;
  vertical-align: middle;
  background-color: #e0ded5;
  border-radius: 6px;
  line-height: 1.05;
  font-size: 14px;
  font-weight: bold;
}

.mod-cmn-select-option-balloon:after {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(224, 222, 213, 0);
  border-left-color: #e0ded5;
  border-width: 7px;
  margin-top: -7px;
}

.mod-cmn-select-option-txt {
  display: inline-block;
  vertical-align: middle;
}

/* mod-cmn-case
---------------------------------------------------------- */
.mod-cmn-case {
  display: table;
  table-layout: fixed;
  width: 100%;
  border: 1px solid #e0ded5;
  background-color: #fff;
  border-radius: 6px;
}

.mod-cmn-case-status-title {
  display: table-cell;
  font-size: 12px;
  color: #fff;
  vertical-align: middle;
  height: 41px;
  width: 105px;
  padding-left: 6px;
  background: #10808c;
  border-radius: 6px 0px 0px 0px;
  padding-left: 18px;
  letter-spacing: 2px;
  font-size: 14px;
}

.mod-cmn-case-status-triangle {
  display: table-cell;
  border-top: 20px solid transparent;
  border-bottom: 20px solid transparent;
  position: relative;
  left: -1px;
}
.mod-cmn-case-status-triangle-blue-deep {
  border-left: 20px solid #1B88B8;
}

.mod-cmn-case-status-triangle-blue-dark-deep {
  border-left: 20px solid #108095;
}

.mod-cmn-case-status-triangle-pink-deep {
  border-left: 20px solid #E55155;
}

.mod-cmn-case-status-triangle-yellow-deep {
  border-left: 20px solid #E5983C;
}

.mod-cmn-case-status-triangle-gray-light-deep {
  border-left: 20px solid #898989;
}

.mod-cmn-case-status-triangle-purple-deep {
  border-left: 20px solid #9073D7;
}

.mod-cmn-case-status-name {
  padding-left: 10px;
  display: table-cell;
  font-size: 18px;
  color: #fff;
  vertical-align: middle;
  height: 41px;
  font-weight: bold;
  letter-spacing: 1px;
}

.mod-cmn-case-detail {
  display: table-cell;
  padding: 28px 29px 29px;
  vertical-align: top;
  width: inherit;
}

.mod-cmn-case-detail-outside {
  width: 710px;
  border-right: 1px solid #e0ded5;
  min-height: 309px;
}

.mod-cmn-case-detail-status-bar {
  height: 41px;
  border-radius: 6px 0px 0px 0px;
}

.mod-cmn-case-detail-head {
  display: table;
  width: 100%;
}

.mod-cmn-case-detail-ttl {
  display: table-cell;
  vertical-align: middle;
  padding-left: 0px;
  font-size: 24px;
}

.mod-cmn-case-detail-ttl .ttl-cmn-mark-ico {
  top: -8px;
}

.mod-cmn-case-detail-status {
  display: table-cell;
  vertical-align: middle;
  width: 1%;
  padding-left: 10px;
  white-space: nowrap;
  text-align: right;
  font-size: 14px;
  font-weight: bold;
}

.mod-cmn-case-detail-body {
  margin-top: 20px;
  overflow: hidden;
}

.mod-cmn-case-detail-state {
  overflow: hidden;
}

.mod-cmn-case-detail-state-wrap {
  float: left;
  width: 239px;
  padding-right: 10px;
  width: 100%;
}

.mod-cmn-case-detail-state-ttl {
  float: left;
  width: 70px;
  clear: both;
  font-size: 14px;
  font-weight: bold;
  color: #999;
}

.mod-cmn-case-detail-state-txt {
  margin-bottom: 5px;
  font-size: 14px;
}

.mod-cmn-case-detail-state-txt:last-child {
  margin-bottom: 0;
}

.mod-cmn-case-detail-state-box {
  display: table-cell;
  width: 220px;
}

.mod-cmn-case-detail-state-box-additional {
  margin-top: 5px;
}

.mod-cmn-case-detail-count {
  overflow: hidden;
}

.mod-cmn-case-detail-count-wrap {
  width: 42%;
  display: inline-block;
}

.mod-cmn-case-detail-count-wrap:last-child {
  width: 53%;
}

.mod-cmn-case-detail-count-item {
  float: left;
  width: 120px;
  border: 2px solid #e0ded5;
  padding: 0 15px;
  border-radius: 6px;
  margin-left: 10px;
  text-align: center;
}

.mod-cmn-case-detail-count-item:first-child {
  margin-left: 0;
}

.mod-cmn-case-detail-count-item-in {
  margin: -2px 0;
  padding: 14px 0;
  background-color: #fff;
}

.mod-cmn-case-detail-count-txt {
  margin-top: 18px;
  line-height: 1.05;
  font-size: 30px;
  color: #808080;
}

.mod-cmn-case-detail-foot {
  padding-top: 30px;
}

.mod-cmn-case-detail-foot-list {
  float: left;
  font-size: 14px;
  margin-left: 25px
}

.mod-cmn-case-detail-foot-list:first-child {
  margin-left: 0;
}

.mod-cmn-case-control {
  width: 450px;
  padding: 11px 29px 30px 30px;
  display: table-cell;
  vertical-align: top;
  height: 100%;
  position: relative;
}

.mod-cmn-case-control-head {
  display: table;
  width: 100%;
  background-color: #faf8f0;
  border-radius: 6px;
  font-size: 14px;
}

.mod-cmn-case-control-head-ttl {
  display: table-cell;
  width: 50%;
  vertical-align: middle;
  padding: 5px 11px 4px;
}

.mod-cmn-case-control-head-mark {
  display: table-cell;
  vertical-align: middle;
  padding: 5px 11px 4px;
  border-radius: 0 6px 6px 0;
  text-align: center;
  color: #fff;
}

.mod-cmn-case-control-body {
  margin-top: 20px;
  height: 100%;
  display: block;
  min-height:100%;
}

.mod-cmn-case-control-btns {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-left: -10px;
  margin-top: -14px;
}

.mod-cmn-case-control-btn {
  width: 50%;
  margin-top: 14px;
  padding-left: 10px;
}

.mod-cmn-case-control-cancel {
  margin-top: 25px;
  text-align: center;
  line-height: 1.05;
  font-size: 14px;
}

.mod-cmn-case-control-foot {
  width: 380px;
  position: absolute;
  bottom: 30px;
  padding-left: 140px;
}

/* mod-cmn-mark
---------------------------------------------------------- */
.mod-cmn-mark {
  display: inline-block;
  min-width: 40px;
  padding: 0 7px;
  height: 20px;
  line-height: 20px;
  border-radius: 20px;
  background-color: #ff5a5f;
  font-size: 12px;
  color: #fff;
  text-align: center;
}

/* mod-cmn-following
---------------------------------------------------------- */
.mod-cmn-following {
  position: relative;
}

.mod-cmn-following-body {
  padding-left: 200px;
}

.mod-cmn-following-attention {
  margin-top: 40px;
  margin-bottom: -20px;
  font-size: 14px;
  color: #ff5a5f;
}

/* mod-cmn-balloon
---------------------------------------------------------- */
.mod-cmn-balloon {
  display: none;
  position: absolute;
  left: -60px;
  bottom: 50px;
  width: 210px;
  padding: 14px 18px;
  background: #fff;
  border: 2px solid #e0ded5;
  line-height: 1.6;
  text-align: left;
  letter-spacing: normal;
}

.mod-cmn-balloon-wrap.is-active .mod-cmn-balloon,
.mod-cmn-balloon-wrap:hover .mod-cmn-balloon {
  display: block;
}

.mod-cmn-balloon:before, .mod-cmn-balloon:after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.mod-cmn-balloon:before {
  border-color: rgba(224, 222, 213, 0);
  border-top-color: #e0ded5;
  border-width: 17px;
  margin-left: -17px;
}

.mod-cmn-balloon:after {
  border-color: rgba(255, 255, 255, 0);
  border-top-color: #fff;
  border-width: 14px;
  margin-left: -14px;
}

.mod-cmn-balloon-wrap {
  position: relative;
  display: inline-block;
  margin-left: 40px;
  letter-spacing: -.5em;
}

.mod-cmn-balloon-wrap:first-child {
  margin-left: 0;
}

.mod-cmn-balloon-txt {
  font-size: 14px;
}

/* mod-cmn-tab
---------------------------------------------------------- */
.mod-cmn-tab {
  background-color: #faf8f0;
}

.mod-cmn-tab-body {
  display: none;
}

.mod-cmn-tab-body.is-active {
  display: block;
}

/* mod-cmn-flow
---------------------------------------------------------- */
.mod-cmn-flow {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  height: 80px;
  margin: 20px auto 0;
}

.mod-cmn-flow:first-child {
  margin-top: 0;
}

.mod-cmn-flow-item {
  position: relative;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex: 1 1 0;
      -ms-flex: 1 1 0px;
          flex: 1 1 0%;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 0 0 40px;
  color: #fff;
}

.mod-cmn-flow-item:before {
  content: '';
  display: block;
  position: absolute;
  right: -20px;
  top: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 40px 0 40px 20px;
}

.mod-cmn-flow-item:first-child {
  padding-left: 30px;
  background-color: #44bac7;
}

.mod-cmn-flow-item:first-child:before {
  z-index: 2;
  border-color: transparent transparent transparent #44bac7;
}

.mod-cmn-flow-item:nth-child(2) {
  background-color: #3da7b3;
}

.mod-cmn-flow-item:nth-child(2):before {
  z-index: 3;
  border-color: transparent transparent transparent #3da7b3;
}

.mod-cmn-flow-item:nth-child(3) {
  background-color: #3796a1;
}

.mod-cmn-flow-item:nth-child(3):before {
  z-index: 4;
  border-color: transparent transparent transparent #3796a1;
}

.mod-cmn-flow-item:last-child {
  background-color: #ffd500;
  color: #474747;
}

.mod-cmn-flow-item:last-child:before {
  content: none;
}

.mod-cmn-flow-item:last-child .mod-cmn-flow-num {
  margin-right: 60px;
}

.mod-cmn-flow-item:nth-child(4) .mod-cmn-flow-num {
  margin-right: 30px;
}

.mod-cmn-flow-num {
  margin-right: 20px;
  line-height: 1.05;
  font-size: 50px;
}

.mod-cmn-flow-txt {
  font-size: 16px;
}

/* mod-cmn-complete
---------------------------------------------------------- */
.mod-cmn-complete {
  position: relative;
  width: 332px;
  height: 332px;
  border: 10px solid #e0ded5;
  margin: 0 auto;
  border-radius: 50%;
  background-color: #faf8f0;
}

/* mod-cmn-registration
---------------------------------------------------------- */
.mod-cmn-registration {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  width: 1360px;
  margin: 0 auto;
}

.mod-cmn-registration-item {
  width: 50%;
  padding: 0 60px;
}

.mod-cmn-registration-item:first-child {
  border-right: 1px solid #e0ded5;
}

.mod-cmn-registration-item:only-child {
  width: 100%;
  border-right: none;
}

.mod-cmn-registration-item-center {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.mod-cmn-registration-recommend {
  margin-top: 40px;
  margin-bottom: 30px;
}

.mod-cmn-registration-ttl {
  text-align: center;
  margin-bottom: 20px;
  line-height: 1.75;
  font-size: 26px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-registration-btn {
  text-align: center;
}

.mod-cmn-registration-border {
  border-bottom: solid #e0ded5 1px;
  margin-top: 35px;
  margin-bottom: 34px;
}

.mod-cmn-registration-birth-day {
  margin-left: 20px;
}

.mod-cmn-registration-birth-day-text::placeholder {
  color: #ccc;
}

.mod-cmn-registration-birth-day-text:-ms-input-placeholder {
  color: #ccc;
}

.mod-cmn-registration-birth-day-text::-ms-input-placeholder {
  color: #ccc;
}

.mod-cmn-registration-birth-year-text::placeholder {
  color: #ccc;
}

.mod-cmn-registration-birth-year-text:-ms-input-placeholder {
  color: #ccc;
}

.mod-cmn-registration-birth-year-text::-ms-input-placeholder {
  color: #ccc;
}

.mod-cmn-registration-option-title {
  display: none;
}

/* mod-cmn-registration
---------------------------------------------------------- */
.mod-cmn-phone {
  overflow: hidden;
  margin-bottom: 80px;
}

.mod-cmn-phone-ico {
  float: left;
  margin-right: 10px;
}

.mod-cmn-phone-body {
  padding-left: 30px;
  overflow: hidden;
}

.mod-cmn-phone-detail {
  position: relative;
  padding: 23px 30px;
  background-color: #44bac7;
  border-radius: 6px;
}

.mod-cmn-phone-detail:after {
  left: -30px;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(68, 186, 199, 0);
  border-right-color: #44bac7;
  border-width: 30px;
  margin-top: -15px;
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg);
}

.mod-cmn-phone-txt {
  line-height: 1.75;
  color: #fff;
}

/* mod-cmn-required
---------------------------------------------------------- */
.mod-cmn-required {
  display: inline-block;
  padding: 6px 14px;
  background-color: #ff5a5f;
  border-radius: 6px;
  line-height: 1.05;
  font-size: 14px;
  font-weight: normal;
  white-space: nowrap;
  color: #fff;
}

.registration-category .mod-cmn-required {
  border-radius: 4px;
}

/* mod-cmn-total
---------------------------------------------------------- */
.mod-cmn-total {
  display: table;
  width: 600px;
}

.mod-cmn-total-wrap {
  float: left;
}

.mod-cmn-total-wrap + .mod-cmn-select-option {
  margin-top: 39px;
}

.mod-cmn-total-item {
  width: 50%;
  padding: 20px;
  display: table-cell;
  vertical-align: middle;
  background-color: #fff;
  text-align: center;
  font-size: 26px;
}

.mod-cmn-total-item-ttl {
  background-color: #44bac7;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
}

/* mod-cmn-detail
---------------------------------------------------------- */
.mod-cmn-detail {
  padding-bottom: 100px;
  border-bottom: 1px solid #e0ded5;
}

.mod-cmn-detail + .box-cmn-entry {
  margin-top: 50px;
}

/* mod-cmn-response
---------------------------------------------------------- */
.mod-cmn-response {
  position: absolute;
  top: 0;
  margin-left: 955px;
  z-index: 10;
  width: 55px;
  padding: 24px 13px;
  border-radius: 55px;
  background-color: #44bac7;
  text-align: center;
  line-height: 1.2;
  font-size: 18px;
  font-weight: bold;
  color: #fff;
}

.mod-cmn-response-num-01 {
  display: block;
  padding-bottom: 5px;
  margin-bottom: 5px;
  border-bottom: 1px solid #fff;
  line-height: 1.05;
  font-size: 20px;
  color: #ffff33;
}

.mod-cmn-response-num-02 {
  display: block;
  margin-bottom: 12px;
  line-height: 1.05;
  font-size: 20px;
}

/* mod-cmn-recommend
---------------------------------------------------------- */
.mod-cmn-recommend {
  margin-top: 80px;
  margin-bottom: 33px;
  text-align: center;
  font-size: 22px;
  font-weight: bold;
  color: #474747;
}

.mod-cmn-recommend:first-child {
  margin-top: 0;
}

.mod-cmn-recommend:last-child {
  margin-bottom: 0;
}

.contents-in + .mod-cmn-recommend {
  margin-top: 40px;
}

.mod-cmn-recommend-in {
  position: relative;
  display: inline-block;
  padding-left: 46px;
  padding-right: 46px;
}

.mod-cmn-recommend-in:before, .mod-cmn-recommend-in:after {
  content: '';
  position: absolute;
  top: 7px;
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8454px;
  width: 24px;
  height: 52px;
}

.mod-cmn-recommend-in:before {
  left: 0;
}

.mod-cmn-recommend-in:after {
  right: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

/* mod-cmn-insert
---------------------------------------------------------- */
.mod-cmn-insert {
  margin-top: 60px;
  border-top: 1px solid #e0ded5;
  border-bottom: 1px solid #e0ded5;
  padding: 24px 0;
  text-align: center;
  letter-spacing: -.5em;
  font-size: 16px;
}

.mod-cmn-insert:first-child {
  margin-top: 0;
}

.mod-cmn-insert-ttl, .mod-cmn-insert-txt {
  display: inline-block;
  letter-spacing: normal;
  margin: 0 18px;
}

.mod-cmn-insert-ttl {
  font-weight: bold;
  color: #44bac7;
}

/* mod-cmn-side
---------------------------------------------------------- */
.mod-cmn-side-item {
  margin-bottom: 60px;
}

.mod-cmn-side-item:last-child {
  margin-bottom: 0;
}

.mod-cmn-side-ttl {
  margin-bottom: 20px;
  line-height: 1.05;
  border-bottom: 4px solid #44bac7;
  padding-bottom: 18px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-pickup .mod-cmn-side-ttl {
  margin-bottom: 30px;
}

.mod-cmn-side-bnr {
  margin-bottom: 30px;
}

.mod-cmn-side-bnr:last-child {
  margin-bottom: 0;
}

.mod-cmn-side-bnr-link {
  display: block;
  position: relative;
  width: 240px;
  height: 130px;
  overflow: hidden;
  border-radius: 8px;
}

.mod-cmn-side-bnr-img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  max-width: 200%;
  max-height: 200%;
  width: 100%;
  height: auto;
}

.mod-cmn-side-cate-list {
  border: 1px solid #e0ded5;
  border-radius: 5px;
  background-color: #fff;
  padding: 20px;
}

.mod-cmn-side-cate-list-ttl {
  font-size: 18px;
  text-align: center;
  color: #44bac7;
  font-weight: bold;
  padding-bottom: 17px;
}

.mod-cmn-side-cate-list-item {
  padding: 4.5px 0px;
  display: block;
}

.mod-cmn-side-item-more {
  font-size: 16px;
  text-align: center;
  margin-top: 20px;
}

/* mod-cmn-ranking
---------------------------------------------------------- */
.mod-cmn-ranking-item {
  padding-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e0ded5;
}

.mod-cmn-ranking-item:first-child {
  padding-top: 0;
}

.mod-cmn-ranking-fig {
  display: block;
  margin-bottom: 15px;
  position: relative;
  width: 240px;
  height: 160px;
  overflow: hidden;
}

.mod-cmn-ranking-fig:before {
  display: block;
  position: absolute;
  width: 30px;
  height: 30px;
  left: 10px;
  top: 0;
  padding-top: 4px;
  line-height: 1.05;
  text-align: center;
  border-radius: 0 0 50% 50%;
  color: #fff;
  font-size: 18px;
  font-family: "Roboto Slab", serif;
  font-weight: bold;
  z-index: 2;
}

.mod-cmn-ranking-item:nth-child(1) .mod-cmn-ranking-fig:before {
  content: '1';
  background-color: #ffb237;
}

.mod-cmn-ranking-item:nth-child(2) .mod-cmn-ranking-fig:before {
  content: '2';
  background-color: #1e97cd;
}

.mod-cmn-ranking-item:nth-child(3) .mod-cmn-ranking-fig:before {
  content: '3';
  background-color: #c08b68;
}

.mod-cmn-ranking-item:nth-child(4) .mod-cmn-ranking-fig:before {
  content: '4';
  background-color: #474747;
}

.mod-cmn-ranking-item:nth-child(5) .mod-cmn-ranking-fig:before {
  content: '5';
  background-color: #474747;
}

.mod-cmn-ranking-txt {
  font-size: 14px;
}

.mod-cmn-ranking-link {
  text-decoration: underline;
}

/* mod-cmn-tags
---------------------------------------------------------- */
.mod-cmn-tags {
  margin-top: 8px;
  margin-left: -10px;
  letter-spacing: -.5em;
}

.mod-cmn-tags-item {
  display: inline-block;
  margin: 10px 0 0 10px;
  letter-spacing: normal;
}

.mod-cmn-tags-in {
  display: block;
  padding: 6px 12px;
  line-height: 1.05;
  border: 1px solid #44bac7;
  border-radius: 5px;
  background-color: #fff;
  color: #44bac7;
  text-align: center;
  font-size: 14px;
}

/* mod-cmn-topics-category
---------------------------------------------------------- */
.mod-cmn-topics-category {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin: -20px -10px 0;
}

.mod-cmn-topics-category-item {
  width: 220px;
  margin-top: 15px;
  padding: 0 10px;
}

.mod-cmn-topics-category-label {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  padding: 8px 12px 9px;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #fff;
  border: 1px solid #e0ded5;
  border-radius: 8px;
}

.mod-cmn-topics-category-label:hover {
  background-color: #e0ded5;
}

.mod-cmn-topics-category-label.is-active {
  background-color: #44bac7;
  border-color: #44bac7;
  color: #fff;
}

.mod-cmn-topics-category-label-in {
  display: block;
  text-align: center;
  font-size: 14px;
}

/* mod-cmn-post
---------------------------------------------------------- */
.mod-cmn-post {
  overflow: hidden;
}

.mod-cmn-post-fig {
  float: left;
  position: relative;
  width: 210px;
  height: 140px;
  overflow: hidden;
}

.mod-cmn-post-txt {
  padding-left: 240px;
  font-size: 22px;
  color: #474747;
}

.mod-cmn-post-tags {
  padding-left: 240px;
  padding-right: 120px;
}

.mod-cmn-post-date {
  position: absolute;
  right: 30px;
  margin-top: -1.5em;
  font-size: 16px;
  color: #999;
}

/* mod-cmn-article
---------------------------------------------------------- */
.mod-cmn-article {
  position: relative;
  border: 1px solid #e0ded5;
  padding: 40px 59px;
  border-radius: 8px;
  line-height: 1.75;
  background-color: #fff;
}

.mod-cmn-article-ttl {
  margin-bottom: 30px;
  line-height: 1.75;
  font-weight: bold;
  font-size: 34px;
}

.mod-cmn-article-sub {
  position: relative;
  overflow: hidden;
  margin-bottom: 50px;
  padding-right: 110px;
}

.mod-cmn-article-sns {
  position: absolute;
  top: 0;
  margin-left: -90px;
}

.mod-cmn-article-body .mod-cmn-article-sns {
  display: none;
}

.mod-cmn-article-sns-item:first-child {
  margin-top: 50px;
}

.mod-cmn-article-tags {
  margin-top: -8px;
}

.mod-cmn-article-date {
  position: absolute;
  right: 0;
  top: 0;
  margin-left: 10px;
  text-align: right;
  color: #999;
}

.mod-cmn-article-hero {
  text-align: center;
}

.mod-cmn-article-read {
  margin-top: 30px;
}

.mod-cmn-article-body h3 {
  position: relative;
  margin-top: 70px;
  padding-left: 20px;
  margin-bottom: 46px;
  font-size: 20px;
  font-weight: bold;
}

.mod-cmn-article-body h3:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 5px;
  height: 100%;
  background-color: #44bac7;
  border-radius: 6px;
}

.mod-cmn-article-body h3:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: -16px;
  width: 100%;
  height: 16px;
  background-color: #fff;
  border-bottom: 1px solid #44bac7;
}

.mod-cmn-article-body p,
.mod-cmn-article-body div {
  margin-top: 30px;
}

.mod-cmn-article-body p:first-child,
.mod-cmn-article-body div:first-child {
  margin-top: 0;
}

.mod-cmn-article-body div {
  text-align: center;
}

.mod-cmn-article-body img + p {
  margin-top: 15px;
  text-align: left;
  font-size: 14px;
  color: #666;
}

.mod-cmn-article-body blockquote {
  margin-top: 30px;
  font-style: normal;
  word-break: break-all;
}

.mod-cmn-article-body a {
  text-decoration: underline;
}

.mod-cmn-article-aside {
  margin-top: 80px;
}

.mod-cmn-article-aside:first-child {
  margin-top: 0;
}

/* mod-cmn-support
---------------------------------------------------------- */
.mod-cmn-support {
  display: none;
  text-align: center;
}

.mod-cmn-support-box {
  width: 360px;
  margin: 16px auto;
  text-align: center;
  padding: 12px 20px;
  border: 1px solid #e0ded5;
  font-size: 30px;
  border-radius: 8px;
  background-color: #fff;
}

.mod-cmn-support-box:first-child {
  margin-top: 0;
}

.mod-cmn-support-box:last-child {
  margin-bottom: 0;
}

.mod-cmn-support-box a {
  color: #474747;
}

/* mod-cmn-service
---------------------------------------------------------- */
.mod-cmn-service {
  margin: 40px -55px 0;
  overflow: hidden;
}

.mod-cmn-service-wide {
  width: 870px;
  margin-left: auto;
  margin-right: auto;
}

.mod-cmn-service-item {
  position: relative;
  float: left;
  width: 33.3%;
  text-align: center;
}

.mod-cmn-service-item:after {
  content: '';
  display: block;
  position: absolute;
  left: -9px;
  top: 90px;
  background-image: url(../img/common/sprite.png);
  background-position: 0px -530px;
  width: 18px;
  height: 22px;
}

.mod-cmn-service-item:first-child:after {
  content: none;
}

.mod-rem-service-item {
  position: relative;
  float: left;
  width: 33.3%;
  text-align: center;
}

.mod-rem-service-item:after {
  content: '';
  display: block;
  position: absolute;
  left: -9px;
  top: 90px;
  background-image: url(../img/common/icon_arrow_green.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 18px;
  height: 22px;
}
.mod-rem-service-item:first-child:after {
  content: none;
}

.mod-cmn-service-mark {
  position: relative;
  width: 180px;
  height: 180px;
  margin: 0 auto;
  border-radius: 50%;
  border: 2px solid #e0ded5;
  background-color: #fff;
}

.mod-cmn-service-ttl {
  margin-top: 30px;
  line-height: 1.05;
  font-size: 24px;
  font-weight: bold;
  color: #44bac7;
}

/* mod-cmn-operation
---------------------------------------------------------- */
.mod-cmn-operation {
  margin: 60px 0;
  padding: 39px;
  background-color: #fff;
  border: 1px solid #e0ded5;
  border-radius: 8px;
}

.mod-cmn-operation:first-child {
  margin-top: 0;
}

.mod-cmn-operation-wrap {
  margin-top: 50px;
}

.mod-cmn-operation-ttl {
  position: relative;
  margin-top: 2px;
  margin-bottom: 37px;
  padding-left: 86px;
  font-size: 20px;
  font-weight: bold;
}

.mod-cmn-operation-ttl-num {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-block;
  width: 70px;
  height: 34px;
  line-height: 34px;
  margin-top: -2px;
  text-align: center;
  border-radius: 35px;
  background-color: #44bac7;
  font-size: 20px;
  font-weight: normal;
  color: #fff;
}

.mod-cmn-operation-item {
  border-bottom: 1px solid #e0ded5;
  padding-bottom: 39px;
  margin-bottom: 39px;
  overflow: hidden;
}

.mod-cmn-operation-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.mod-cmn-operation-item-fig {
  position: relative;
  float: left;
  margin-right: 40px;
}

.mod-cmn-operation-item-fig:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 1px solid #e0ded5;
}

.mod-cmn-operation-item-body {
  overflow: hidden;
}

.mod-cmn-operation-item-aside {
  margin-top: 50px;
}

.mod-cmn-operation-item-aside:first-child {
  margin-top: 0;
}

.mod-cmn-operation-item-aside-ttl {
  margin-bottom: 12px;
  font-weight: bold;
  color: #44bac7;
}

.mod-cmn-operation-item-aside-list {
  margin-top: 12px;
}

.mod-cmn-operation-item-aside-list:first-child {
  margin-top: 0;
}

/* ==========================================================
 text
========================================================== */
/* txt-cmn
---------------------------------------------------------- */
.txt-cmn {
  margin-top: 20px;
  margin-bottom: 20px;
  line-height: 1.75;
}

.txt-cmn:first-child {
  margin-top: 0;
}

.txt-cmn:last-child {
  margin-bottom: 0;
}

.required-prf-info ul.txt-cmn {
  margin-top: 49px;
  margin-bottom: 12px;
}

.registration-terms ul.txt-cmn {
  margin-top: 48px;
}

.registration-terms ul.txt-cmn label,
.required-prf-info ul.txt-cmn label {
  font-weight: bold;
  font-size: 18px;
}

.txt-cmn-short {
  margin-top: 4px;
  margin-bottom: 4px;
  line-height: 1.75;
}

.txt-cmn-short:first-child {
  margin-top: 0;
}

.txt-cmn-short:last-child {
  margin-bottom: 0;
}

.txt-cmn-middle {
  margin-top: 14px;
  margin-bottom: 14px;
  line-height: 1.75;
}

.txt-cmn-middle:first-child {
  margin-top: 0;
}

.txt-cmn-middle:last-child {
  margin-bottom: 0;
}

.txt-cmn-top {
  margin-top: 20px;
  line-height: 1.75;
}

.txt-cmn-top:first-child {
  margin-top: 0;
}

/* txt-cmn-small
---------------------------------------------------------- */
.txt-cmn-small {
  font-size: 14px;
}

/* txt-cmn-sub
---------------------------------------------------------- */
.txt-cmn-sub {
  font-size: 12px;
  font-weight: normal;
}

/* txt-cmn-get
---------------------------------------------------------- */
.txt-cmn-get {
  color: #ff5a5f;
}

.txt-cmn-get-num {
  font-size: 40px;
}

.txt-cmn-get-other {
  margin: 0 4px;
  font-size: 18px;
  color: #999;
}

.txt-cmn-get-unit-point {
  margin-left: 5px;
  font-size: 24px;
  color: #44bac7;
}

.txt-cmn-get-unit-yen {
  font-size: 20px;
  color: #44bac7;
}

/* txt-cmn-mark
---------------------------------------------------------- */
.txt-cmn-mark {
  position: relative;
  display: inline-block;
  padding-left: 28px;
}

.txt-cmn-mark-ico {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}

/* txt-cmn-complete
---------------------------------------------------------- */
.txt-cmn-complete {
  margin-top: 40px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

.txt-cmn-complete:first-child {
  margin-top: 0;
}

/* txt-inquiry-complete
---------------------------------------------------------- */
.txt-inquiry-complete {
  margin-top: 0px;
  font-size: 20px;
  text-align: left;
  font-weight: bold;
}

.txt-inquiry-complete:first-child {
  text-align: center;
  margin-bottom: 10px;
}

/* txt-cmn-message
---------------------------------------------------------- */
.txt-cmn-message {
  padding: 16px 12px;
  line-height: 1.05;
  text-align: center;
  font-size: 16px;
}

.txt-cmn-message-num {
  margin-left: 10px;
  font-size: 32px;
  color: #ff5a5f;
}

.txt-cmn-message-unit {
  margin-left: 10px;
  color: #ff5a5f;
}

/* txt-cmn-indent
---------------------------------------------------------- */
.txt-cmn-indent {
  text-indent: -1em;
  margin-left: 1em;
}

/* txt-cmn-error
---------------------------------------------------------- */
.txt-cmn-error {
  display: none;
  margin-top: 6px;
  line-height: 1.75;
  color: #ff5a5f;
}

.txt-cmn-error:first-child {
  margin-top: 0;
}

.txt-cmn-warning {
  margin-top: 6px;
  line-height: 1.75;
  color: #ff5a5f;
}

/* txt-cmn-notification
---------------------------------------------------------- */
.txt-cmn-notification {
  border-bottom: 1px solid #dcdcdc;
  padding-bottom: 30px;
}

/* ==========================================================
 form
========================================================== */
/* form-cmn
---------------------------------------------------------- */
.form-cmn,
input.form-cmn {
  height: 56px;
}

/* form-cmn-check
---------------------------------------------------------- */
.form-cmn-check {
  display: none;
}

.form-cmn-check + label {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 100%;
  position: relative;
  padding: 15px 15px 15px 60px;
  background-color: #fff;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  font-size: 16px;
  color: #808080;
}

.form-cmn-check + label:before {
  content: '';
  position: absolute;
  left: 20px;
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  transition: 0.3s;
}

.form-cmn-check:checked + label {
  color: #474747;
}

.form-cmn-check[type="radio"] + label:before {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #e0ded5;
  border: 6px solid #e0ded5;
}

.form-cmn-check[type="radio"]:checked + label:before {
  background-color: #fff;
  border-color: #ff5a5f;
}

.form-cmn-check[type="checkbox"] + label:before {
  width: 22px;
  height: 22px;
  background-color: #e0ded5;
  z-index: 1;
  border-radius: 6px;
}

.form-cmn-check[type="checkbox"] + label:after {
  content: '';
  position: absolute;
  top: -2px;
  bottom: 0;
  left: 23px;
  width: 16px;
  height: 8px;
  border: 3px solid #fff;
  border-top: none;
  border-right: none;
  margin: auto;
  background: transparent;
  -webkit-transform: rotate(-50deg);
          transform: rotate(-50deg);
  z-index: 2;
  opacity: 0;
}

.form-cmn-check[type="checkbox"]:checked + label:before {
  background-color: #ff5a5f;
}

.form-cmn-check[type="checkbox"]:checked + label:after {
  opacity: 1;
}

.form-cmn-check:disabled + label {
  background-color: #e0ded5;
}

.form-cmn-check:disabled + label:before {
  background-color: #f1efe8;
}

.form-cmn-check:disabled + label:before {
  border-color: #f1efe8;
}

.form-cmn-check-simple + label {
  padding-top: 0;
  padding-bottom: 0;
  background: none;
  border: none;
}

.form-cmn-check-input-required {
  text-align: right;
  margin-top: -25px;
  font-size: 16px;
}

/* form-cmn-check-single
---------------------------------------------------------- */
.form-cmn-check-single {
  display: none;
}

.form-cmn-check-single + label {
  display: inline-block;
  position: relative;
  padding-left: 28px;
  color: #808080;
}

.form-cmn-check-single + label:before, .form-cmn-check-single + label:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  transition: 0.3s;
}

.form-cmn-check-single + label + input {
  margin-left: 17px;
  background-color: #e0ded5;
  pointer-events: none;
}

.form-cmn-check-single:checked + label {
  color: #474747;
}

.form-cmn-check-single:checked + label + input {
  background-color: #fff;
  pointer-events: auto;
}

.form-cmn-check-single:disabled + label + input {
  background-color: #e0ded5;
}

.form-cmn-check-single[type="radio"] + label:before {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid #e0ded5;
}

.form-cmn-check-single[type="radio"] + label:after {
  left: 4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #fff;
}

.form-cmn-check-single[type="radio"]:checked + label:before {
  border-color: #ff5a5f;
}

.form-cmn-check-single[type="radio"]:checked + label:after {
  background-color: #ff5a5f;
}

.form-cmn-check-single[type="checkbox"] + label:before {
  width: 20px;
  height: 20px;
  background-color: #fff;
  border: 1px solid #e0ded5;
  z-index: 1;
  border-radius: 5px;
}

.form-cmn-check-single[type="checkbox"] + label:after {
  left: 4px;
  bottom: 2px;
  width: 12px;
  height: 6px;
  border: 1px solid #ff5a5f;
  border-top: none;
  border-right: none;
  background: transparent;
  -webkit-transform: rotate(-50deg);
          transform: rotate(-50deg);
  z-index: 2;
  opacity: 0;
}

.form-cmn-check-single[type="checkbox"]:checked + label:before {
  border: 1px solid #ff5a5f;
}

.form-cmn-check-single[type="checkbox"]:checked + label:after {
  opacity: 1;
}

.form-cmn-check-single:disabled + label:before,
.form-cmn-check-single:disabled + label:after {
  background-color: #e0ded5;
}

.form-cmn-check-single:disabled:not(:checked) + label:before {
  border-color: #e0ded5;
}

.form-cmn-check-single-top + label:before, .form-cmn-check-single-top + label:after {
  bottom: auto;
}

.form-cmn-check-single-top[type="radio"] + label:after {
  top: 4px;
  bottom: auto;
}

.form-cmn-check-single-top[type="checkbox"] + label:after {
  top: 6px;
  bottom: auto;
}

/* form-cmn-select
---------------------------------------------------------- */
.form-cmn-select-strong {
  border: 1px solid #44bac7;
  box-shadow: inset 0 -2px 0 0 rgba(4, 0, 0, 0.1);
  color: #44bac7;
}

/* form-cmn-lists
---------------------------------------------------------- */
.form-cmn-lists-wrap {
  display: block;
  height: 242px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  font-size: 14px;
  background: #fff;
  overflow-x: hidden;
  overflow-y: auto;
}

.form-cmn-lists-wrap.is-disabled {
  background-color: #e0ded5;
}

.form-cmn-lists-wrap.is-disabled .form-cmn-lists-item {
  pointer-events: none;
}

.form-cmn-lists-item {
  padding: 10px 19px;
  line-height: 1.45;
}

.form-cmn-lists-item:hover, .form-cmn-lists-item.is-active {
  background-color: #ff5a5f;
  color: #fff;
}

.js-narrows-target .form-cmn-lists-item {
  display: none;
}

.form-cmn-lists + select {
  display: none;
}

/* form-cmn-textarea
---------------------------------------------------------- */
.form-cmn-textarea {
  height: 95px;
}

.form-cmn-textarea-middle {
  height: 195px;
}

.form-cmn-textarea-wrap {
  position: relative;
}

/* form-cmn-file
---------------------------------------------------------- */
.form-cmn-file {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.form-cmn-file-item {
  display: none;
  position: relative;
  overflow: hidden;
  margin-top: 20px;
}

.form-cmn-file-item:first-child {
  margin-top: 0;
}

.form-cmn-file-item.is-active {
  display: block;
}

.form-cmn-file-item.is-last.is-active + .form-cmn-file-btn-add {
  display: none;
}

.form-cmn-file-detail {
  position: relative;
}

.form-cmn-file-input {
  display: inline-block;
  width: 660px;
  height: 40px;
  padding: 0 216px 0 16px;
  line-height: 40px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background-color: #fff;
  outline: none;
  vertical-align: middle;
  background-color: #e0ded5;
  overflow: hidden;
  word-break: break-all;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.form-cmn-file-input-wl{
  width: 100%;
}

.form-cmn-file-input-pstcd {
  width: 100%;
}

.form-cmn-file-input-err {
  background-color: #ffcdcf;
}

.form-cmn-file-input-wrap {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.form-cmn-file-input-wrap + .form-cmn-file-input-wrap {
  margin-top: 10px;
}

.form-cmn-file-input-wrap .thmbnl-selector-wrapp {
  position: relative;
  width: 500px;
}

.thmbnl-upload .form-cmn-file-item {
  margin-top: 0;
}

.thmbnl-upload .form-cmn-file-input {
  width: 500px;
}

.thmbnl-selector-txt {
  width: 170px;
  line-height: 40px;
}

.form-cmn-file-close {
  position: absolute;
  right: 12px;
  top: 9px;
  z-index: 11;
}

.extens-input .form-cmn-file-close,
.complete-contente .form-cmn-file-close {
  right: 0px;
}

.form-cmn-file-btn-add, .form-cmn-file-btn-select {
  display: none;
}

.form-cmn-file-btn-add.is-active, .form-cmn-file-btn-select.is-active {
  display: block;
}

.form-cmn-file-btn-add {
  margin-top: 15px;
}

.form-cmn-file-center {
  width: 660px;
  margin: 0 auto;
}

.form-cmn-file-center .form-cmn-file-btn {
  text-align: center;
  margin-top: 20px;
}

.form-cmn-file-again {
  position: absolute;
  right: 45px;
  top: 6px;
  z-index: 1;
}

.form-cmn-file-wrap.wl-upload,
.form-cmn-file-wrap.postCode-upload {
  width: 552px;
}

.form-cmn-file-add-txt {
  color: #44bac7;
}

/* form-cmn-count
---------------------------------------------------------- */
.form-cmn-count {
  display: inline-block;
  position: absolute;
  right: 17px;
  bottom: 10px;
  line-height: 1.05;
  font-size: 14px;
  color: #808080;
}

:disabled + .form-cmn-count {
  background-color: #e0ded5;
}

.extens-explain-input .form-cmn-count {
  display: inline-block;
  position: absolute;
  right: 25px;
  bottom: 20px;
  line-height: 1.05;
  font-size: 14px;
}

:read-only + .form-cmn-count {
  background-color: #e0ded5;
}

/* form-cmn-message
---------------------------------------------------------- */
.form-cmn-message {
  height: 260px;
  padding-bottom: 98px;
  border: 1px solid #44bac7;
  border-radius: 12px 0 12px 12px;
  background-color: #fff;
  color: #474747;
}

/* IE11 */
@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop, .form-cmn-message {
    border-radius: 0;
  }
}

/* form-cmn-unit
---------------------------------------------------------- */
.form-cmn-unit {
  margin: 0 14px;
}

.form-cmn-unit:last-child {
  margin-right: 0;
}

/* form-cmn-mark
---------------------------------------------------------- */
.form-cmn-mark {
  float: left;
  margin-top: 4px;
}

.form-cmn-mark + .form-cmn-mark-detail {
  padding-left: 100px;
}

.table-cmn-form-cell-in .form-cmn-mark + .form-cmn-mark-detail {
  padding-left: 70px;
}

.table-cmn-form-cell-in .form-cmn-mark-wide {
  margin-left: 100px;
}

.table-cmn-form-cell-in .form-cmn-mark-wide + .form-cmn-mark-detail {
  padding-left: 170px;
}

.form-cmn-mark-detail + * {
  clear: both;
}

.form-cmn-mark-btn {
  float: right;
}

.form-cmn-mark-btn + * {
  overflow: hidden;
}

/* form-cmn-add
---------------------------------------------------------- */
.form-cmn-add-list {
  position: relative;
  margin-top: 10px;
}

.form-cmn-add-list:first-child {
  margin-top: 0;
}

.form-cmn-add-list:only-child .js-delete {
  display: none;
}

.form-cmn-add-input, .form-cmn-add-input[type=text] {
  padding-right: 54px;
}

.form-cmn-add-close {
  position: absolute;
  right: 20px;
  top: 17px;
}

:disabled + .form-cmn-add-close {
  pointer-events: none;
}

.form-cmn-add-close.is-disabled{
  pointer-events: none;
}

.form-cmn-add-close-expansion {
  position: absolute;
  right: -13px;
  top: -10px;
}

:disabled + .form-cmn-add-close-expansion {
  pointer-events: none;
}

.form-cmn-add-close-expansion.is-disabled{
  pointer-events: none;
}

.form-cmn-add-btn {
  margin-top: 10px;
}

/* form-cmn-counter
---------------------------------------------------------- */
.form-cmn-counter {
  counter-reset: number 0;
}

.form-cmn-counter > * {
  position: relative;
}

.form-cmn-counter > *:before {
  counter-increment: number 1;
  content: counter(number) ".";
  position: absolute;
  left: 22px;
  top: 19px;
  line-height: 1.05;
  font-size: 16px;
  font-weight: bold;
  color: #44bac7;
}

.form-cmn-counter.chat-counter > *:before {
  content: counter(number, upper-alpha) ".";
  position: absolute;
  left: 22px;
  top: 19px;
  line-height: 1.05;
  font-size: 16px;
  font-weight: bold;
  color: #44bac7;
}

.form-cmn-counter [type=text] {
  padding-left: 54px;
}

/* is-error
---------------------------------------------------------- */
input.is-error,
textarea.is-error,
select.is-error,
.form-cmn-check.is-error + label,
.form-cmn-check-single:checked + label + input.is-error,
.form-cmn-check-single.is-error + label:before,
.form-cmn-check-single.is-error + label:after {
  background-color: #ffcdcf;
}

/* ==========================================================
 icon
========================================================== */
/* icon
---------------------------------------------------------- */
[class*="ico-cmn"] {
  display: inline-block;
  vertical-align: middle;
}

.ico-cmn {
  /* active */
  /* plus */
  /* alt */
  /* txt */
}

.ico-cmn-logo {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3844px;
  width: 222px;
  height: 34px;
}

.ico-cmn-home {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3202px;
  width: 30px;
  height: 30px;
}

.ico-cmn-home-small {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3178px;
  width: 14px;
  height: 14px;
}

.ico-cmn-link {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -356px;
  width: 16px;
  height: 28px;
}

.ico-cmn-flow {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -478px;
  width: 16px;
  height: 22px;
}

.ico-cmn-keep {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3454px;
  width: 32px;
  height: 30px;
}

.ico-cmn-message {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4542px;
  width: 32px;
  height: 24px;
}

.ico-cmn-message-small {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4706px;
  width: 20px;
  height: 16px;
}

.ico-cmn-menu {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4370px;
  width: 32px;
  height: 26px;
}

.ico-cmn-guide {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2562px;
  width: 32px;
  height: 28px;
}

.ico-cmn-breadcrumb {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -562px;
  width: 8px;
  height: 12px;
}

.ico-cmn-pagetop {
  background-image: url("../img/common/sprite.png");
  background-position: 0px -2569px;
  width: 50px;
  height: 50px;
  background-size: 140px 5255px;
}

.ico-cmn-prev {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -5916px;
  width: 10px;
  height: 18px;
}

.ico-cmn-prev-link {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -5990px;
  width: 10px;
  height: 18px;
}

.ico-cmn-prev-pager {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6018px;
  width: 22px;
  height: 16px;
}

.ico-cmn-prev-pager-one {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6082px;
  width: 12px;
  height: 16px;
}

.ico-cmn-next {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4794px;
  width: 10px;
  height: 18px;
}

.ico-cmn-next-pager {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4868px;
  width: 22px;
  height: 16px;
}

.ico-cmn-next-pager-one {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4932px;
  width: 12px;
  height: 16px;
}

.ico-cmn-yen {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -10172px;
  width: 22px;
  height: 22px;
}

.ico-cmn-yen-middle {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -10242px;
  width: 30px;
  height: 30px;
}

.ico-cmn-yen-large {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -10242px;
  width: 30px;
  height: 30px;
}

.ico-cmn-yen-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -10334px;
  width: 50px;
  height: 50px;
}

.ico-cmn-d {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1134px;
  width: 16px;
  height: 20px;
}

.ico-cmn-d-point {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1164px;
  width: 22px;
  height: 22px;
}

.ico-cmn-d-point-middle {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1234px;
  width: 24px;
  height: 24px;
}

.ico-cmn-d-point-large {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1234px;
  width: 24px;
  height: 24px;
}

.ico-cmn-d-point-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1312px;
  width: 42px;
  height: 42px;
}

.ico-cmn-faq {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2256px;
  width: 30px;
  height: 28px;
}

.ico-cmn-load {
  background-image: url(../img/common/more_read.png);
  background-size: 100%;
  background-repeat: no-repeat;
  width: 27px;
  height: 25px;
}

.ico-cmn-search-work {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -7030px;
  width: 20px;
  height: 20px;
}

.ico-cmn-star, .ico-cmn-star-large, .ico-cmn-star-work-link {
  background-image: url(../img/common/star_icon_gray.png);
  width: 30px;
  height: 30px;
  transition: 0s;
  background-size: 30px 30px;
}

.ico-cmn-star-work-link {
  right: 40px;
}

.ico-cmn-star-work-link-search {
  top: 0px;
  right: 0px;
}

.ico-cmn-star:hover, .ico-cmn-star.is-active, .ico-cmn-star-large:hover, .ico-cmn-star-large.is-active, .ico-cmn-star-work-link:hover, .ico-cmn-star-work-link.is-active {
  background-image: url(../img/common/star_icon_deep_yellow.png);
  width: 30px;
  height: 30px;
  background-size: 30px 30px;
}

.ico-cmn-questionnaire {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6556px;
  width: 46px;
  height: 70px;
}

.ico-cmn-questionnaire-small {
  background-image: url("../img/common/sprite.png");
  background-position: 0px -3318px;
  width: 29px;
  height: 44px;
  background-size: 140px 5255px;
}

.ico-cmn-sentence {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -7060px;
  width: 56px;
  height: 60px;
}

.ico-cmn-sentence-small {
  background-image: url("../img/common/sprite.png");
  background-position: 0px -3565px;
  width: 34px;
  height: 37px;
  background-size: 140px 5255px;
}

.ico-cmn-data {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1472px;
  width: 52px;
  height: 62px;
}

.ico-cmn-data-small {
  background-image: url("../img/common/sprite.png");
  background-position: 0px -772px;
  width: 35px;
  height: 42px;
  background-size: 140px 5255px;
}

.ico-cmn-picture {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -5586px;
  width: 62px;
  height: 66px;
}

.ico-cmn-picture-small {
  background-image: url("../img/common/sprite.png");
  background-position: 0px -2831px;
  width: 42px;
  height: 45px;
  background-size: 140px 5255px;
}

.ico-cmn-other {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4958px;
  width: 40px;
  height: 70px;
}

.ico-cmn-other-small {
  background-image: url("../img/common/sprite.png");
  background-position: 0px -2519px;
  width: 25px;
  height: 45px;
  background-size: 140px 5255px;
}

.ico-cmn-mail {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3942px;
  width: 20px;
  height: 16px;
}

.ico-cmn-mail-fill {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4002px;
  width: 16px;
  height: 12px;
}

.ico-cmn-wallet, .ico-cmn-wallet-small {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9422px;
  width: 122px;
  height: 106px;
}

.ico-cmn-show {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8344px;
  width: 22px;
  height: 22px;
}

.ico-cmn-delete {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1638px;
  width: 18px;
  height: 18px;
}

.ico-cmn-delete-check {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1718px;
  width: 22px;
  height: 30px;
}

:checked + .ico-cmn-delete-check {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1810px;
  width: 22px;
  height: 30px;
}

.ico-cmn-close {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -674px;
  width: 14px;
  height: 14px;
}

.ico-cmn-work-hidden {
  background-image: url(../img/common/work_hidden_icon.png);
  width: 12px;
  height: 12px;
  background-size: 100%;
  margin-right: 10px;
  background-repeat: no-repeat;
}

.ico-cmn-close-text {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -728px;
  width: 16px;
  height: 16px;
}

.ico-cmn-close-text-gray {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -814px;
  width: 14px;
  height: 14px;
}

.ico-cmn-close-small {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -794px;
  width: 10px;
  height: 10px;
}

.ico-cmn-questionnaire-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6734px;
  width: 44px;
  height: 66px;
}

.ico-cmn-identify {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3398px;
  width: 22px;
  height: 14px;
}

.ico-cmn-preview {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6108px;
  width: 14px;
  height: 14px;
}

.ico-cmn-preview-gray {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6132px;
  width: 18px;
  height: 18px;
}

.ico-cmn-window {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9766px;
  width: 14px;
  height: 16px;
}

.ico-cmn-read {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6902px;
  width: 16px;
  height: 20px;
}

.ico-cmn-single_select {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8426px;
  width: 18px;
  height: 18px;
}

.ico-cmn-multi_select {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4766px;
  width: 18px;
  height: 18px;
}

.ico-cmn-pulldown {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6536px;
  width: 28px;
  height: 10px;
}

.ico-cmn-entry {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2124px;
  width: 18px;
  height: 18px;
}

.ico-cmn-url {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9394px;
  width: 18px;
  height: 18px;
}

.ico-cmn-file {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2350px;
  width: 20px;
  height: 18px;
}

.ico-cmn-work-message {
  background-image: url(../img/common/work_message.png);
  background-repeat: no-repeat;
  background-size: 100%;
  width: 18px;
  height: 18px;
}

.ico-cmn-work-link {
  background-image: url(../img/common/work_link.png);
  background-repeat: no-repeat;
  background-size: 100%;
  width: 18px;
  height: 18px;
}

.ico-cmn-complete-mail {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1044px;
  width: 108px;
  height: 80px;
}

.ico-cmn-phone {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -5248px;
  width: 68px;
  height: 132px;
}

.ico-cmn-child {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -584px;
  width: 14px;
  height: 14px;
}

.ico-cmn-sm {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8738px;
  width: 20px;
  height: 40px;
}

.ico-cmn-upload {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9366px;
  width: 20px;
  height: 18px;
}

.ico-cmn-download {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2094px;
  width: 24px;
  height: 20px;
}

.ico-cmn-up {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9342px;
  width: 14px;
  height: 14px;
}

.ico-cmn-down {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2070px;
  width: 14px;
  height: 14px;
}

.ico-cmn-profile {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6346px;
  width: 42px;
  height: 72px;
}

.ico-cmn-facebook {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2152px;
  width: 60px;
  height: 40px;
}

.ico-cmn-x {
  background-image: url(../img/common/sprite_60_40.png);
  background-size: 100%;
  width: 60px;
  height: 40px;
}

.ico-cmn-line {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3650px;
  width: 60px;
  height: 40px;
}

.ico-cmn-hatebu {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2908px;
  width: 60px;
  height: 40px;
}

.ico-cmn-service-01 {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -7214px;
  width: 104px;
  height: 98px;
}

.ico-cmn-service-02 {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -7422px;
  width: 108px;
  height: 116px;
}

.ico-cmn-service-03 {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -7664px;
  width: 96px;
  height: 96px;
}

.ico-cmn-service-04 {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -7870px;
  width: 102px;
  height: 91px;
}

.ico-cmn-service-05 {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -7971px;
  width: 113px;
  height: 91px;
}

.ico-cmn-service-06 {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8072px;
  width: 95px;
  height: 90px;
}

.ico-cmn-service-07 {
  background-image: url(../img/common/icon_smartphone.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 128px;
  background-position: center center;
}

.ico-cmn-service-08 {
  background-image: url(../img/common/icon_mail.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 128px;
  background-position: center center;
}

.ico-cmn-service-09 {
  background-image: url(../img/common/icon_coin.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 128px;
  background-position: center center;
}

.ico-cmn-link:before, .ico-cmn-account:before, .ico-cmn-compensation:before, .ico-cmn-mail-magazine:before, .ico-cmn-member:before, .ico-cmn-transfer:before, .ico-cmn-withdrawal:before, .ico-cmn-withholding:before, .ico-cmn-door:before, .ico-cmn-profile-symbol:before, .ico-cmn-history-symbol:before, .ico-cmn-setting-symbol:before, .ico-cmn-guide-symbol:before, .ico-cmn-post-symbol:before, .ico-cmn-topics-symbol:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  opacity: 1;
  transition: opacity 0.3s;
}

.ico-cmn-account {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -96px;
  width: 46px;
  height: 32px;
}

.ico-cmn-account:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px 0px;
  width: 46px;
  height: 32px;
}

.ico-cmn-compensation {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -990px;
  width: 42px;
  height: 44px;
}

.ico-cmn-compensation:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -864px;
  width: 42px;
  height: 44px;
}

.ico-cmn-mail-magazine {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4150px;
  width: 38px;
  height: 44px;
}

.ico-cmn-mail-magazine:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4024px;
  width: 38px;
  height: 44px;
}

.ico-cmn-member {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4320px;
  width: 46px;
  height: 40px;
}

.ico-cmn-member:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4204px;
  width: 46px;
  height: 40px;
}

.ico-cmn-transfer {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9188px;
  width: 38px;
  height: 40px;
}

.ico-cmn-transfer:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9072px;
  width: 38px;
  height: 40px;
}

.ico-cmn-withdrawal {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9922px;
  width: 46px;
  height: 46px;
}

.ico-cmn-withdrawal:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9792px;
  width: 46px;
  height: 46px;
}

.ico-cmn-withholding {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -10114px;
  width: 40px;
  height: 48px;
}

.ico-cmn-withholding:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -9978px;
  width: 40px;
  height: 48px;
}

.ico-cmn-door {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2020px;
  width: 46px;
  height: 40px;
}

.ico-cmn-door:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1902px;
  width: 46px;
  height: 40px;
}

.ico-cmn-profile-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6290px;
  width: 46px;
  height: 46px;
}

.ico-cmn-profile-symbol:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6160px;
  width: 46px;
  height: 46px;
}

.ico-cmn-history-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3128px;
  width: 40px;
  height: 40px;
}

.ico-cmn-history-symbol:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3012px;
  width: 40px;
  height: 40px;
}

.ico-cmn-guide-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2858px;
  width: 40px;
  height: 40px;
}

.ico-cmn-guide-symbol:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2742px;
  width: 40px;
  height: 40px;
}

.ico-cmn-post-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -5870px;
  width: 38px;
  height: 36px;
}

.ico-cmn-post-symbol:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -5762px;
  width: 38px;
  height: 36px;
}

.ico-cmn-setting-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8292px;
  width: 42px;
  height: 42px;
}

.ico-cmn-setting-symbol:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -8172px;
  width: 42px;
  height: 42px;
}

.ico-cmn-topics-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2192px;
  width: 40px;
  height: 40px;
  background-size: 220px 8580px;
}

.ico-cmn-topics-symbol:before {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2118px;
  width: 40px;
  height: 40px;
  background-size: 220px 8580px;
}

.ico-cmn-home.is-active {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3300px;
  width: 30px;
  height: 30px;
}

.ico-cmn-keep.is-active {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -3552px;
  width: 32px;
  height: 30px;
}

.ico-cmn-message.is-active {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4624px;
  width: 32px;
  height: 24px;
}

.ico-cmn-menu.is-active {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -4456px;
  width: 32px;
  height: 26px;
}

.ico-cmn-guide.is-active {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2652px;
  width: 32px;
  height: 28px;
}

.ico-cmn-plus {
  position: relative;
  width: 14px;
  height: 14px;
  text-align: center;
  line-height: 0;
  font-size: 0;
}

.ico-cmn-plus:before, .ico-cmn-plus:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  width: 14px;
  height: 2px;
  background-color: #fff;
}

.ico-cmn-plus:after {
  width: 2px;
  height: 14px;
}

.ico-cmn-alt {
  display: block;
  width: 0;
  height: 0;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  visibility: hidden;
}

.ico-cmn-txt {
  margin-right: 8px;
}

.ico-cmn-history-symbol-small {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2042px;
  width: 30px;
  height: 32px;
  background-size: 200px 7135px;
}

.ico-cmn-mypage {
  background: url(../img/common/mypage.png) no-repeat;
  background-size: 100%;
  width: 32px;
  height: 32px;
}

.ico-cmn-notice {
  background: url(../img/common/notice.png) no-repeat;
  background-size: 100%;
  width: 30px;
  height: 26px;
}

.ico-cmn-help {
  background: url(../img/common/help.png) no-repeat;
  background-size: 100%;
  width: 32px;
  height: 32px;
}

.ico-cmn-luckybox {
  background: url(../img/common/gnavi-luckybox.png) no-repeat;
  background-size: 100%;
  width: 32px;
  height: 32px;
}

body.luckybox .nav-cmn-global-list-luckybox .ico-cmn-luckybox {
  background: url(../img/common/gnavi-luckybox-current.png) no-repeat;
  background-size: 100%;
  width: 32px;
  height: 32px;
}

.ico-cmn-reception-time {
  background: url(../img/common/rem_reception-time.png);
  background-size: 100%;
  width: 15px;
  height: 15px;
  margin-top: -15px;
  margin-left: 30px;
  margin-right: 5px;
}

.ico-cmn-profile-box-get {
  background-image: url(../img/common/box_profile.png);
  background-repeat: no-repeat;
  width: 77px;
  height: 90px;
  background-size: 100%;
}

.ico-cmn-menu-profile-box {
  background-image: url(../img/common/box_10p.png);
  background-repeat: no-repeat;
  background-size: 100%;
  width: 24px;
  height: 32px;
}

.ico-cmn-menu-profile-paid-box {
  background-image: url(../img/common/paid_box_10p.png);
  background-repeat: no-repeat;
  background-size: 100%;
  width: 24px;
  height: 32px;
}

.mod-cmn-menu-status.ico-cmn-menu-profile-box {
  opacity: 1;
  margin-top: -4px;
  right: 122px;
}

.mod-cmn-menu-status.ico-cmn-menu-profile-paid-box {
  opacity: 1;
  margin-top: -4px;
  right: 122px;
}

/* ==========================================================
 unique
========================================================== */
/* /client/
---------------------------------------------------------- */
/* area-client-top-01
---------------------------------------------------------- */
.area-client-top-01 {
  position: relative;
  padding: 60px 0 140px;
  background-color: #44bac7;
}

.area-client-top-01:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -48px;
  margin: auto;
  width: 168px;
  height: 48px;
  background: url(../img/client/bg_client_balloon_01.png) no-repeat 0 0;
}

/* area-client-top-02
---------------------------------------------------------- */
.area-client-top-02 {
  padding: 100px 0 80px;
  background-color: #fff;
}

/* area-client-top-03
---------------------------------------------------------- */
.area-client-top-03 {
  border-top: 1px solid #44bac7;
  background-color: #faf8f0;
}

/* area-client-top-04
---------------------------------------------------------- */
.area-client-top-04 {
  border-top: 1px solid #44bac7;
  padding: 40px 0 100px;
  background-color: #fff;
}

/* hero-client-top
---------------------------------------------------------- */
.hero-client-top {
  position: relative;
  height: 474px;
  padding: 76px 574px 0 56px;
  background-color: #fff;
  border-radius: 6px;
  text-align: center;
}

.hero-client-top:after {
  content: '';
  display: block;
  position: absolute;
  right: -9px;
  top: -39px;
  width: 590px;
  height: 513px;
  background: url(../img/client/img_client_01.png) no-repeat 0 0;
}

.hero-client-top-sub {
  padding: 0 51px;
  display: inline-block;
  position: relative;
  line-height: 1.4;
  font-size: 36px;
  font-weight: bold;
  color: #44bac7;
}

.hero-client-top-sub:before, .hero-client-top-sub:after {
  content: '';
  position: absolute;
  top: 16px;
  display: block;
  width: 34px;
  height: 73px;
  background: url(../img/client/bg_client_slash_01.png) no-repeat 0 0;
}

.hero-client-top-sub:before {
  left: 0;
}

.hero-client-top-sub:after {
  right: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.hero-client-top-logo {
  margin-top: 20px;
}

.hero-client-top-txt {
  margin-top: 40px;
  line-height: 1.75;
  font-size: 20px;
  color: #474747;
}

/* ttl-client-top-01
---------------------------------------------------------- */
.ttl-client-top-01 {
  text-align: center;
  color: #fff;
  line-height: 1.5;
  font-weight: bold;
  font-size: 40px;
}

/* ttl-client-top-02
---------------------------------------------------------- */
.ttl-client-top-02 {
  text-align: center;
  color: #44bac7;
  line-height: 1.5;
  font-weight: bold;
  font-size: 36px;
}

/* mod-client-top-01
---------------------------------------------------------- */
.mod-client-top-01 {
  margin-top: 110px;
  height: 555px;
  text-align: center;
  background: url(../img/client/img_client_02.png) no-repeat center 0;
}

/* mod-client-top-02
---------------------------------------------------------- */
.mod-client-top-02 {
  margin-top: 70px;
}

.mod-client-top-02-items {
  margin-top: 40px;
  overflow: hidden;
}

.mod-client-top-02-item {
  float: left;
  width: 360px;
  margin-left: 40px;
  padding: 47px 20px 0;
  background-color: #faf8f0;
  border-radius: 6px;
  text-align: center;
}

.mod-client-top-02-item:first-child {
  margin-left: 0;
}

.mod-client-top-02-ttl {
  margin-top: 30px;
  color: #44bac7;
  font-weight: bold;
  font-size: 20px;
}

.mod-client-top-02-txt {
  margin-top: 16px;
  min-height: 6em;
  padding-bottom: 10px;
  line-height: 1.75;
  text-align: left;
}

.mod-client-top-02-foot {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin: 0 -20px;
  padding: 0 20px;
  height: 84px;
  border-top: 1px solid #e0ded5;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.mod-client-top-02-foot .mod-client-top-02-txt {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-top: 0;
  min-height: auto;
  text-align: center;
}

/* mod-client-top-03
---------------------------------------------------------- */
.mod-client-top-03 {
  margin-top: 40px;
  overflow: hidden;
}

.mod-client-top-03-item {
  float: left;
  width: 160px;
  margin-left: 40px;
  text-align: center;
}

.mod-client-top-03-item:first-child {
  margin-left: 0;
}

.mod-client-top-03-body {
  border: 1px solid #44bac7;
  padding: 14px 10px 18px;
  border-radius: 6px;
}

.mod-client-top-03-ttl {
  margin-bottom: 4px;
  font-size: 18px;
  font-weight: bold;
  color: #44bac7;
}

.mod-client-top-03-txt {
  line-height: 1.6;
  font-size: 14px;
}

/* mod-client-top-04
---------------------------------------------------------- */
.mod-client-top-04 {
  padding: 74px 490px 20px 266px;
  height: 428px;
  background: url(../img/client/img_client_03.png) no-repeat center 0;
}

.mod-client-top-04-ttl {
  font-size: 34px;
  font-weight: bold;
  color: #44bac7;
}

.mod-client-top-04-txt {
  margin-top: 24px;
  line-height: 1.75;
  font-size: 18px;
}

/* mod-client-top-05
---------------------------------------------------------- */
.mod-client-top-05 {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  margin-top: 50px;
}

.mod-client-top-05-item {
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1 1 0%;
  padding-left: 40px;
}

.mod-client-top-05-item:first-child {
  padding-left: 0;
}

.mod-client-top-05-body {
  padding: 30px 38px;
  height: 100%;
  background-color: #faf8f0;
  border: 2px solid #e0ded5;
  border-radius: 8px;
}

.mod-client-top-05-ttl {
  color: #44bac7;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.mod-client-top-05-txt {
  margin-top: 26px;
  line-height: 1.75;
}

/* mod-client-top-06
---------------------------------------------------------- */
.mod-client-top-06 {
  margin-top: 60px;
  overflow: hidden;
}

.mod-client-top-06-item {
  position: relative;
  float: left;
  width: 251px;
  padding: 0 20px;
  margin-left: 52px;
}

.mod-client-top-06-item:after {
  content: '';
  display: block;
  position: absolute;
  top: 115px;
  right: -60px;
  width: 60px;
  height: 21px;
  background: url(../img/client/img_client_arrorw_01.png) no-repeat 0 0;
}

.mod-client-top-06-item:first-child {
  margin-left: 0;
}

.mod-client-top-06-item:last-child:after {
  content: none;
}

.mod-client-top-06-ttl {
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  color: #44bac7;
}

.mod-client-top-06-fig {
  text-align: center;
  margin-top: 20px;
}

.mod-client-top-06-txt {
  margin-top: 20px;
  font-size: 14px;
  line-height: 1.75;
}

/* /lp/
---------------------------------------------------------- */
/* l-container-lp-01
---------------------------------------------------------- */
.l-container-lp-01 {
  text-align: center;
}

/* hero-lp
---------------------------------------------------------- */
.hero-lp {
  padding-bottom: 60px;
}

.hero-lp-btn {
  margin-top: -60px;
}

/* mod-lp-cont
---------------------------------------------------------- */
/* btn-lp
---------------------------------------------------------- */
.btn-lp {
  font-size: 30px;
}

.btn-lp .btn-cmn-in {
  padding-top: 20px;
  padding-bottom: 19px;
}

.btn-lp-fat .btn-cmn-in {
  padding-top: 35px;
  padding-bottom: 34px;
}

.btn-lp-notes {
  margin-top: 5px;
  display: block;
  font-size: 18px;
  font-weight: normal;
  color: #ffff00;
}

.btn-lp-notes-registration {
  font-weight: bold;
  color: #ff5a5f;
}

/* txt-lp-center
---------------------------------------------------------- */
.txt-lp-center {
  margin-top: 30px;
  text-align: center;
}

/* link-lp-arrow
---------------------------------------------------------- */
.link-lp-arrow {
  display: inline-block;
  padding-left: 20px;
  font-size: 20px;
  font-weight: bold;
  text-decoration: underline;
  background: url(../img/lp/ico_arrow_r_01.png) no-repeat 0 center;
}

/* ttl-lp
---------------------------------------------------------- */
.ttl-lp-01,
.ttl-lp-02,
.ttl-lp-03 {
  margin-bottom: 80px;
  line-height: 1.1;
  text-align: center;
  font-weight: bold;
  font-size: 42px;
}

.ttl-lp-01 {
  color: #ffff00;
}

.ttl-lp-01-txt {
  color: #fff;
}

.ttl-lp-02 {
  margin-bottom: 60px;
  color: #ff5a5f;
}

.ttl-lp-02-txt {
  color: #474747;
}

.ttl-lp-03 {
  color: #ff5a5f;
}

/* txt-lp-notes-01
---------------------------------------------------------- */
.txt-lp-notes-01 {
  margin: 10px 0 80px;
}

.ttl-lp-03-txt {
  color: #474747;
}

/* area-lp
---------------------------------------------------------- */
.area-lp {
  position: relative;
  overflow: hidden;
  z-index: 2;
}

.area-lp-gray:before, .area-lp-blue:before, .area-lp-white:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: -1px;
  margin: auto;
  width: 60px;
  height: 23px;
  z-index: 10;
}

.area-lp-blue {
  z-index: 3;
}

.area-lp-blue:before {
  background: url(../img/lp/bg_lp_balloon_01.png) center 0 no-repeat;
}

.area-lp-gray:before {
  background: url(../img/lp/bg_lp_balloon_02.png) center 0 no-repeat;
}

.area-lp-white:before {
  background: url(../img/lp/bg_lp_balloon_03.png) center 0 no-repeat;
}

.area-lp-arrow-b:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 36px;
  background: url(../img/lp/bg_cont_arrow_b_02@2x.png) center bottom no-repeat;
  background-size: cover;
}

.area-lp-arrow-b.area-lp-blue:after {
  background: url(../img/lp/bg_cont_arrow_b_01@2x.png) center bottom no-repeat;
}

.area-lp-normal {
  z-index: 1;
}

.area-lp-in {
  position: relative;
  padding: 78px 17px 100px;
  z-index: 2;
}

.area-lp-in-wide {
  padding-left: 30px;
  padding-right: 30px;
}

.area-lp-gray .area-lp-in {
  background-color: #f1efe6;
}

.area-lp-blue .area-lp-in {
  background-color: #69c7d1;
}

.area-lp-blue .area-lp-in a {
  color: #fff;
}

.area-lp-white .area-lp-in {
  background-color: #fff;
}

.area-lp-normal .area-lp-in {
  padding-top: 75px;
  padding-bottom: 100px;
}

.area-lp-btn-01 {
  margin-top: 60px;
}

.area-lp-btn-02 {
  margin-top: 50px;
}

.area-lp-btn-03 {
}

.area-lp-read {
  margin-top: 46px;
  line-height: 1.75;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

/* box-lp-card
---------------------------------------------------------- */
.box-lp-card {
  width: 760px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  display: block;
  padding: 17px 30px 17px 40px;
  border-radius: 20px;
  background-color: #fff;
  border: solid 2px #e0ded5;
  overflow: hidden;
  text-align: left;
}

.box-lp-card-ico {
  position: absolute;
  left: 40px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.box-lp-card-detail {
  display: table;
  width: 100%;
  padding-left: 80px;
}

.box-lp-card-task {
  display: table-cell;
  width: 80%;
  vertical-align: middle;
  color: #808080;
  font-size: 20px;
  line-height: 1.5;
}

.box-lp-card-require {
  display: table-cell;
  vertical-align: middle;
  text-align: right;
  line-height: 1.3;
}

.box-lp-card-require-price {
  display: block;
  font-family: "Roboto Slab", serif;
  font-size: 46px;
  font-weight: bold;
  color: #ff5a5f;
}

.box-lp-card-require-price-unit {
  margin-left: 4px;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
  font-size: 26px;
  font-weight: normal;
}

.box-lp-card-require-time {
  display: block;
  font-family: "Roboto Slab", serif;
  font-size: 26px;
  font-weight: bold;
  color: #808080;
}

.box-lp-card-require-time-unit {
  margin-left: 7px;
  margin-right: 2px;
  font-size: 20px;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
  font-weight: normal;
}

/* ==========================================================
 magnific-popup
========================================================== */
/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #000;
  opacity: .6;
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 25px;
  padding: 0 12px;
  box-sizing: border-box;
}

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
  display: none;
}

.mfp-content {
  padding: 20px;
  border-radius: 10px;
  background-color: #faf8f0;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  max-width: 960px;
  cursor: auto;
}

.mfp-cont-narrow .mfp-content {
  max-width: 760px;
}

.mfp-content.plof-regi-popup-wid{
  max-width: 760px;
}

.mfp-ajax-cur {
  cursor: progress;
}

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: zoom-out;
}

.mfp-zoom {
  cursor: pointer;
  cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
  cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
      user-select: none;
}

.mfp-loading.mfp-figure {
  display: none;
}

.mfp-hide {
  display: none !important;
}

.mfp-preloader {
  display: none;
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044;
}

.mfp-preloader a {
  color: #CCC;
}

.mfp-preloader a:hover {
  color: #FFF;
}

.mfp-s-ready .mfp-preloader {
  display: none;
}

.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
}

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

.mfp-close,
.dl-close-button {
  position: absolute;
  right: 30px;
  top: 34px;
  width: 36px;
  height: 36px;
  text-decoration: none;
  text-align: center;
  background-color: #808080;
  box-shadow: inset 0px -2px 0px 0px rgba(4, 0, 0, 0.2);
  border-radius: 50%;
}

.mfp-close:before,
.dl-close-button:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  display: block;
  background-image: url("../img/common/sprite.png");
  background-position: 0px -317px;
  width: 15px;
  height: 15px;
  background-size: 140px 5255px;
}

.mfp-close:hover {
  background-color: #666;
  box-shadow: inset 0px -1px 0px 0px rgba(4, 0, 0, 0.2);
  opacity: 1;
}

.mfp-close:hover,
.mfp-close:focus {
  opacity: 1;
}

.mfp-close-btn-in .mfp-close {
  color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
  margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1;
}

.mfp-arrow:before,
.mfp-arrow:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
}

.mfp-arrow:after {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}

.mfp-arrow:before {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}

.mfp-arrow-left {
  left: 0;
}

.mfp-arrow-left:after {
  border-right: 17px solid #FFF;
  margin-left: 31px;
}

.mfp-arrow-left:before {
  margin-left: 25px;
  border-right: 27px solid #3F3F3F;
}

.mfp-arrow-right {
  right: 0;
}

.mfp-arrow-right:after {
  border-left: 17px solid #FFF;
  margin-left: 39px;
}

.mfp-arrow-right:before {
  border-left: 27px solid #3F3F3F;
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}

.mfp-iframe-holder .mfp-close {
  top: -40px;
}

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}

/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}

/* The shadow behind the image */
.mfp-figure {
  line-height: 0;
}

.mfp-figure:after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444;
}

.mfp-figure small {
  color: #BDBDBD;
  display: block;
  font-size: 12px;
  line-height: 14px;
}

.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
       * Remove all paddings around the image on small screen
       */
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0;
  }
  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }
  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0;
  }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }
  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box;
  }
  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }
  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px;
  }
  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
}

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
  }
  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0;
  }
  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%;
  }
  .mfp-container {
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* overlay at start */
.mfp-fade.mfp-bg {
  opacity: 0;
  transition: all 0.15s ease-out;
}

/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}

/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  transition: all 0.15s ease-out;
}

/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}

/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}

.modal-inline {
  display: none;
}

.mfp-wrap .modal-inline {
  display: block;
}

.mfp {
  position: relative;
  margin: -20px;
  overflow: hidden;
  border-radius: 10px;
}

.mfp-in {
  height: 785px;
}

.mfp-head {
  padding: 30px 80px 30px 38px;
  border-bottom: 1px solid #e0ded5;
}

.mfp-body {
  padding: 40px 38px 100px;
}

.mfp-foot {
  position: absolute;
  width: 100%;
  border-top: 1px solid #e0ded5;
  padding: 19px 20px;
  left: 0;
  bottom: 0;
  border-radius: 0 0 6px 6px;
  background-color: #fff;
  z-index: 100;
}

.mfp-foot .btn-cmn {
  margin-left: 20px;
}

.mfp-foot .btn-cmn:first-child {
  margin-left: 0;
}

.mfp-ttl {
  margin-bottom: 0;
  padding: 0 100px;
  text-align: center;
}

.mfp-ttl-wrap {
  position: relative;
}

.mfp-ttl-sub {
  position: absolute;
  left: 0;
  top: -3px;
  font-size: 14px;
}

.mfp-float {
  position: absolute;
  bottom: -352px;
  left: 0;
  width: 100%;
  height: 320px;
  border-top: 1px solid #e0ded5;
  padding: 16px 40px 20px;
  border-radius: 0 0 6px 6px;
  background-color: #fff;
  transition: 0.3s;
}

.mfp-float.is-active {
  bottom: 0;
}

.mfp-float-btn-wrap {
  margin-top: 20px;
  text-align: center;
}

.mfp-float-close {
  position: absolute;
  right: 40px;
  bottom: 30px;
}

.mfp-float-attention {
  margin-bottom: 16px;
  text-align: center;
  color: #ff5a5f;
  font-size: 16px;
}

.mfp.is-success {
  border: 2px solid #44bac7;
  color: #44bac7;
}

.mfp.is-alert,
.mfp.is-error {
  border: 2px solid #ff5a5f;
  color: #ff5a5f;
}

.mfp-alert {
  padding: 34px 80px 38px 38px;
}

.mfp-alert-prof {
  padding: 40px 40px 40px 40px;
}

.mfp-alert-ttl {
  margin-bottom: 27px;
  text-align: center;
  line-height: 1.75;
  font-size: 24px;
  font-weight: bold;
}

.mfp-alert-ttl:last-child {
  margin-bottom: 0;
}

.mfp-alert-txt {
  line-height: 1.75;
}

.mfp-alert-txt-red {
  color:#ff5a5f;
  font-size: 10px;
}

.mfp-alert-txt-red-link {
  color:#ff5a5f;
  text-decoration: underline;
}

.mfp-alert-once-name {
  display: block;
  margin: 0 auto;
  width: 280px;
  text-align: left;
}

.mfp-alert-checkbox {
  margin-right: auto;
  margin-left: auto;
  width: 340px;
  margin-bottom: 27px;
}

.mfp-alert-nomal-txt {
  font-size: 15px;
  font-weight: normal;
}

/* start modal trigger */
[href="#popup"] {
  display: none;
}

/* ==========================================================
 slick
========================================================== */
/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
}

.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir="rtl"] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* ==========================================================
 helper
========================================================== */
/* ==========================================================
 clearfix
========================================================== */
.clearfix:after, .header-utility:after, .contents-main:after, .box-cmn-card-in:after, .box-cmn-card-simple:after, .mod-cmn-sort:after, .mod-cmn-category:after, .mod-cmn-message-in:after, .mod-cmn-progress-wrap:after, .mod-cmn-select:after, .mod-cmn-select-balloon-lists:after, .mod-cmn-case-detail-head:after, .mod-cmn-tags:after {
  content: '';
  display: block;
  clear: both;
}

/* ==========================================================
 style
========================================================== */
/* generic style
---------------------------------------------------------- */
.s-adjust {
  width: 100%;
}

.s-bold {
  font-weight: bold;
}

.s-nowrap {
  white-space: nowrap;
}

.s-left {
  text-align: left;
}

.s-center, .s-center-pc {
  text-align: center;
}

.s-right, .s-right-pc {
  text-align: right;
}

.s-top {
  vertical-align: top;
}

.s-middle {
  vertical-align: middle;
}

.s-bottom {
  vertical-align: bottom;
}

.s-cover {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
}

/* radius
---------------------------------------------------------- */
.s-radius {
  border-radius: 8px;
}

/* margin
---------------------------------------------------------- */
.s-mt00 {
  margin-top: 0;
}

.s-mt20 {
  margin-top: 20px;
}

.start-work-body:not(.only-pc):not(.only-sp).s-mt20 {
  margin-top: 41px;
}

.s-mt78 {
  margin-top: 78px;
}

.s-mb00 {
  margin-bottom: 0;
}

.s-mb10 {
  margin-bottom: 10px;
}

.s-mb20 {
  margin-bottom: 20px;
}

.s-ml-1em {
  margin-left: 1em;
}

.s-mr14 {
  margin-right: 14px;
}

.s-ml14 {
  margin-left: 14px;
}

/* width
---------------------------------------------------------- */
.s-width-auto,
.s-width-lg-auto {
  width: auto;
}

.s-width-full,
.s-width-lg-full {
  width: 100%;
  min-width: 0;
}

.s-width-lg-90 {
  width: 90px;
}

.s-width-lg-115 {
  width: 115px;
}

.s-width-lg-126 {
  width: 126px;
}

.s-width-lg-160 {
  width: 160px;
}

.s-width-lg-165 {
  width: 165px;
}

.s-width-lg-170 {
  width: 170px;
}

.s-width-lg-196 {
  width: 196px;
}

.s-width-lg-200 {
  width: 200px;
}

.s-width-lg-220 {
  width: 220px;
}

.s-width-lg-223 {
  width: 223px;
}

.s-width-lg-230 {
  width: 230px;
}

.s-width-lg-260 {
  width: 260px;
}

.s-width-lg-273 {
  width: 273px;
}

.s-width-lg-310 {
  width: 310px;
}

.s-width-lg-360 {
  width: 360px;
}

.s-width-lg-400 {
  width: 400px;
}

.s-width-lg-410 {
  width: 410px;
}
.s-width-lg-420 {
  width: 420px;
}

.s-width-lg-460 {
  width: 460px;
}

.s-width-lg-524 {
  width: 524px;
}

.s-width-lg-560 {
  width: 560px;
}

.s-width-lg-33per {
  width: 33%;
}

.s-width-lg-40per {
  width: 40%;
}

.s-width-lg-50per {
  width: 50%;
}

.s-width-lg-60per {
  width: 60%;
}

.s-width-lg-80per {
  width: 80%;
}

.s-width-lg-14per {
  width: 14%;
}

.s-width-lg-16per {
  width: 16%;
}

.s-width-lg-17per {
  width: 17%;
}

.s-width-lg-20per {
  width: 20%;
}

.s-width-lg-25per {
  width: 25%;
}

.s-width-lg-30per {
  width: 30%;
}

/* font
---------------------------------------------------------- */
.s-font {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
}

.s-font-roboto {
  font-family: "Roboto Slab", serif;
}

.s-font-roboto-regular {
  font-family: "Roboto Slab Regular";
}

/* color
---------------------------------------------------------- */
.s-color-txt {
  color: #474747;
}

.s-color-blue {
  color: #44bac7;
}

.s-color-pink {
  color: #ff5a5f;
}

.s-color-yellow {
  color: #ffb237;
}

.s-color-yellow-light {
  color: #ffff33;
}

.s-color-gray {
  color: #808080;
}

.s-color-gray-light {
  color: #999;
}

.s-color-red {
  color: #ff0000;
}

/* bgcolor
---------------------------------------------------------- */
.s-bgcolor-blue {
  background-color: #44bac7;
}

.s-bgcolor-blue-dark {
  background-color: #128e9c;
}

.s-bgcolor-pink {
  background-color: #ff5a5f;
}

.s-bgcolor-yellow {
  background-color: #ffb237;
}

.s-bgcolor-gray {
  background-color: #808080;
}

.s-bgcolor-gray-light {
  background-color: #999;
}

.s-bgcolor-black {
  background-color: #474747;
}

.s-bgcolor-white {
  background-color: #fff;
}

.s-bgcolor-purple {
  background-color: #a080ef;
}

.s-bgcolor-body {
  background-color: #faf8f0;
}
.s-bgcolor-read-onry {
  background-color: #e0ded5 !important;
}

.s-bgcolor-blue-deep {
  background-color: #1B88B8;
}

.s-bgcolor-blue-dark-deep {
  background-color: #108095;
}

.s-bgcolor-pink-deep {
  background-color: #E55155;
}

.s-bgcolor-yellow-deep {
  background-color: #E5983C;
}

.s-bgcolor-gray-light-deep {
  background-color: #898989;
}

.s-bgcolor-purple-deep {
  background-color: #9073D7;
}

.s-bgcolor-thick-blue {
  background-color: #1e97ce;
}

/* textdecoration
---------------------------------------------------------- */
.s-textdecoration-underline {
  text-decoration: underline;
}

.s-textdecoration-linethrough {
  text-decoration: line-through;
}

/* scrollbar
---------------------------------------------------------- */
.s-scrollbar {
  overflow-x: hidden;
  overflow-y: auto;
}

.s-scrollbar::-webkit-scrollbar {
  width: 8px;
  background-color: rgba(0, 0, 0, 0.2);
}

.s-scrollbar::-webkit-scrollbar-track {
  background: none;
}

.s-scrollbar::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: #474747;
}

.s-scrollbar-none {
  overflow-x: hidden;
  overflow-y: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.s-scrollbar-none::-webkit-scrollbar {
  display: none;
}

/* ----------------------------------------------------------
 rwd switch
---------------------------------------------------------- */
/* sp
---------------------------------------------------------- */
.only-sp {
  display: none;
}

/* tool
---------------------------------------------------------- */
.atode {
  padding: 10px;
  border: 2px solid #8c0000;
  background-color: #ff4d4d;
  color: #fff;
  font-size: 30px;
  text-align: center;
}
.div-min-heigth{
	min-height : 750px !important;
}
/* ----------------------------------------------------------
 white-space
---------------------------------------------------------- */
.ws-pW{
  white-space:pre-wrap;
}

/* padding
---------------------------------------------------------- */
.s-pl00 {
  padding-left: 0px;
}
.s-pl26 {
  padding-left: 26px;
}
/* ----------------------------------------------------------
 btn-cmn-store
---------------------------------------------------------- */
.btn-cmn-store {
  background-color: #faf8f0;
}
.btn-cmn-store-lp {
  padding: 20px 0;
}
.btn-cmn-store-home {
  padding-top: 40px;
}
.btn-cmn-store-work {
  margin-top: 20px;
}
.btn-cmn-store-border {
  border-top: 1px solid #dcdcdc;
}
.btn-cmn-store-home-msg {
  padding-bottom: 30px;
}
.btn-cmn-store-m-mgzn {
  margin-top: 40px;
}
.btn-cmn-store-anchr {
  display: block;
  margin: 0 auto;
  width: 430px;
}

/* ----------------------------------------------------------
 nav-cmn-redirect
---------------------------------------------------------- */
.nav-cmn-redirect {
  padding-top: 200px;
  text-align: center;
}
.nav-cmn-redirect .btn-cmn {
    width: 250px;
    font-size: 16px !important;
}

/* ----------------------------------------------------------
 top-cate-link
---------------------------------------------------------- */
.top-cate-link .btn-cmn-in {
  box-shadow: inset 0 -2px 0 0 rgba(4, 0, 0, 0.1);
  border: 1px solid #44bac7;
  background-color: #fff;
  color: #44bac7;
  width:150px;
  height:40px;
  padding: 7px 5px 5px 5px;
  margin-bottom:6px;
  display: block;
}
.top-cate-link:hover .btn-cmn-in {
  margin-top: 2px;
  margin-bottom: 2px;
  box-shadow: none;
}
.ico-cmn-search-cate {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -6932px;
  width: 28px;
  height: 28px;
  margin-top:-2px;
}

.top-cate-div {
  margin-bottom:20px
}
.top-cate-utility {
  display: table;
  padding: 0px 0 13px;
}
.top-cate-links {
  display: table-cell;
  vertical-align: middle;
}

.top-cate-links-list {
  float: left;
  margin-right:15px;
}
.top-cate-title{
  font-size:20px;
}

/* mod-cmn-registration-profile
---------------------------------------------------------- */
.mod-cmn-registration-profile {
  display: table;
  padding: 24px 25px 24px 25px;
  border-radius: 8px;
  background-color: #fff;
  border: 2px solid #ff5a5f;
  margin: auto;
}

.mod-cmn-registration-profile-ico {
  width: 78px;
  display: table-cell;
  vertical-align: middle;
}
.mod-cmn-registration-profile-body {
  margin-top: 0px;
}
.mod-cmn-registration-profile-ttl {
  color: #474747;
  font-size: 18px;
  transition: 0.3s;
  line-height: 1.25;
}
.mod-cmn-registration-profile-ttl-lheight {
  line-height: 1.25;
}
.mod-cmn-registration-profile-point {
  display: inline-block;
  color: #ff5a5f;
  font-size: 45px;
}
.mod-cmn-registration-profile-unit {
  margin-left: 6px;
  font-size: 26px;
  color: #44bac7;
}
.mod-cmn-registration-profile-label {
  margin-top: 30px;
  letter-spacing: -.5em;
}
.ttl-cmn-mymenu-color {
  color: #474747;
}
.messeage0-margin {
  margin-top:55px;
}
.message0-nouser-margin {
  margin-top:63px;
}
.work-detail-sts-icon{
  	display: none;
}
.work-detail-sts-icon1{
  display: inline-block;
  position:absolute;
  right: 65px;
  margin-top: 24px;
  bottom: auto;
}
.work-detail-sts-icon2{
  display: inline-block;
  position:absolute;
  right: 170px;
  margin-top: 24px;
  bottom: auto;
}

.work-detail-sts-icon3{
  display: inline-block;
  position:absolute;
  right: 98px;
  margin-top: 24px;
  bottom: auto;
}

/* ==========================================================
 topinfo
========================================================== */
.topinfo{
  background-color: #fff;
}
.topinfo i{
  margin-left: auto;
    margin-right: auto;
}
.topinfo p{
  margin-left: auto;
  margin-right: auto;
  width: 1160px;
  border-top: transparent 5px solid;
}

.topinfo p:last-child {
  margin-bottom: 5px;
}

.ico-cmn-topinfo {
  background: url(../img/common/icon_info.png) no-repeat 0 0;
  width:21px;
  height:26px;
  background-size:100%;
}
.topinfo a{
font-size:18px;
}

.ico-cmn-maintenance {
  background: url(../img/common/maintenance.png) no-repeat 0 0;
  width:22px;
  height:25px;
  background-size:100%;
}

.ico-cmn-release {
  background: url(../img/common/release.png) no-repeat 0 0;
  width:22px;
  height:25px;
  background-size:100%;
}

.ico-cmn-campaign {
  background: url(../img/common/campaign.png) no-repeat 0 0;
  width:22px;
  height:25px;
  background-size:100%;
}

.ico-cmn-feature {
  background: url(../img/common/feature.png) no-repeat 0 0;
  width:22px;
  height:25px;
  background-size:100%;
}

.mod-cmn-grade-total-remuneration {
  padding: 0 85px 0 85px;
}

.mod-cmn-grade-total-remuneration:first-child {
  padding: 0 85px 0 55px;
}

.mod-cmn-grade-total-remuneration-sub {
  float: left;
  padding-top: 13px;
  color: #44bac7;
  text-align: left;
  font-weight: bold;
}

.mod-cmn-grade-total-txt:first-child > .mod-cmn-grade-total-remuneration:first-child > p:first-child {
  font-size: 26px;
  padding-top: 20px;
}

.mod-cmn-grade-total-remuneration-result {
  font-size: 32px;
  text-align: right;
  color: #ff5a5f;
  border-bottom: 1.4px solid #c1c5c7;
  padding-top: 13px;
  padding-bottom: 5px;
}

.mod-cmn-grade-total-txt:first-child > .mod-cmn-grade-total-remuneration:first-child > p:last-child {
  font-weight: bold;
}

.mod-cmn-grade-total-remuneration-result-unit {
  margin-left: 5px;
  margin-right: 3px;
  font-size: 20px;
}

.mod-cmn-grade-total.remuneration-bottom {
  padding-bottom: 25px;
}

.mod-cmn-grade-msg {
  text-align: center;
  margin-top: 43px;
}

.mod-cmn-grade-msg-sub {
  color: #ff5a5f;
}

.ec-concier-layout-wrapper img {
  max-width:none !important;
}

.extens-picture-input .form-cmn-file-wrap{
  display: block !important;
}

/* ==========================================================
work-ttl-div
========================================================== */
.work-ttl-div{
  margin-bottom: 10px;
}

.work-ttl-div .ttl-cmn-05{
  vertical-align: -20px;
}

.work-ttl-div .extens-group{
  float:right;
}

.work-ttl-div .extens-group button:not(first-child){
  margin-left: 0px;
}

/* ==========================================================
extens
========================================================== */
.extens-explain-input,
.extens-picture-input,
.extens-textlink-input{
  margin-top:20px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  padding: 10px;
  position: relative;
}

.extens-textlink-ul,
.extens-picture-ul,
.complete-content-ul {
  display: table-cell;
}

.extens-link-add,
.extens-picture-add{
  vertical-align: text-top;
  display:  none;
}

.extens-textlink-input:last-child .extens-link-add,
.extens-picture-input:last-child .extens-picture-add{
  display: block;
}

.forward_rqrd_ch{
  position: absolute;
  left: 230px;
  top: 9px;
}

.complete-contente .forward_rqrd_rd{
  position: absolute;
  left: 0px;
  bottom: calc(100% + 5px);
  top: auto;
}

.forward_rqrd_rd{
  margin-left: -16px;
  top: 9px;
}

.extens-link-add-li,
.extens-picture-add-li,
.complete-content-add-li{
  text-align: center;
  padding-top: 10px;

}

.extens-link-input-long{
  width: 455px;
  height: 42px !important;
  margin-left: 20px;
}

.extens-link-input-shrot{
    width: 200px;
    height: 30px !important;
}

.extens-picture-ul .js-file-select,
.complete-content-item-image .js-file-select{
  padding: 0px;
  height:45px !important;
  width: 200px;
}

.extens-picture-ul .js-file-select .btn-cmn-in {
	padding: 0;
}

.extens-explain-input .form-cmn-count {
  display: inline-block;
  position: absolute;
  right: 25px;
  bottom: 20px;
  line-height: 1.05;
  font-size: 14px;
}

.extens-picture-area .form-cmn-file-again,
.extens-picture-input .form-cmn-file-again,
.complete-contente .form-cmn-file-again{
 display:none;
}

.extens-picture-area .form-cmn-file-input,
.complete-contente .form-cmn-file-input{
  padding:  0px;
  width: 170px;
  overflow-x: scroll;
  overflow-wrap: normal;
  white-space: nowrap;
  height: 42px;
  text-overflow: inherit;
  -ms-overflow-style:none;
}
.extens-picture-area .form-cmn-file-input::-webkit-scrollbar,
.complete-contente .form-cmn-file-input::-webkit-scrollbar{
    display:none;
}

.complete-contente{
  margin-top:20px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  padding: 15px 10px;
  position: relative;
  background-color:white;

}

.complete-contentes{
  width:90%;
  margin-left:10%;
}

.complete-contente .extens-link-input-long{
  width: 300px;
  height: 42px !important;
  margin-left: 0px;
}

.chat-select-link .extens-link-input-shrot {
  width: 300px;
  height: 36px !important;
  font-size: 14px;
}

.complete-contentes .form-cmn-file-item{
  margin-top: 0px;
  width: 330px;
}
.extens-picture-input .form-cmn-file-item {
  margin-top: 0px;
    width: 200px;
}

.complete-contentes .js-file-select{
  width: 200px;
}

.complete-contente{
  margin-top:40px;
}

.no-forword{
  margin-left: -16px;
}

.complete-add-btn{
  top: -30px;
  position: relative;
}

.table-cmn-form-row .is-active .form-cmn-file,
.complete-content-item-image .is-active .form-cmn-file,
.extens-picture-ul  .is-active .form-cmn-file{
  display: none;
}

.complete-contente:only-child .complete-content-remove{
  display: none;
}

/* ==========================================================
extens-work
========================================================== */
.extens-textlink-work a,
.extens-picture-work a,
.complete-bannar a{
  text-decoration:underline;
}

.extens-picture-work p,
.complete-bannar p{
  text-align:center;
}

.extens-picture-work img,
.complete-bannar img{
  width:620px;
}

.forward-rqrd{
  margin-bottom: 10px;
}

.table-cmn-form-ttl.extens-sub-ttl {
 padding-left: 30px;
}

.no-display{
  display:none !important;
}

.forward-rqrd{
  margin: 10px 0px;
}

.extens-work{
  margin-bottom: 30px;
}
.extens-text ws-pW{
    margin-bottom: 15px;
}
.complete-bannar{
  margin-top:20px;
}

.csv-oder{
  position: absolute;
  right: 0;
  top: 5px;
  bottom: 0;
  height: 40px;
}

.select-csv-oder .form-cmn-file-input {
      text-align: left;
    width: 950px;
}

.mod-cmn-job-link-pc {
  float: left;
  text-align: right;
  margin-left: 49px;
}

.no-display-pc {
  display: none;
}

.no-display-sp {
  display: block;
}

.btn-cmn-in-copy{
  padding-left: 20px;
  padding-right: 20px;
}

.l-menu-sp {
  display: none;
}

.point-check-button{
  display: none;
}

.work-iframe{
  width: 970px;
  height:  680px;
  margin-right:  auto;
  margin-left:  auto;
}

.work-iframe .work-iframe-in{
  width:  100%;
  height: 100%;
}

.forward_rqrd_rd.cmplt_param {
  position: relative;
  left: 0;
  top: 0;
  margin-left: 10px;
}

.mod-cmn-message-item.mod-cmn-message-item-client a,
.mod-cmn-message-item.mod-cmn-message-item-worker a{
  text-decoration: underline;
  transition: 0s;
}

.mod-cmn-message-item.mod-cmn-message-item-client a{
  color:#808080;
}

.mod-cmn-message-item.mod-cmn-message-item-worker a{
  color:#fff;
}

.jobs-recommend {
  margin-top: 70px;
}

.jobs-recommend.recommend-message-page {
  padding: 0 40px;
}

.box-cmn-balloon-jobs-recommend {
  position: relative;
  margin-top: 40px;
  padding: 13px 13px 13px 20px;
  background-color: #44bac7;
  border-radius: 8px;
  color: #fff;
  font-weight: bold;
  text-align: left;
  font-size: 20px;
}

.box-cmn-balloon-jobs-recommend:first-child {
  margin-top: 0;
}

.box-cmn-balloon-jobs-recommend:before {
  content: '';
  position: absolute;
  left: 10%;
  right: 0;
  top: calc(100% - 1px);
  margin-left: -17px;
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 17px 0 17px;
  border-color: #44bac7 transparent transparent transparent;
}

.box-cmn-balloon-jobs-recommend-center {
  position: relative;
  margin-top: 40px;
  padding: 13px 13px 13px 20px;
  background-color: #44bac7;
  border-radius: 8px;
  color: #fff;
  font-weight: bold;
  text-align: left;
  font-size: 20px;
}

.box-cmn-balloon-jobs-recommend-center:first-child {
  margin-top: 0;
}

.box-cmn-balloon-jobs-recommend-center:before {
  content: '';
  position: absolute;
  left: 50%;
  right: 0;
  top: calc(100% - 1px);
  margin-left: -17px;
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 17px 0px 17px;
  border-color: #44bac7 transparent transparent transparent;
}

.jobs-recommend-list {
  margin: 50px -12px 10px;
  padding: 0px 12px 10px;
}

.footer-order-item.search-link {
  display: block;
  text-align: center;
}

.recommend-history-mg {
  margin-right: 70px;
  margin-left: 70px;
}

.add-utprice{
  padding-top: 0px;
}

.add-utprice-ttl{
  padding: 0;
  min-height: 0 !important;
  border-bottom: 1px solid #e0ded5;
  margin-bottom: 36px;
}

.add-utprice-ttl .contents-title{
  padding: 50px 0px;
}

.add-utprice-ttl .ttl-cmn-mark.ttl-cmn-mark-a{
  display: inline-block;
}

.add-utprice-history{
  position: relative;
}

.add-utprice-history .mod-cmn-select-balloon{
  float:none;
  position: absolute;
  top: -80px;
  right: 0px;
}

.add-utprice-history .is-cancel .table-cmn-stripe-cell{
  background-color: #e0ded5;
  color: #999997;
}

.add-utprice{
  margin-bottom:30px
}

.add-utprice .add-utprice-set{
  margin-top: 50px;
  display: table-row;
}

.add-utprice-start .table-cmn-form-detail .form-cmn-mark-detail .form-cmn,
.add-utprice-end .table-cmn-form-detail .form-cmn-mark-detail .form-cmn{
  height: 45px;
  width: 235px;
}

.add-utprice-button{
  width: 700px;
  display:  block;
  position:  static;
  margin-left:  auto;
  margin-right:  auto;
  margin-top: 60px;
}

.add-utprice-button .btn-cmn-in{
  padding: 15px;
  font-size: 20px;
}

.add-utprice-ttl .l-container,
.l-container.add-utprice{
  width: 980px;
}

.add-utprice-input{
  margin-top: 40px;
}

.add-utprice-input .table-cmn-form-detail{
  width: 780px;
}

.add-utprice-history .font-num{
  font-weight: bold;
}

.add-utprice-th-wid-l {
  width: 15%;
}

.add-utprice-th-wid-m {
  width: 14.5%;
}

.add-utprice-th-wid-l-rate {
  width: 23%;
}

.add-utprice-th-wid-m-rate {
  width: 20.5%;
}

.strike-through{
  color: #999;
  background-image:linear-gradient( to top left, transparent 49%, #474747, transparent 51%);
}

.list-strike-through{
  display: inline-block;
}

.add-utprice-period-txt{
  font-size: 16px;
  position: relative;
  top: -2px;
  padding-right: 30px;
}

.add-utprice .mod-cmn-total-item span{
  font-size: 16px;
}

.new-rwrd{
  padding-right: 11px;
}

.list-add-utprice{
  display: inline-flex;
  position: absolute;
  right: 37px;
  bottom: 65px;
}

.list-add-utprice-period-limited-point {
  bottom: 90px;
}

.list-add-utprice .box-cmn-card-point{
  padding-right: 20px;
  padding-bottom: 4px;
}

.add-utprice-balloon{
  background-color: #faf8f0;
  border: 1px solid #ff5a5f;
  width: 104px;
  height: 42px;
  padding: 2px 14px;
  border-radius: 5px;
  position: relative;
  top: -6px;
  font-weight: bold;
  font-size: 14px;
}

.list-add-utprice .add-utprice-balloon{
  background-color: #fff;
  font-size: 20px;
  top: 16px;
  right: 3px;
  font-weight: normal;
  padding-top: 4px;
}

.add-utprice-balloon-edge:before{
  content: "";
  position: absolute;
  top: 32px;
  margin-top: -14px;
  border: 7px solid transparent;
  border-right: 7px solid #faf8f0;
  z-index: 2;
  right: 69px;
}

.add-utprice-balloon-edge:after{
  content: "";
  position: absolute;
  top: 32px;
  margin-top: -11.8px;
  border: 5px solid transparent;
  border-right: 5px solid #ff5a5f;
  right: 72px;
}

.work-add-utprice-balloon-edge {
  padding-right: 19px;
}

.work-add-utprice-balloon-edge:before{
  content: "";
  position: absolute;
  top: 36px;
  margin-top: -4px;
  border: 7px solid transparent;
  border-right: 7px solid #faf8f0;
  z-index: 2;
  right: 157px;
}

.work-add-utprice-balloon-edge:after{
  content: "";
  position: absolute;
  top: 36px;
  margin-top: -1.8px;
  border: 5px solid transparent;
  border-right: 5px solid #ff5a5f;
  right: 161px;
}

.list-add-utprice .add-utprice-balloon-edge:before{
  right: 90px;
  border: 10px solid transparent;
  border-right: 10px solid #fff;
  margin-top: -13px;
  top: 33px;
}

.list-add-utprice .add-utprice-balloon-edge:after{
 right: 92px;
 border: 9px solid transparent;
 border-right: 9px solid #ff5a5f;
 top: 33px;
}

.messeage0-dsply-nm-txt {
  margin-bottom: 100px;
  font-size: 20px;
  font-weight: bold;
}

.old-rwrd{
  color: #999;
}

.old-rwrd-group{
  top: -15px;
  position: relative;
}

.mod-cmn-work-price .old-rwrd-group{
  top: 0;
}

.total-rwrd-msg{
  font-size: 14px;
  color: #44bac7;
  text-align: right;
  padding-right: 7px;
}

.add-rwrd-mod-cmn-category-pR{
  padding-right: 390px !important;
}

.research-work-caution-txt{
  font-size: 13px;
  padding-top: 7px;
}

.client-wl-sts{
  text-align: right;
}

.wl-sts-color{
  color: #ff0000;
}

.wl-sts-font {
  font-weight:bold;
}

.wl_cp_tooltiptext{
  position: relative;
  cursor: pointer;
}

.wl_cp_tooltiptext::after{
  position: absolute;
  opacity: 0;
  transition: 0s;
  top: 0px;
  right: 0;
  left: 0px;
  display: block;
  padding: 0.2em 0.5em;
  content: attr(data-tooltip);
  color: #ffffff;
  border-radius: 6px;
  background: rgba(17,17,17,.8);
  overflow: hidden;
  word-break: break-all;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.wl_cp_tooltiptext:hover::after{
  top: 26px;/*HOVER位置*/
  opacity: 1;
  left:0;
  transition:0;
  right:auto;
  white-space: nowrap;
}

.wl_cp_tooltiptext:hover::before{
  content: '';
  border: 8px solid transparent;
  border-bottom-color: rgba(17,17,17,.8);
  position: absolute;
  right: 23px;
  top: 11px;
}

.wl-upload .form-cmn-file-item.js-file.is-active{
  margin-top: -1px;
}

.wl-upload .file-name-width {
  padding: 0 0px 0 16px;
}

.file-name-caution{
  font-size: 13px;
  color: #44bac7;
  padding-top: 7px;
  line-height: 16px;
}
/* ==========================================================
list-ribon
========================================================== */
[class^="list-ribon-"] {
  background-repeat:  no-repeat;
  background-size: 82%;
  width: 60px;
  height: 60px;
  display: block;
  position: absolute;
  top: -3px;
  left: -3px;
}

.list-ribon-new{
  background-image: url(../img/common/new.png);
}

.list-ribon-attn {
  top: 0px;
  left: 0px;
  background-image: url(../img/common/attention.png);
}

/* ==========================================================
mfp-float-dl
========================================================== */
.mfp-float-dl{
  transition: 0s;
}

.mfp-float-dl.is-active{
  background-color: rgba(0,0,0,0.8);
  height: 786px;
  bottom: 0px;
}

.mfp-float-dl.is-active .mfp.is-success{
  background-color: #fff;
  margin-top: 215px;
}

.dl-close-button{
  top: 27px;
}

.z-index-0{
  z-index: 0 !important;
}

.mod-cmn-article-body-btn {
  margin: 0.2rem auto 1.5rem auto !important;
  width: 100%;
  text-align: center;
}

.mod-cmn-article-body-btn a {
  max-width: 100%;
  font-size: 100%;
}

.mod-cmn-article-body-btn-p {
  padding: 3% 5%;
}

.mod-cmn-board-item-point-0{
  padding-top: 0;
}

/* ==========================================================
mod-profile
========================================================== */
.mod-profile-ttl{
  font-size: 24px;
  letter-spacing: 1.5px;
  text-align: center;
  line-height: 24px;
  padding-bottom: 38px;
  font-weight: bold;
}

.mod-profile-wallet-body {
  position: relative;
  width: 294px;
  height: 294px;
  padding-top: 26px;
  border: 8px solid #e0ded5;
  background-color: #ffffff;
  border-radius: 50%;
  margin: auto;
}

.mod-profile-wallet-ttl {
  padding-top: 13px;
  font-size: 20px;
  color: #44bac7;
  text-align: center;
  line-height: 20px;
  font-weight: bold
}

.mod-profile-wallet-subttl{
  padding-top: 4px;
  font-size: 16px;
  line-height: 16px;
}

.mod-profile-wallet-txt{
  padding-top: 6px;
  font-size: 70px;
  line-height: 70px;
  font-family: RobotoSlab-Light;
  color: #ff5a5f;
}

.mod-profile-wallet-unit{
  font-size: 34px;
  line-height: 34px;
  margin-left: 4px;
}

.mod-profile-add{
  padding-bottom: 15px;
}

.mod-profile-add-guide{
  padding-bottom: 15x;
  font-size: 22px;
  margin-top: 30px;
  position: relative;
  display: inline-block;
  padding: 0px 14px;
}

.mod-profile-add-txt{
  line-height: 30px;
}

.mod-profile-line:before{
  content: '';
  position: absolute;
  top: 4px;
  background: url(../img/common/img_profile_line_left.png) no-repeat;
  width: 24px;
  height: 55px;
  left: -24px;
  background-size: 20px 30px;
}

.mod-profile-line:after{
  content: '';
  position: absolute;
  top: 4px;
  background: url(../img/common/img_profile_line_right.png) no-repeat;
  width: 24px;
  height: 55px;
  right: -24px;
  background-size: 20px 30px;
}

.mod-profile-add-btn{
  text-align: center;
  padding-bottom: 10px;
}

.mod-profile-add-btn-txt{
  font-size: 20px;
  line-height: 30px;
  color: #474747;
}

.mod-profile-caution{
  text-align: -webkit-center;
  padding-top: 30px;
  padding-bottom: 15px;
}

.mod-profile-caution-list{
  font-size: 16px;
  color: #474747;
  text-align: left;
  line-height: 24px;
  width: 540px;
  padding-left: 1em;
  text-indent: -1em;
}

.mod-profile-link{
  font-size: 16px;
  text-align: center;
  padding-top: 15px;
  line-height: 16px;
}

.arrow-blue-link{
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 15px;
  height: 15px;
  background-size: 15px;
  margin-right: 10px;
}

.mod-profile-link-btn{
  padding-right: 20px;
  display: inline-block;
  text-align: -webkit-left;
  width: 190px;
}

.mod-profile-link-center {
  text-align: center;
}

.mod-profile-link-right {
  text-align: right;
}

/* ==========================================================
choice-other
========================================================== */
.choice-other-disabled {
  pointer-events: none;
}

.choice-other-pt-20{
  padding-top: 20px;
}

.ico-cmn-kuji {
  background: url(../img/common/kuji_icon.png) no-repeat 0 0;
  width:58px;
  height: 59px;
  background-size:100%;
}

.ico-cmn-mymenu_arrow {
  background: url(../img/common/mymenu_arrow.png) no-repeat 0 0;
  width:10px;
  height:18px;
  background-size:100%;
}

.mod-cmn-menu-kuji .mod-cmn-menu-ttl {
  padding-right: 16px;
}

/* ==========================================================
remuneration
========================================================== */

.rem-list {
    font-size: 16px;
    color: #474747;
    text-align: left;
}

.rem-center {
    text-align: center;
}

.rem-comment {
    margin-top: 60px;
    margin-bottom: 40px;
}

.rem-link {
    text-align: center;
    margin-top:40px;
    margin-bottom: 60px;
}

.rem-link > a {
    font-size: 16px;
    color: #1E97CD;
}

.rem-link-right {
    text-align: right;
}

.rem-link-right > a {
    font-size: 16px;
    color: #1E97CD;
}


.rem-ico-arrow {
  width: 9px;
  height: 11px;
  vertical-align: middle;
}

.rem-circle-left {
  padding-top: 12px;
}

.rem-circle-right {
  padding-top: 12px;
}

.accordion-open{
  display: block;
}

.search-toggle-icon{
  background: url(../img/common/ico_select_01.png) no-repeat 0 0;
  width: 13px;
  height: 10px;
  background-size: 80%;
 top: 3px;
  position: relative;
  margin-bottom: 3px;
}

.rem_cell_full {
  display: inline-block;
  width: 100%
}

.rem_cell_half {
  display: table-cell;
  width: 50%
}

.rem-link-right {
  text-align: right;
}

/* About */
.rem-about-line {
  vertical-align: top;
}

.rem_about_top {
  padding-top: 52px;
  padding-bottom: 80px;
}

.rem_about_bottom {
  margin-top: 29px;
}

/* Request */
.rem-req-box {
  width: 560px;
  background: #fff;
  padding: 29px 30px 19px 30px;
  border: 1px solid #e0ded5;
  border-radius: 8px;
}

.rem-req-box-in {
  width: 100%;
}

.rem-req-box-line {
  width: 100%;
  display: table;
}

.rem-req-box-title {
  width: 50%;
  display: table-cell;
  text-align: left;
  vertical-align: top;
  padding-top: 6px;
}

.rem-req-box-title-text {
  font-size:24px;
  color: #474747;
  font-weight: bold;
}

.rem-req-box-money {
  width: 50%;
  display: table-cell;
  text-align: right;
  vertical-align: top;
  margin-top: 6px;
}

.rem-req-box-money-number {
  font-size: 40px;
  font-weight:bold;
  color:#ff5a5f;
}

.rem-req-box-money-unit {
  font-size: 22px;
  font-weight: bold;
  color: #ff5a5f;
}

.rem-arrow-blue-link-up {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 9px;
  height: 12px;
  background-size: 9px 12px;
  -webkit-transform: rotate(270deg);
  text-align: center;
  vertical-align: middle;
}

.rem-arrow-blue-link-down {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 9px;
  height: 12px;
  background-size: 9px 12px;
  -webkit-transform: rotate(90deg);
  text-align: center;
  vertical-align: middle;
}

.rem-req-box-limit-line {
  text-align: right;
  width: 100%;
  margin-top: 20px;
}

.rem-req-box-limit-icon {
  display: inline-block;
  margin-right: 4px;
  margin-left: 11px;
}

.rem-req-box-limit-text {
  display: inline-block;
  font-size: 14px;
}

/* Request accordion */

.rem-req-accordion-link {
  margin-top: 33px;
  margin-bottom: 13px;
  width: 100%;
  padding-top:auto;
  padding-bottom:auto;
}

.rem-req-accordion-link > a {
  font-size: 16px;
  color: #1e97cd;
}

.rem-req-accordion-limit-line {
  margin-bottom: 20px;
  display: table;
  width: 100%;
}

.rem-req-accordion-limit-line:first-child {
  margin-top: 43px;
}

.rem-req-accordion-limit-line:last-child {
  margin-bottom: 0px;
}

.rem-req-accordion-limit-date {
  display: table-cell;
  font-size: 16px;
  color: #474747;
  text-align: left;
}

.rem-req-accordion-limit-money {
  display: table-cell;
  text-align: right;
}

/* arrow */
.rem-icon-arrow-under {
  background: url(../img/common/icon_arrow.png) no-repeat;
  width: 20px;
  height: 29px;
  background-size: 20px 29px;
  margin-top: 20px;
  margin-bottom: 20px;
}

/* button */
.rem-req-button-messeage {
  font-size: 14px;
  color: #9b9b9b;
  font-weight: bold;
}

.rem-req-button-alert {
  font-size: 14px;
  color: #ff5a5f;
  font-weight: bold;
}

.rem-req-button {
  margin-top: 13px;
  margin-bottom: 0px;
  height: 60px;
}

.rem-btn {
  display: inline-block;
  width: 360px;
  outline: none;
  letter-spacing: normal;
  margin-left: 40px;
  margin-bottom: 2px;
  vertical-align: middle;
  transition: 0.1s;

  height: 56px;
  font-size: 20px;
  font-weight: bold;
  color: #474747;
  text-align: center;
  background: #ffd500;
  box-shadow: 0px 4px 0px 0px #e0bb00;
  border-radius: 8px;
  margin: 0 auto;
}

.rem-btn:disabled {
  box-shadow: 0px 4px 0px 0px #808080;
  background-color: #808080;
  color: #d8d8d8;
  opacity: 1;
}

.rem-btn:hover:not(:disabled) {
  box-shadow: 0px 1px 0px 0px #cdaa00;
  background-color: #ffcd00;
  color: #796a3c;
  margin-top: 2px;
  margin-bottom: 0px;
  opacity: 1;
}

/* Plan */

.rem-plan-box {
  width:100%;
  margin-bottom: 20px;
}

.rem-plan-box-margin {
  height: 60px;
}

.rem-plan-box-top {
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  width: 560px;
  background: #44bac7;
  padding: 12px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.rem-plan-box-accordion {
  width: 560px;
  background: #fff;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  padding:31px 30px 28px 30px;
  border: 1px solid #e0ded5;
}

.rem-plan-req-text {
  font-size: 14px;
  font-weight: bold;
  margin-bottom: 19px;
}

.rem-plan-req-line {
  margin-bottom: 8px;
  width: 100%;
  display: table;
}

.rem-plan-req-line:last-child {
  margin-bottom: 0px;
}


.rem-plan-req-date {
  text-align: left;
  display: table-cell;
}

.rem-plan-req-money {
  text-align :right;
  display: table-cell;
}

/* common */
.rem-cmn-no-top {
  margin-top: 0px;
}

.rem-arrow-blue-link-right {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 8px;
  height: 10px;
  background-size: 8px 10px;
  margin-right: 10px;
}

.rem-cmn-list-text {
  font-size: 16px;
  color: #474747;
}

.rem-cmn-list-number {
  font-size:20px;
  color: #474747;
}

.rem-daddress-confirm-link {
	text-decoration: underline;
}

/* btn-cmn-in-remuneration
---------------------------------------------------------- */
.btn-cmn-in-remuneration {
  height:70px;
}

.btn-cmn-in-rem-return {
  padding-top:10px;
}

/* ==========================================================
help
========================================================== */
.ico-help-first {
  background: url(../img/common/first_hover.png) no-repeat;
  width: 30px;
  height: 46px;
  background-size: 100%;
  margin-right: 30px;
  margin-left: 8px;
}

.ico-help-first:before {
  background: url(../img/common/first.png) no-repeat;
  width: 30px;
  height: 46px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.ico-help-poikatsu {
  background: url(../img/common/poikatsu_hover.png) no-repeat;
  width: 45px;
  height: 42px;
  background-size: 100%;
  margin-right: 15px;
  margin-left: 8px;
}

.ico-help-poikatsu:before {
  background: url(../img/common/poikatsu.png) no-repeat;
  width: 45px;
  height: 42px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.ico-help-fancrew {
  background: url(../img/common/ic_moniter_hover.png) no-repeat;
  width: 46px;
  height: 46px;
  background-size: 100%;
  margin-right: 18px;
  margin-left: 8px;
}

.ico-help-fancrew:before {
  background: url(../img/common/ic_moniter.png) no-repeat;
  width: 46px;
  height: 46px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.ico-help-jobuta-apurihiroba {
  background: url(../img/common/ic_jobta-app_hover.png) no-repeat;
  width: 52px;
  height: 52px;
  background-size: 100%;
  margin-right: 18px;
  margin-left: 2px;
}

.ico-help-jobuta-apurihiroba:before {
  background: url(../img/common/ic_jobta-app.png) no-repeat;
  width: 52px;
  height: 52px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.ico-help-friend {
  background: url(../img/common/ic_friend_hover.png) no-repeat;
  width: 46px;
  height: 46px;
  background-size: 100%;
  margin-right: 18px;
  margin-left: 7px;
}

.ico-help-friend:before {
  background: url(../img/common/ic_friend.png) no-repeat;
  width: 46px;
  height: 46px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.ico-help-describe {
  background: url(../img/common/describe_hover.png) no-repeat;
  width: 30px;
  height: 46px;
  background-size: 100%;
  margin-right: 21px;
  margin-left: 6px;
}

.ico-help-describe:before {
  background: url(../img/common/describe.png) no-repeat;
  width: 30px;
  height: 46px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.ico-help-qa {
  background: url(../img/common/qa_hover.png) no-repeat;
  width: 45px;
  height: 45px;
  background-size: 100%;
  margin-right: 22px;
}

.ico-help-qa:before {
  background: url(../img/common/qa.png) no-repeat;
  width: 45px;
  height: 45px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.ico-help-dpoint {
  background: url(../img/common/dpoint_hover.png) no-repeat;
  width: 45px;
  height: 45px;
  background-size: 100%;
  margin-right: 20px;
}

.ico-help-dpoint:before {
  background: url(../img/common/dpoint.png) no-repeat;
  width: 45px;
  height: 45px;
  background-size: 100%;
  opacity: 1;
  transition: opacity 0.3s;
  content: '';
  position: absolute;
  margin: auto;
}

.help-menu-item {
  margin-bottom: 20px;
}

.help-menu-item:last-child {
  margin-bottom: 0px;
}

.help-menu-child-item {
  width: 50%;
  margin-bottom: 23px;
}

.help-menu-child-item:nth-last-child(-n+2) {
  width: 50%;
  margin-bottom: 0px;
}

.help-item-parent.mod-cmn-menu {
  padding: 16px 29px 16px 24px;
}

.help-item-child.mod-cmn-menu {
  padding: 31px 29px 30px 34px;
}

.help-item-child-list {
  display: flex;
  flex-wrap: wrap;
}

.mod-cmn-accordion + .help-item-child {
  display: none;
}

.help-item-child-list .arrow-blue-link{
  background: url(../img/common/icon_arrow_blue_right.png) no-repeat;
  width: 8px;
  height: 10px;
  background-size: 100%;
  margin-right: 11px;
}

.help-parent-menu-height {
  height: 80px;
}

.help-item-parent:hover .ico-help-first:before,
.help-item-parent:hover .ico-help-poikatsu:before,
.help-item-parent:hover .ico-help-fancrew:before,
.help-item-parent:hover .ico-help-jobuta-apurihiroba:before,
.help-item-parent:hover .ico-help-friend:before,
.help-item-parent:hover .ico-help-describe:before,
.help-item-parent:hover .ico-help-qa:before,
.help-item-parent:hover .ico-help-dpoint:before {
  opacity: 0;
}

/* ==========================================================
luckybox
========================================================== */
.luckybox-contents-main.contents-main {
  padding-top: 60px;
}

.luckybox-mission-ico.unopened i, .luckybox-mission-ico-popup.unopened i,
.luckybox-mission-ico.unachieved i, .luckybox-mission-ico.coupon-mission i, .luckybox-mission-ico-popup.coupon-mission i{
  width: 58px;
  height: 68px;
  margin-left: 0;
  position: relative;
}

.luckybox-mission-ico i, .luckybox-mission-ico-popup i {
  width: 92px;
  height: 71px;
  margin-left: -24px;
  position: relative;
}

.ico-cmn-luckybox-basic-main {
  background: url(../img/common/box_basic_opend.png) no-repeat;
  background-size: 100%;
}

.unachieved .ico-cmn-luckybox-basic-main {
  background: url(../img/common/box_basic_lock.png) no-repeat;
  background-size: 100%;
}

.unopened .ico-cmn-luckybox-basic-main {
  background: url(../img/common/box_basic.png) no-repeat;
  background-size: 100%;
}

.ico-cmn-luckybox-premium-main {
  background: url(../img/common/box_premium_opend.png) no-repeat;
  background-size: 100%;
}

.unachieved .ico-cmn-luckybox-premium-main {
  background: url(../img/common/box_premium_lock.png) no-repeat;
  background-size: 100%;
}

.unopened .ico-cmn-luckybox-premium-main {
  background: url(../img/common/box_premium.png) no-repeat;
  background-size: 100%;
}

.ico-cmn-luckybox-profile-main {
  background: url(../img/common/box_profile_opend.png) no-repeat;
  background-size: 100%;
}

.unachieved .ico-cmn-luckybox-profile-main {
  background: url(../img/common/box_profile_lock.png) no-repeat;
  background-size: 100%;
}

.unopened .ico-cmn-luckybox-profile-main {
  background: url(../img/common/box_profile.png) no-repeat;
  background-size: 100%;
}

.ico-cmn-luckybox-premium-exclusive-main {
  background: url(../img/common/box_premium_exclusive_opend.png) no-repeat;
  background-size: 100%;
}

.unachieved .ico-cmn-luckybox-premium-exclusive-main {
  background: url(../img/common/box_premium_exclusive_lock.png) no-repeat;
  background-size: 100%;
}

.unopened .ico-cmn-luckybox-premium-exclusive-main {
  background: url(../img/common/box_premium_exclusive.png) no-repeat;
  background-size: 100%;
}

.unachieved .ico-cmn-luckybox-premium-privilege {
  background: url(../img/common/basic_upgread-box_lock.png) no-repeat;
  background-size: 100%;
}

.unopened .ico-cmn-luckybox-premium-privilege, .coupon-mission .ico-cmn-luckybox-premium-privilege {
  background: url(../img/common/basic_upgread-box_open.png) no-repeat;
  background-size: 100%;
}

.lucky-box-pointup {
  padding-left: 27px;
}

.ico-cmn-luckybox-pointup-red,
.ico-cmn-luckybox-pointup-orange,
.ico-cmn-luckybox-pointup-green {
  display:none;
}

.unopened .ico-cmn-luckybox-pointup-red,
.unachieved .ico-cmn-luckybox-pointup-red {
  width: 27px !important;
  height: 36px !important;
  left: -20px;
  top: 17px;
  position: relative;
  background: url(../img/common/luckybox_pointup_red.gif) no-repeat;
  background-size: 27px;
  display: inline-block;
}

.unopened .ico-cmn-luckybox-pointup-orange,
.unachieved .ico-cmn-luckybox-pointup-orange {
  width: 27px !important;
  height: 36px !important;
  left: -20px;
  top: 17px;
  position: relative;
  background: url(../img/common/luckybox_pointup_orange.gif) no-repeat;
  background-size: 27px;
  display: inline-block;
}

.unopened .ico-cmn-luckybox-pointup-green,
.unachieved .ico-cmn-luckybox-pointup-green {
  width: 27px !important;
  height: 36px !important;
  left: -20px;
  top: 17px;
  position: relative;
  background: url(../img/common/luckybox_pointup_green.gif) no-repeat;
  background-size: 27px;
  display: inline-block;
}

.luckybox-info-empty-work-finish {
  padding: 40px 205px 40px;
}

.luckybox-info-point {
  width: 300px;
  margin: 0 auto 0;
}

.luckybox-achievement-link {
  text-align: center;
  margin-top: 5px;
  position: relative;
  left: 125px;
  margin-bottom: 12px;
}

.luckybox-get-point-area {
  text-align: center;
}

.luckybox-info-title-area {
  background-color: #44bac7;
  border-width: 1px;
  border-color: #e0ded5;
  border-radius: 8px 8px 0 0;
  height: 40px;
}

.luckybox-info-title-text {
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  padding: 9px 11px 11px 11px;
  letter-spacing: 1.33px;
}

.luckybox-info-contents-area {
  background-color: #fff;
  border-width: 1px;
  border-color: #e0ded5;
  border-left-style: solid;
  border-bottom-style: solid;
  border-right-style: solid;
  border-radius: 0 0 8px 8px;
}

.luckybox-info-get-point-text {
  color: #ff5a5f;
  font-family: "Roboto Slab", serif;
  font-weight: bold;
  padding: 17px 17px 18px 17px;
  position: relative;
  display: block;
  height: 75px;
}

.luckybox-info-get-point-number {
  font-size: 60px;
  margin-right: 10px;
  display: inline-block;
  margin-top: -27px;
}

.luckybox-info-get-point-unit {
  font-size: 34px;
}

.luckybox-info-text {
  font-size: 20px;
  font-weight: bold;
  color: #44bac7;
  text-align: center;
}

.luckybox-info-job-count {
  font-size: 40px;
  color: #ff5a5f;
  font-family: "Roboto Slab", serif;
}

.ico-cmn-luckybox-basic-noshadow {
  background: url(../img/common/box_green_noshadow.png) no-repeat;
  width: 50px;
  height: 55px;
  background-size: 100%;
}

.ico-cmn-luckybox-premium-noshadow {
  background: url(../img/common/box_red_noshadow.png) no-repeat;
  width: 50px;
  height: 55px;
  background-size: 100%;
}

.luckybox-job-count-graph-area {
  position: relative;
}

.luckybox-job-count-graph-bar-yellow {
  background-color: #ffd500;
}

.luckybox-job-count-graph-bar-gray {
  background-color: #e0ded5;
  -webkit-flex-grow: 0;
  -ms-flex-positive: 0;
  flex-grow: 1;
}

.luckybox-job-count-graph-bar-gray:last-child {
  border-radius: 0 8px 8px 0;
}

.luckybox-job-count-graph {
  width: 505px;
  height: 30px;
  display: inline-flex;
  position: absolute;
  bottom: 4px;
  left: 46px;
}

.luckybox-info-link-area {
  height: 0px;
  text-align: right;
  margin-top: 30px;
  margin-bottom: 81px;
}

.luckybox-info-link {
  font-size: 14px;
  color:#1e97cd;
}

.luckybox-info-link:before {
  content: '';
  position: absolute;
  margin: 6px 10px 0 -20px;
  border-style: solid;
  border-width: 5px 0 5px 8px;
  border-color: transparent transparent transparent #1e97cd;
}

.unopened .luckybox-click-inside, .paid-option-mission .luckybox-click-inside {
  border-radius: 50%;
  background: url(../img/common/circle_icon_message.png) no-repeat;
  width: 37px;
  height: 37px;
  position: absolute;
  top: 25px;
  left: 44px;
  -webkit-animation: flash 0.8s infinite;
  animation: flash 0.8s infinite;
  font-size: 8px;
  letter-spacing: 0.89px;
  color: #fff;
  background-size: 100%;
}

.unopened .luckybox-click-outside, .paid-option-mission .luckybox-click-outside {
  border-radius: 50%;
  width: 46px;
  height: 46px;
  position: absolute;
  top: 20px;
  left: 39px;
  -webkit-animation: pulsate 0.8s infinite;
  animation: pulsate 0.8s infinite;
  background: url(../img/common/circle_icon_message.png) no-repeat;
  background-size: 100%;
}

.unopened .luckybox-click-text, .paid-option-mission .luckybox-click-text {
  display: block;
  line-height: 36px;
  letter-spacing: 0.77px;
  font-weight: bold;
}
.luckybox-click-text {
  display: none;
  font-weight: bold;
}

.mfp-content.luckybox-popup-wid {
  padding: 0px 0px 0px 0px;
}

.luckybox-maintenance {
  color: #fff;
  font-weight: bold;
}

.lbox-bg {
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #000;
  opacity: .8;
  z-index:1;
  border-radius: 9px;
}
.lbox-wrap {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  top: 30px;
}
.contents-lbox {
  position: relative;
  z-index: 1;
  top: 70px;
  text-align: center;
}
.pt-manyBox .contents-lbox {
  top: 70px;
}
.contents-lbox .box-wrap {
  position: relative;
  z-index: 3;
  display: block;
}
.contents-lbox > .box-wrap {
  padding-top: 64.5px;
}
.box-wrap.small{
  position: absolute;
}
.box-wrap.small img{
  display: none;
}
.pt-manyBox .box-wrap.small img {
  display: block;
  width: 80px;
}
.contents-lbox img.box-body {
  position: relative;
  width: 125px;
  margin: 0 auto;
  z-index: 5;
}
.pt-manyBox .small-box.back img {
  position: relative;
  display: block;
  width: 80px;
}
.pt-manyBox .small-box.back img {
  position: relative;
  display: block;
  width: 54px;
}
.small-box.bg {
  position: absolute;
  top: 20px;
  width: 274px;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 1;
}
.small-box.bg span {
  position: absolute;
  top: 5px;
  width: 274px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.small-box.bg img:not(.open) {
  width: 274px;
  margin: 0 auto;
}
.small-box.bg img.open {
  position: relative;
  left: -34px;
  width: 333px;
  margin: 0 auto;
  top: -10px;
  max-width: none;
}
.small-box.front {
  width: 264px;
  margin: 0 auto;
  position: relative;
  top: -105px;
  z-index: 1;
}
.small-box.back {
  width: 222px;
  margin: 0 auto;
  position: relative;
  top: -155px;
  z-index: 0;
}
.small01{ left:0; }
.small02{ right:0; }
.small03{ left:0; }
.small04{ right:0; }

.box-cover01 {
  width: 147px;
  position: absolute;
  z-index: 6;
  top:0;
  right: 0;
  display: block;
  margin: 0 auto;
  left:0;
}

.box-cover02 {
  width: 158px;
  position: absolute;
  z-index: 1;
  top:10px;
  right: 100px;
  display: block;
  margin: 0 auto;
  left:0;
}

.contents-close {
  display: block;
  position: relative;
  z-index: 99;
  width: 120px;
  background-color: #fff;
  text-align: center;
  border-radius: 50px;
  margin: 0 auto;
  top: 160px;
}
.contents-bg-light {
  position: relative;
  z-index: 1;
}
.contents-bg-paper {
  position: relative;
  z-index: 5;
}
.contents-bg-light img.time01 {
  position: absolute;
  height: 400px;
  width: 400px;
  margin-left: -200px;
  left: 50%;
  top: 120px;
  z-index: 1;
}
.contents-bg-light img.time02 {
  position: absolute;
  height: 600px;
  width: 600px;
  margin-left: -300px;
  left: 50%;
  top: 0px;
  z-index: 1;
}
.contents-bg-paper img.paper01-sp, .contents-bg-paper img.paper02-sp {
  position: absolute;
  height: 580px;
  width: auto;
  top: 50px;
  z-index: 1;
  margin: auto;
  right: 0;
  left: 0;
}
.contents-bg-paper img.paper01-sp {
  z-index: 2;
}
.contents-close_text {
  font-size:15px;
  color: #808080;
  display: inline-block;
  position: relative;	font-size:15px;
  right: 8px;
}
.ico-close-01, .ico-close-02 {
  display: inline-block;
  position: relative;
  top: -4px;
  width: 20px;
  height: 2px;
  background-color: #808080;
}
.ico-close-01 {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  left: 4px;
}
.ico-close-02 {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  left: -16.5px;
}
.contents-point {
  position: relative;
  z-index: 99;
  width: 275px;
  margin: 0 auto;
  top: 160px;
}
.contents-point .img-flag {
  position: relative;
  z-index: 2;
  display: block;
  width: 180px;
  margin: 0 auto -15px;
}
:not(.pt-premium) .img-flag.premium { display: none; }
.pt-premium .img-flag.premium { display: block; }
.pt-premium .img-flag:not(.premium) { display: none; }
.contents-point .img-frame {
  display: block;
  width: 275px;
  margin: 0 auto;
}
.contents-point .txt-point {
  position: absolute;
  display: block;
  width: 100%;
  text-align: center;
  margin: 0 auto;
  top: 28px;
  color: #ff5a5f;
  font-family: "roboto slab";
}
.contents-point .txt-point span {
  font-size: 50px;
}
.contents-point .txt-point span.present-point {
  font-size: 70px;
}
.paper01-pc, .paper02-pc { display: none; }

.pt-manyBox .contents-point {
  top: 160px;
}

.paper01-sp.premium, .paper01-pc.premium{ display: none; }
.pt-premium .paper01-sp:not(.premium) { display: none; }
.pt-premium .paper01-sp.premium { display: block; }

.pt-member .green { display: none; }
:not(.pt-member) .red { display: none; }
.pt-member .red { display: block; }

:not(.pt-prof) .white,
.pt-prof .red,
.pt-prof .green {
    display: none;
}
.pt-prof .white {display: block;}

.luckybox-mission-detail {
  text-align: right;
}

.luckybox-mission-detail-40per {
  max-width: 40%;
}

.luckybox-mission-detail-text {
  width: 149px;
  color: #1E97CD;
  font-size: 15px;
  background-color: #E0F5FF;
  border-radius: 5px; 
  padding: 5px 7px 5px 5px;
  float: right;
}

.luckybox-mission-detail-text-flex {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}

.luckybox-mission-detail-triangle {
  display: inline-block;
  margin-right: 1px;
  background-image: url(../img/common/icon_arrow_blue_right.png);
  background-size: 10px;
  height: 10px;
  width: 10px;
}

.luckybox-select-cate-area {
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  height: 90px;
}

.luckybox-select-cate {
  display: -webkit-flex;
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  margin-bottom: 35px;
  border-bottom: 1px solid #44bac7;
  width: 90%;
  justify-content: center;
  gap: 8px;
}

.luckybox-select-cate-tab {
  height: 47px;
  position: relative;
  padding-top: 14px;
}

.luckybox-select-cate-btn {
  padding: 4px;
  height: 41px;
  width: 130px;
  line-height: 33px;
  font-size: 16px;
  text-align: center;
  color: #44bac7;
  border-radius: 8px 8px 0px 0px;
  border: 1px solid #44bac7;
  border-bottom: none;
  cursor: pointer;
  background: #fff;
}

.luckybox-select-cate-btn:not(:first-child):not(:last-child) {
  margin: 0px 4px;
}

.luckybox-select-cate-btn-border {
  border-bottom: solid #44bac7 1px;
}

.luckybox-select-cate-btn.selected {
  color: #fff;
  background: #44bac7;
}

.luckybox-select-cate-btn:hover {
  opacity: .7;
}

.luckybox-select-cate-btn-badge {
  display:block;
  width: 14px;
  height: 14px;
  border-radius	: 50%;
  background: #ff5a5f;
  z-index: 10;
  top: 9px;
  right: -4px;
  position: absolute;
}

.luckybox-no-card-message-area {
  margin-top: 20px;
  display: table;
  width: 100%;
  text-align: center;
}

.luckybox-no-card-message {
  background-color: #efede1;
  border-radius	: 8px;
  width: 500px;
  padding: 41px 18px;
  vertical-align: middle;
  display: inline-block;
  color: #1E97CD;
  font-size: 20px;
  line-height: 30px;
  text-align: center;
}

.luckybox-no-card-message-ico {
  display: inline-block;
  width: 145px;
  vertical-align: middle;
  text-align: center;
}

.luckybox-no-card-message-ico-opend {
  width: 92px;
  height: 71px;
  margin-left: -24px;
  position: relative;
  left: 10px;
}

/*************************************************
mission
*************************************************/
.mission-open-top {
  text-align: center;
  margin-bottom: 44px;
}
.mission-open-top .btn-cmn-in {
  letter-spacing: 1.11px;
}
.mission-item {
  margin-top: 20px;
  display: table;
  width: 100%;
  text-align: center;
  letter-spacing: -.5em;
}
.mission-item * {
  letter-spacing: normal;
}
.luckybox-mission-btn:not(.open-all), .luckybox-mission-btn-popup:not(.open-all){
  width: 500px;
  background-color: #efede1;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  padding: 20px 30px 17px;
  vertical-align: middle;
}

.unopened.luckybox-mission-btn-pointup, .unopened.luckybox-mission-btn-premium-box-privilege,
.unachieved.luckybox-mission-btn-pointup, .unachieved.luckybox-mission-btn-premium-box-privilege {
  padding-bottom: 15px;
}

.unopened.luckybox-mission-btn:not(.open-all), .unopened.luckybox-mission-btn-popup:not(.open-all){
  padding-bottom: 20px;
}
.unachieved.luckybox-mission-btn:not(.open-all),
.unopened.luckybox-mission-btn:not(.open-all), .unopened.luckybox-mission-btn-popup:not(.open-all){
  background-color: #ffffff;
}
.mission-name {
  font-size: 20px;
  line-height: 18px;
  font-weight: bold;
  text-align: left;
  letter-spacing: 1px;
}
.ico-cmn-mission-beginner {
  background: url(../img/common/guide_icon.png) no-repeat;
  background-size: 100%;
  width: 13px;
  height: 20px;
  margin: -1px 0 -1px 12px;
  position: relative;
  top: -1px;
}
.unopened .mission-clear {
  text-align: right;
  margin-top: 11px;
  display: block;
}
.mission-clear {
  display:none;
}
.mission-clear span:nth-child(1){
  float: left;
  color: #ff5a5f;
  font-size: 16px;
  line-height: 13px;
  font-weight: bold;
}
.paid-option-mission .mission-clear span:nth-child(1){
  color: #474747;
}
.mission-clear span:nth-child(2){
  color: #999999;
  font-size: 14px;
  line-height: 13px;
  font-weight: bold;
}
.mission-point {
  color: #ff5a5f;
  font-size: 22px;
  line-height: 16px;
  font-weight: bold;
  margin-top: 5px;
}
.mission-point span{
  font-size: 16px;
  line-height: 15px;
  margin-left: 2px;
}

.mission-point-old {
  color: #454545;
  font-size: 16px;
  line-height: 21px;
  font-weight: bold;
  text-decoration: line-through;
}

.mission-pointup, .mission-premium-box-privilege, .luckybox-mission-next-period-region, .luckybox-mission-next-period-region-flex {
  padding-top: 7px;
}

.luckybox-mission-next-period-region-flex {
  display: -webkit-flex;
  display: flex;
  justify-content: space-between;
}

.luckybox-mission-next-period-region-wrapp {
  width: 60%;
  text-align: left;
}

.mission-pointup-text {
  display: inline-block;
  width: 50%;
  text-align: left;
  color: #FF5A5F;
  font-size: 16px;
  font-weight: bold;
}

.mission-pointup-period, .mission-premium-box-privilege-period{
  display: inline-block;
  width:50%;
  text-align: right;
  color: #999999;
  font-size: 16px;
  font-weight: bold;
}

.mission-premium-box-privilege-text {
  display: inline-block;
  width: 50%;
  text-align: left;
  color: #FF5A5F;
  font-size: 16px;
  font-weight: bold;
  font-family: "Roboto Slab", serif;
}

.luckybox-next-period, .mission-end-date {
  display: inline-block;
  width: 60%;
  text-align: left;
  vertical-align: middle;
  font-size: 12px;
  line-height: 11px;
  font-weight: bold;
  color: #333333;
}

.luckybox-mission-next-period-region-wrapp .luckybox-next-period,
.luckybox-mission-next-period-region-wrapp .mission-end-date {
  width: 100%;
}

.no9-mission-bar-region {
  display: table;
  width: 100%;
  margin-top: 5px;
  table-layout: fixed;
}
.no9-mission-bar-parts {
  display: table-cell;
}
.no9-mission-bar-txt {
  float: left;
  font-size: 12px;
}
.mission-bar {
  position: relative;
  width: 100%;
  height: 16px;
  border-radius: 6px;
  border: 1px solid #e0ded5;
  padding: 1px;
  margin-top: 20px;
  background-color: #fff;
  overflow: hidden;
  margin-bottom: 8px;
}
.mission-bar-txt {
  font-size: 12px;
  line-height: 11px;
  font-weight: bold;
  color: #333333;
  position: absolute;
  top: 2px;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 3;
}
.mission-bar-achieve {
  background-color: #bcbcbc;
  height: 12px;
  border-radius: 6px;
  position: relative;
  z-index: 2;
}
.unachieved .mission-bar-achieve,
.unopened .mission-bar-achieve {
  width: 0%;
  background-color: #64bcc3;
  transition: all 2s ease 0s;
}
.unachieved .mission-bar-achieve {
  border-radius: 6px 0 0 6px;
}
.unachieved .mission-parts-achieve {
  border-radius: 6px;
}
.mission-bar-remaining {
  background-color: #e0ded5;
  height: 12px;
  border-radius: 6px;
  width: calc(100% - 2px);
  position: absolute;
  top: 1px;
  z-index: 1;
}
.unachieved .mission-bar-remaining {
  border-radius: 6px;
}
.luckybox-mission-ico , .luckybox-mission-ico-popup {
  width: 145px;
  vertical-align: middle;
  position: relative;
}
.mfp-fade.mfp-wrap .mfp-content.mission-description-popup {
  transition: none;
  padding: 0;
}
.coupon-luckybox-link {
  font-size: 16px;
  text-decoration: underline;
}
.coupon-popup-btn {
  height: 77px;
}
.coupon-luckybox-all-txt {
  position: relative;
  top: 13px;
}
.mission-popup-ttl {
  padding: 10px;
  background-color: #44bac7;
  color: #ffffff;
  line-height: 24px;
  font-size: 24px;
  text-align: center;
  border-radius: 10px 10px 0 0;
}
.mission-popup-content {
  padding: 20px;
}
.mission-display-change {
  display: block;
  width: fit-content;
  margin: 15px auto 0;
  color: #1e97cd;
  cursor: pointer;
}
.mission-popup-achievement-conditions {
  margin-bottom: 15px;
  font-weight: bold;
  text-align: center;
  font-size: 24px;
}
.mission-popup-interval-area {
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  margin-bottom: 15px;
}
.mission-item + .mission-popup-interval-area {
  margin-top: 15px;
}
.interval-timer-icon-detail {
    width: 80px;
}
.interval-timer-detail {
  font-weight: bold;
  text-align: center;
}
.interval-timer-ttl {
  font-size: 24px;
}
.interval-timer-countdown {
  font-size: 17px;
}
.interval-timer-countdown .timer-txt {
  font-size: 24px;
  color: #44bac7;
}
.video-reward-mv {
  background: #FDDB7F;
}
.video-reward-mission:nth-of-type(n+2) {
  margin-top: 30px;
}
.video-reward-mission .unachieved {
  pointer-events: none;
}
.video-reward-head {
  width: 860px;
  margin: 0 auto;
  padding: 10px 0;
  border: 1px solid #e0ded5;
  background: #ffffff;
}
.video-reward-head-title {
  display: inline-block;
  position: relative;
  padding-left: 20px;
  font-size: 20px;
  font-weight: bold;
}
.video-reward-head-title:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background-color: #64bcc3;
  border-radius: 6px;
}
.paid-option-video-reward-promotion {
  display: inline-block;
  text-decoration: underline;
  cursor: pointer;
}
.icon-play {
  margin-right: 5px;
  height: 24px;
  width: 24px;
  background-size: 100%;
  background-repeat: no-repeat;
  background-image: url(../img/common/icon_play.png);
}
.app_required_box {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 310px;
  line-height: 15px;
  background: #E0DED5;
  margin-top: 10px;
  padding: 15px;
  text-align: center;
  color: #666666;
  font-size: 15px;
  border-radius: 10px;
  text-shadow: 0px 1px 1px #ADADAD;
}
.app_required_box:after {
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  pointer-events: none;
  position: absolute;
  border-color: rgba(224, 222, 213, 0);
  border-top-width: 20px;
  border-bottom-width: 20px;
  border-left-width: 10px;
  border-right-width: 10px;
  margin-left: -10px;
  border-bottom-color: #E0DED5;
  bottom: 100%;
  left: 50%;
}
.disclaimer-area {
  width: 860px;
  margin-top: 60px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.disclaimer-ttl {
  font-weight: bold;
  margin-bottom: 26px;
  padding: 16px 0;
  border-top: 1px solid #e0ded5;
  border-bottom: 1px solid #e0ded5;
  font-size: 24px;
}
.disclaimer-txt {
  list-style: unset;
  padding-left: 20px;
  text-align: left;
}
/*************************************************
PC
*************************************************/
@media all and (min-width: 767px) {
  .paper01-sp, .paper02-sp { display: none; }
  img.paper01-sp.premium, img.paper01-pc.premium{ display: none; }
  .pt-premium .paper01-pc:not(.premium){ display: none; }
  .pt-premium .paper01-sp.premium { display: none; }

  :not(.pt-premium) .paper01-pc{ display: block; }
  :not(.pt-premium) .paper01-pc.premium { display: none; }
  .pt-premium .paper01-pc.premium, .paper02-pc { display: block; }

  .contents-lbox {
    top: 120px;
  }
  .pt-manyBox .contents-lbox {
    top: 120px;
  }
  .contents-point {
    top: 210px;
  }
  .pt-manyBox .contents-point {
    top: 210px;
  }
  .contents-bg-light img.time01 { top:180px; }
  .contents-bg-light img.time02 {
    position: absolute;
    width: 748px;
    height: 748px;
    left: 0;
    right: 0;
    z-index: 1;
    margin: auto;
  }
  .contents-bg-paper img.paper01-pc, .contents-bg-paper img.paper02-pc {
    position: absolute;
    height: auto;
    width: 748px;
    top: 70px;
    z-index: 1;
    margin: 0 auto;
    left: 0;
    right:0;
  }
  .contents-close {
    top: 271px;
    left:200px;
  }
  .ico-close-01 {
    left: 9px;
  }
  .ico-close-02 {
    left: -11.5px;
  }
  .contents-point {
    width: 280px;
  }
  .contents-point .txt-point{
    top:36px
  }
  .contents-point .img-frame {
    width: 280px;
  }
  .contents-point .img-flag {
    width: 200px;
  }
}

/*************************************************
通常ポイントanimation
*************************************************/
.lbox-bg {
  -webkit-animation: bg-blk 12s linear;
  animation: bg-blk 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.contents-lbox>.box-wrap img.box-body {
  -webkit-animation: box-body 12s linear;
  animation: box-body 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.small-box:not(.bg) img {
  -webkit-animation: box-body-small 12s linear;
  animation: box-body-small 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.small-box.bg img:not(.open) {
  -webkit-animation: box-small-bg 12s linear;
  animation: box-small-bg 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.box-cover01 {
  -webkit-animation: box-cover01 12s linear;
  animation: box-cover01 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.box-cover02 {
  -webkit-animation: box-cover02 12s linear;
  animation: box-cover02 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.txt-container-normal {
  -webkit-animation: btn-close 12s linear;
  animation: btn-close 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.luckybox-cumulative-modal {
  -webkit-animation: btn-close 12s linear;
  animation: btn-close 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.luckybox-cumulative-modal.pt-premium {
  -webkit-animation: p-btn-close 12s linear;
  animation: p-btn-close 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.contents-bg-light img.time01 {
  -webkit-animation: flash-anime 12s linear;
  animation: flash-anime 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.contents-bg-light img.time02 {
  -webkit-animation: rotate-anime 120s linear;
  animation: rotate-anime 120s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.contents-bg-paper img.paper01-sp, .contents-bg-paper img.paper01-pc {
  -webkit-animation: paper01 12s linear;
  animation: paper01 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.contents-bg-paper img.paper02-sp, .contents-bg-paper img.paper02-pc {
  -webkit-animation: paper02 12s linear;
  animation: paper02 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.contents-point {
  -webkit-animation: point 12s linear;
  animation: point 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.small-box.bg img.open {
  -webkit-animation: box-small-open 12s linear;
  animation: box-small-open 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
/**********************************************************
通常ポイントanimation keyframe
***********************************************************/

/*モーダル*/
@-webkit-keyframes bg-blk {
  0% {
    opacity: 0;
  }
  2.5% {
    opacity: .8;
  }
  100% {
    opacity: .8;
  }
}
@keyframes bg-blk {
  0% {
    opacity: 0;
  }
  2.5% {
    opacity: .8;
  }
  100% {
    opacity: .8;
  }
}

/*箱が揺れているときの光のフラッシュアニメーション*/
@-webkit-keyframes flash-anime {
  0% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  2.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  4.5% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  6.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  100% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
}
@keyframes flash-anime {
  0% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  2.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  4.5% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  6.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  100% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
}
/*ポイントが表示されるときの光が回転するアニメーション*/
@-webkit-keyframes rotate-anime {
  0% {
    transition: 0s;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 0;
  }
  1.1499% {opacity: 0;}
  1.15% {opacity: 1;}
  100% {
    -webkit-transform: rotate(300deg);
    transform: rotate(300deg);
  }
}
@keyframes rotate-anime {
  0% {
    transition: 0s;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 0;
  }
  1.1499% {opacity: 0;}
  1.15% {opacity: 1;}
  100% {
    -webkit-transform: rotate(300deg);
    transform: rotate(300deg);
  }
}
/*箱の本体部分のアニメーション*/
@-webkit-keyframes box-body {
  0%  {opacity: 0;display: none;}
  2.49% {opacity: 0;display: none;}
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  10% {
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  11.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  100% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
}
@keyframes box-body {
  0%  {opacity: 0;display: none;}
  2.49% {opacity: 0;display: none;}
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  10% {
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  11.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  100% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
}
/*箱のフタ部分のアニメーション*/
@-webkit-keyframes box-cover01 {
  0% {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  4.1% {
    -webkit-transform: rotate(6deg) translateX(7.5px);
    transform: rotate(6deg) translateX(7.5px);
  }
  4.9% {
    -webkit-transform: rotate(-4deg) translateX(-5px);
    transform: rotate(-4deg) translateX(-5px);
  }
  5.3% {
    -webkit-transform: rotate(3deg) translateX(3.75px);
    transform: rotate(3deg) translateX(3.75px);
  }
  5.7% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  6.1% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  6.5% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  10% {
    -webkit-transform: translateY(110px) scale(.41);
    transform: translateY(110px) scale(.41);
  }
  11.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
    opacity: 1;
  }
  11.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes box-cover01 {
  0% {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  4.1% {
    -webkit-transform: rotate(6deg) translateX(7.5px);
    transform: rotate(6deg) translateX(7.5px);
  }
  4.9% {
    -webkit-transform: rotate(-4deg) translateX(-5px);
    transform: rotate(-4deg) translateX(-5px);
  }
  5.3% {
    -webkit-transform: rotate(3deg) translateX(3.75px);
    transform: rotate(3deg) translateX(3.75px);
  }
  5.7% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  6.1% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  6.5% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  10% {
    -webkit-transform: translateY(110px) scale(.41);
    transform: translateY(110px) scale(.41);
  }
  11.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
    opacity: 1;
  }
  11.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes box-cover02 {
  0%  {
    opacity: 0;
  }
  2.49% {
    opacity: 0;
  }
  11.5% {
    opacity: 0;
  }
  11.501% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  15.125% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
  100% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
}
@keyframes box-cover02 {
  0%  {
    opacity: 0;
  }
  2.49% {
    opacity: 0;
  }
  11.5% {
    opacity: 0;
  }
  11.501% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  15.125% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
  100% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
}
/*smallbox 箱の本体部分のアニメーション*/
@-webkit-keyframes box-body-small {
  0% {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  6.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes box-body-small {
  0% {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  6.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes box-small-bg {
  0% {
    opacity: 0;
  }
  6.5% {
    opacity: 0;
  }
  6.501% {
    opacity: 1;
    -webkit-transform: translateY(-20px) scale(.95);
    transform: translateY(-20px) scale(.95);
  }
  10% {
    opacity: 1;
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  11.5% {
    opacity: 1;
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  11.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes box-small-bg {
  0% {
    opacity: 0;
  }
  6.5% {
    opacity: 0;
  }
  6.501% {
    opacity: 1;
    -webkit-transform: translateY(-20px) scale(.95);
    transform: translateY(-20px) scale(.95);
  }
  10% {
    opacity: 1;
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  11.5% {
    opacity: 1;
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  11.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes box-small-open {
  0% {
    opacity: 0;
  }
  11.5% {
    opacity: 0
  }
  11.501% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes box-small-open {
  0% {
    opacity: 0;
  }
  11.5% {
    opacity: 0
  }
  11.501% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
/*獲得ポイントのアニメーション*/
@-webkit-keyframes point {
  0% {
    opacity: 0;
  }
  11.499%  {
    opacity: 0;
  }
  11.5%  {
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
  }
  13% {
    opacity: 1;
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }
  15% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  15.5% {
    opacity: 1;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  16% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes point {
  0% {
    opacity: 0;
  }
  11.499%  {
    opacity: 0;
  }
  11.5%  {
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
  }
  13% {
    opacity: 1;
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }
  15% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  15.5% {
    opacity: 1;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  16% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
/*紙吹雪のアニメーション１*/
@-webkit-keyframes paper01 {
  0% {
    opacity: 0;
  }
  11.499%  {
    opacity: 0;
  }
  11.5% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(56px);
    transform: translateY(56px);
  }
}
@keyframes paper01 {
  0% {
    opacity: 0;
  }
  11.499%  {
    opacity: 0;
  }
  11.5% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(56px);
    transform: translateY(56px);
  }
}
/*紙吹雪のアニメーション２*/
@-webkit-keyframes paper02 {
  0% {
    opacity: 0;
  }
  11.499% {
    opacity: 0;
  }
  11.5% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100%  {
    opacity: 1;
    -webkit-transform: translateY(24px);
    transform: translateY(24px);
  }
}
@keyframes paper02 {
  0% {
    opacity: 0;
  }
  11.499% {
    opacity: 0;
  }
  11.5% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100%  {
    opacity: 1;
    -webkit-transform: translateY(24px);
    transform: translateY(24px);
  }
}
/*閉じるボタンのアニメーション*/
@-webkit-keyframes btn-close {
  0%  {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  16% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes btn-close {
  0%  {
    opacity: 0;
  }
  15% {
    opacity: 0;
  }
  16% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
/************************************************
通常ポイントanimation　ここまで
************************************************/

/************************************************
高ポイントanimation
************************************************/
.pt-premium .lbox-bg {
  -webkit-animation: p-bg-blk 12s linear;
  animation: p-bg-blk 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .contents-lbox>.box-wrap img.box-body {
  -webkit-animation: p-box-body 12s linear;
  animation: p-box-body 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .small-box:not(.bg) img {
  -webkit-animation: p-box-body-small 12s linear;
  animation: p-box-body-small 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .small-box.bg img:not(.open) {
  -webkit-animation: p-box-small-bg 12s linear;
  animation: p-box-small-bg 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .box-cover01 {
  -webkit-animation: p-box-cover01 12s linear;
  animation: p-box-cover01 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .box-cover02 {
  -webkit-animation: p-box-cover02 12s linear;
  animation: p-box-cover02 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .btn-x {
  -webkit-animation: p-btn-close 12s linear;
  animation: p-btn-close 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .contents-close {
  -webkit-animation: p-btn-close 12s linear;
  animation: p-btn-close 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .contents-bg-light img.time01 {
  -webkit-animation: p-flash-anime 12s linear;
  animation: p-flash-anime 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .contents-bg-light img.time02 {
  -webkit-animation: p-rotate-anime 120s linear;
  animation: p-rotate-anime 120s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .contents-bg-paper img.paper01-sp.premium,.pt-premium .contents-bg-paper img.paper01-pc.premium {
  -webkit-animation: p-paper01 12s linear;
  animation: p-paper01 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .contents-bg-paper img.paper02-sp,.pt-premium .contents-bg-paper img.paper02-pc {
  -webkit-animation: p-paper02 12s linear;
  animation: p-paper02 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .contents-point {
  -webkit-animation: p-point 12s linear;
  animation: p-point 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
.pt-premium .small-box.bg img.open {
  -webkit-animation: p-box-small-open 12s linear;
  animation: p-box-small-open 12s linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
}
/**********************************************************
高ポイントanimation keyframe
***********************************************************/

/*モーダル*/
@-webkit-keyframes p-bg-blk {
  0% {opacity: 0;}
  2.5% {opacity: .8;}
  24.499% {opacity: .8;background-color:#000;}
  24.501% {
    opacity: .7;
    background-color:#fff5cb;
  }
  100% {
      opacity: .7;
      background-color:#fff5cb;
  }
}
@keyframes p-bg-blk {
  0% {opacity: 0;}
  2.5% {opacity: .8;}
  24.499% {opacity: .8;background-color:#000;}
  24.501% {
    opacity: .7;
    background-color:#fff5cb;
  }
  100% {
      opacity: .7;
      background-color:#fff5cb;
  }
}
/*箱が揺れているときの光のフラッシュアニメーション*/
@-webkit-keyframes p-flash-anime {
  0% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  2.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  4.9% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(1) translateY(-30px);
  }
  6.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  9.4% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  11% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(1) translateY(-30px);
  }
  13% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  15.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  17.9% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(1) translateY(-30px);
  }
  19.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  100% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
}
@keyframes p-flash-anime {
  0% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  2.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  4.9% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(1) translateY(-30px);
  }
  6.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  9.4% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  11% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(1) translateY(-30px);
  }
  13% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  15.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  17.9% {
    -webkit-transform: scale(1) translateY(-30px);
    transform: scale(1) translateY(-30px);
  }
  19.5% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
  100% {
    -webkit-transform: scale(0) translateY(-30px);
    transform: scale(0) translateY(-30px);
  }
}
/*ポイントが表示されるときの光が回転するアニメーション*/
@-webkit-keyframes p-rotate-anime {
  0% {
    transition: 0s;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 0;
  }
  2.45% {opacity: 0;}
  2.4501% {opacity: 1;}
  100% {
    -webkit-transform: rotate(300deg);
    transform: rotate(300deg);
  }
}
@keyframes p-rotate-anime {
  0% {
    transition: 0s;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 0;
  }
  2.45% {opacity: 0;}
  2.4501% {opacity: 1;}
  100% {
    -webkit-transform: rotate(300deg);
    transform: rotate(300deg);
  }
}
/*箱の本体部分のアニメーション*/
@-webkit-keyframes p-box-body {
  0%  {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9.8% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  10.6% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  11.4% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  11.8% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  12.2% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  12.6% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  13% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  15.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  16.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  17.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  17.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  18.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  18.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  19.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  19.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  24% {
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  24.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  100% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1)
  }
}
@keyframes p-box-body {
  0%  {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9.8% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  10.6% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  11.4% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  11.8% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  12.2% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  12.6% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  13% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  15.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  16.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  17.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  17.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  18.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  18.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  19.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  19.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  24% {
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  24.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  100% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1)
  }
}
/*箱のフタ部分のアニメーション*/
@-webkit-keyframes p-box-cover01 {
  0%  {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  4.1% {
    -webkit-transform: rotate(6deg) translateX(7.5px) translateY(-1px);
    transform: rotate(6deg) translateX(7.5px) translateY(-1px);
  }
  4.9% {
    -webkit-transform: rotate(-4deg) translateX(-5px) translateY(-12px);
    transform: rotate(-4deg) translateX(-5px) translateY(-12px);
  }
  5.3% {
    -webkit-transform: rotate(3deg) translateX(3.75px) translateY(-2px);
    transform: rotate(3deg) translateX(3.75px) translateY(-2px);
  }
  5.7% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  6.1% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  6.5% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  9% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9.8% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  10.6% {
    -webkit-transform: rotate(6deg) translateX(7.5px) translateY(-1px);
    transform: rotate(6deg) translateX(7.5px) translateY(-1px);
  }
  11.4% {
    -webkit-transform: rotate(-4deg) translateX(-5px) translateY(-12px);
    transform: rotate(-4deg) translateX(-5px) translateY(-12px);
  }
  11.8% {
    -webkit-transform: rotate(3deg) translateX(3.75px) translateY(-2px);
    transform: rotate(3deg) translateX(3.75px) translateY(-2px);
  }
  12.2% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  12.6% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  13% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  15.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  16.3% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  17.1% {
    -webkit-transform: rotate(6deg) translateX(7.5px) translateY(-1px);
    transform: rotate(6deg) translateX(7.5px) translateY(-1px);
  }
  17.9% {
    -webkit-transform: rotate(-4deg) translateX(-5px) translateY(-12px);
    transform: rotate(-4deg) translateX(-5px) translateY(-12px);
  }
  18.3% {
    -webkit-transform: rotate(3deg) translateX(3.75px) translateY(-2px);
    transform: rotate(3deg) translateX(3.75px) translateY(-2px);
  }
  18.7% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  19.1% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  19.5% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  24% {
    -webkit-transform: translateY(110px) scale(.41);
    transform: translateY(110px) scale(.41);
  }
  24.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
    opacity: 1;
  }
  24.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes p-box-cover01 {
  0%  {
    opacity: 0;
    display: none;
  }
  2.49% {
    opacity: 0;
    display: none;
  }
  2.5% {
    opacity: 1;
    display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  4.1% {
    -webkit-transform: rotate(6deg) translateX(7.5px) translateY(-1px);
    transform: rotate(6deg) translateX(7.5px) translateY(-1px);
  }
  4.9% {
    -webkit-transform: rotate(-4deg) translateX(-5px) translateY(-12px);
    transform: rotate(-4deg) translateX(-5px) translateY(-12px);
  }
  5.3% {
    -webkit-transform: rotate(3deg) translateX(3.75px) translateY(-2px);
    transform: rotate(3deg) translateX(3.75px) translateY(-2px);
  }
  5.7% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  6.1% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  6.5% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  9% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9.8% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  10.6% {
    -webkit-transform: rotate(6deg) translateX(7.5px) translateY(-1px);
    transform: rotate(6deg) translateX(7.5px) translateY(-1px);
  }
  11.4% {
    -webkit-transform: rotate(-4deg) translateX(-5px) translateY(-12px);
    transform: rotate(-4deg) translateX(-5px) translateY(-12px);
  }
  11.8% {
    -webkit-transform: rotate(3deg) translateX(3.75px) translateY(-2px);
    transform: rotate(3deg) translateX(3.75px) translateY(-2px);
  }
  12.2% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  12.6% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  13% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  15.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  16.3% {
    -webkit-transform: rotate(-8deg) translateX(-10px);
    transform: rotate(-8deg) translateX(-10px);
  }
  17.1% {
    -webkit-transform: rotate(6deg) translateX(7.5px) translateY(-1px);
    transform: rotate(6deg) translateX(7.5px) translateY(-1px);
  }
  17.9% {
    -webkit-transform: rotate(-4deg) translateX(-5px) translateY(-12px);
    transform: rotate(-4deg) translateX(-5px) translateY(-12px);
  }
  18.3% {
    -webkit-transform: rotate(3deg) translateX(3.75px) translateY(-2px);
    transform: rotate(3deg) translateX(3.75px) translateY(-2px);
  }
  18.7% {
    -webkit-transform: rotate(-2deg) translateX(-2.5px);
    transform: rotate(-2deg) translateX(-2.5px);
  }
  19.1% {
    -webkit-transform: rotate(1deg) translateX(-1.25px);
    transform: rotate(1deg) translateX(-1.25px);
  }
  19.5% {
    -webkit-transform: rotate(0deg) translateX(0px);
    transform: rotate(0deg) translateX(0px);
  }
  24% {
    -webkit-transform: translateY(110px) scale(.41);
    transform: translateY(110px) scale(.41);
  }
  24.5% {
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
    opacity: 1;
  }
  24.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes p-box-cover02 {
  0%  {
    opacity: 0;
  }
  2.49% {
    opacity: 0;
  }
  24.5% {
    opacity: 0;
  }
  24.501% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  28.125% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
  100% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
}
@keyframes p-box-cover02 {
  0%  {
    opacity: 0;
  }
  2.49% {
    opacity: 0;
  }
  24.5% {
    opacity: 0;
  }
  24.501% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  28.125% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
  100% {
    -webkit-transform: translateY(35px);
    transform: translateY(35px);
  }
}
/*smallbox 箱の本体部分のアニメーション*/
@-webkit-keyframes p-box-body-small {
  0% {
    opacity: 0;display: none;
  }
  2.49% {
    opacity: 0;display: none;
  }
  2.5% {
    opacity: 1;display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9.8% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  10.6% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  11.4% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  11.8% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  12.2% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  12.6% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  13% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  15.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  16.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  17.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  17.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  18.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  18.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  19.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  19.5% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  19.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes p-box-body-small {
  0% {
    opacity: 0;display: none;
  }
  2.49% {
    opacity: 0;display: none;
  }
  2.5% {
    opacity: 1;display: block;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  3.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  4.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  4.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  5.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  5.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  6.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  6.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  9.8% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  10.6% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  11.4% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  11.8% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  12.2% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  12.6% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  13% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  15.5% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  16.3% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  17.1% {
    -webkit-transform: rotate(6deg);
    transform: rotate(6deg);
  }
  17.9% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  18.3% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }
  18.7% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  19.1% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }
  19.5% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  19.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes p-box-small-bg {
  0% {
    opacity: 0;
  }
  19.5% {
    opacity: 0;
  }
  19.501% {
    opacity: 1;
    -webkit-transform: translateY(-20px) scale(.95);
    transform: translateY(-20px) scale(.95);
  }
  24% {
    opacity: 1;
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  24.5% {
    opacity: 1;
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  24.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes p-box-small-bg {
  0% {
    opacity: 0;
  }
  19.5% {
    opacity: 0;
  }
  19.501% {
    opacity: 1;
    -webkit-transform: translateY(-20px) scale(.95);
    transform: translateY(-20px) scale(.95);
  }
  24% {
    opacity: 1;
    -webkit-transform: translateY(60px) scale(.41);
    transform: translateY(60px) scale(.41);
  }
  24.5% {
    opacity: 1;
    -webkit-transform: translateY(40px) scale(1);
    transform: translateY(40px) scale(1);
  }
  24.501% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes p-box-small-open {
  0% {
    opacity: 0;
  }
  24.5% {
    opacity: 0
  }
  24.501% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes p-box-small-open {
  0% {
    opacity: 0;
  }
  24.5% {
    opacity: 0
  }
  24.501% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
/*獲得ポイントのアニメーション*/
@-webkit-keyframes p-point {
  0% {
    opacity: 0;
  }
  24.499% {
    opacity: 0;
  }
  24.5% {
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
  }
  26% {
    opacity: 1;
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }
  28% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  28.5% {
    opacity: 1;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  29% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes p-point {
  0% {
    opacity: 0;
  }
  24.499% {
    opacity: 0;
  }
  24.5% {
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
  }
  26% {
    opacity: 1;
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }
  28% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  28.5% {
    opacity: 1;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
  }
  29% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}
/*紙吹雪のアニメーション１*/
@-webkit-keyframes p-paper01 {
  0% {
    opacity: 0;
  }
  24.499%  {
    opacity: 0;
  }
  24.5%  {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(56px);
    transform: translateY(56px);
  }
}
@keyframes p-paper01 {
  0% {
    opacity: 0;
  }
  24.499%  {
    opacity: 0;
  }
  24.5%  {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(56px);
    transform: translateY(56px);
  }
}
/*紙吹雪のアニメーション２*/
@-webkit-keyframes p-paper02 {
  0% {
    opacity: 0;
  }
  24.499% {
    opacity: 0;
  }
  24.5% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(24px);
    transform: translateY(24px);
  }
}
@keyframes p-paper02 {
  0% {
    opacity: 0;
  }
  24.499% {
    opacity: 0;
  }
  24.5% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(24px);
    transform: translateY(24px);
  }
}
/*閉じるボタンのアニメーション*/
@-webkit-keyframes p-btn-close {
  0%  {
    opacity: 0;
  }
  28% {
    opacity: 0;
  }
  29% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes p-btn-close {
  0%  {
    opacity: 0;
  }
  28% {
    opacity: 0;
  }
  29% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

/*************************************************
プレミアムBOX付与アニメーション
*************************************************/
/*animation name*/
.contents-bg-light.premium-privilege img.time02 {
  opacity: 0;
  -webkit-animation: rotate-anime-premium-privilege 120s 1 linear;
  animation: rotate-anime-premium-privilege 120s 1 linear;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}
.contents-bg-star img.left01{
  opacity: 0;
  -webkit-animation: star-left1 0.2s ease 0.3s 1 normal;
  animation: star-left1 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.left02{
  opacity: 0;
  -webkit-animation: star-left2 0.2s ease 0.3s 1 normal;
  animation: star-left2 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.left03{
  opacity: 0;
  -webkit-animation: star-left3 0.2s ease 0.3s 1 normal;
  animation: star-left3 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.left04{
  opacity: 0;
  -webkit-animation: star-left4 0.2s ease 0.3s 1 normal;
  animation: star-left4 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.left05{
  opacity: 0;
  -webkit-animation: star-left5 0.2s ease 0.3s 1 normal;
  animation: star-left5 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.left06{
  opacity: 0;
  -webkit-animation: star-left6 0.2s ease 0.3s 1 normal;
  animation: star-left6 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.right01{
  opacity: 0;
  -webkit-animation: star-right1 0.2s ease 0.3s 1 normal;
  animation: star-right1 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.right02{
  opacity: 0;
  -webkit-animation: star-right2 0.2s ease 0.3s 1 normal;
  animation: star-right2 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.right03{
  opacity: 0;
  -webkit-animation: star-right3 0.2s ease 0.3s 1 normal;
  animation: star-right3 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.right04{
  opacity: 0;
  -webkit-animation: star-right4 0.2s ease 0.3s 1 normal;
  animation: star-right4 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.right05{
  opacity: 0;
  -webkit-animation: star-right5 0.2s ease 0.3s 1 normal;
  animation: star-right5 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg-star img.right06{
  opacity: 0;
  -webkit-animation: star-right6 0.2s ease 0.3s 1 normal;
  animation: star-right6 0.2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.contents-bg, .img-flg-txt {
  opacity: 0;
  -webkit-animation: fadeIn 2s ease 0.3s 1 normal;
  animation: fadeIn 2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}
.img-green-box{
  -webkit-animation: box-transition-y  30s ease-out 0.4s 1 normal;
  animation: box-transition-y  30s ease-out 0.4s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  top :300px;
}
.img-red-box{
  opacity: 0;
  -webkit-animation: box-red 0.2s 0.3s 1 normal;
  animation: box-red 0.2s 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}
.btn-x-premium {
   opacity: 0;
  -webkit-animation: fadeIn 2s ease 0.3s 1 normal;
  animation: fadeIn 2s ease 0.3s 1 normal;
  -webkit-animation-fill-mode:forwards;
  animation-fill-mode:forwards;
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

/**keyframe**/

/*赤い箱フェードイン*/
@-webkit-keyframes box-red{
  0% {opacity: 0; }
  50%{opacity: 0.8; }
  100% {opacity: 1; }
}
@keyframes box-red{
  0% {opacity: 0; }
  50%{opacity: 0.8; }
  100% {opacity: 1; }
}
/*星　中心から外へ移動*/
@-webkit-keyframes star-left1{
  0%{opacity: 0; }
  100%{ opacity: 1;
        -webkit-transform: translate(-120px, -160px)scale(0.5);
        transform: translate(-120px, -160px)scale(0.5);
      }
}
@keyframes star-left1{
  0%{opacity: 0; }
  100%{ opacity: 1;
        -webkit-transform: translate(-120px, -160px)scale(0.5);
        transform: translate(-120px, -160px)scale(0.5);
      }
}
@-webkit-keyframes star-left2{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-140px, -80px)scale(0.5);
        transform: translate(-140px, -80px)scale(0.5);
      }
}
@keyframes star-left2{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-140px, -80px)scale(0.5);
        transform: translate(-140px, -80px)scale(0.5);
      }
}
@-webkit-keyframes star-left3{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-140px, 20px)scale(-0.8);
        transform: translate(-140px, 20px)scale(-0.8);
      }
}
@keyframes star-left3{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-140px, 20px)scale(-0.8);
        transform: translate(-140px, 20px)scale(-0.8);
      }
}
@-webkit-keyframes star-left4{
  0%{opacity: 0; }
  100%{ opacity: 1;
        -webkit-transform: translate(-230px, -160px)scale(0.8);
        transform: translate(-230px, -160px)scale(0.8);
      }
}
@keyframes star-left4{
  0%{opacity: 0; }
  100%{ opacity: 1;
        -webkit-transform: translate(-230px, -160px)scale(0.8);
        transform: translate(-230px, -160px)scale(0.8);
      }
}
@-webkit-keyframes star-left5{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-268px, -18px)scale(0.8);
        transform: translate(-268px, -18px)scale(0.8);
      }
}
@keyframes star-left5{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-268px, -18px)scale(0.8);
        transform: translate(-268px, -18px)scale(0.8);
      }
}
@-webkit-keyframes star-left6{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-305px, 131px)scale(0.8);
        transform: translate(-305px, 131px)scale(0.8);
      }
}
@keyframes star-left6{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(-305px, 131px)scale(0.8);
        transform: translate(-305px, 131px)scale(0.8);
      }
}
@-webkit-keyframes star-right1{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(120px, -180px)scale(0.5);
        transform: translate(120px, -180px)scale(0.5);
      }
}
@keyframes star-right1{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(120px, -180px)scale(0.5);
        transform: translate(120px, -180px)scale(0.5);
      }
}
@-webkit-keyframes star-right2{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(140px, -44px);
        transform: translate(140px, -44px);
      }
}
@keyframes star-right2{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(140px, -44px);
        transform: translate(140px, -44px);
      }
}
@-webkit-keyframes star-right3{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(140px, 30px)scale(0.5);
        transform: translate(140px, 30px)scale(0.5);
      }
}
@keyframes star-right3{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(140px, 30px)scale(0.5);
        transform: translate(140px, 30px)scale(0.5);
      }
}
@-webkit-keyframes star-right4{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(230px, -160px)scale(0.8);
        transform: translate(230px, -160px)scale(0.8);
      }
}
@keyframes star-right4{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(230px, -160px)scale(0.8);
        transform: translate(230px, -160px)scale(0.8);
      }
}
@-webkit-keyframes star-right5{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(268px, 20px)scale(0.8);
        transform: translate(268px, 20px)scale(0.8);
      }
}
@keyframes star-right5{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(268px, 20px)scale(0.8);
        transform: translate(268px, 20px)scale(0.8);
      }
}
@-webkit-keyframes star-right6{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(305px, 140px)scale(0.8);
        transform: translate(305px, 140px)scale(0.8);
      }
}
@keyframes star-right6{
  0%{opacity: 0;}
  100%{ opacity: 1;
        -webkit-transform: translate(305px, 140px)scale(0.8);
        transform: translate(305px, 140px)scale(0.8);
      }
}
/*コンテンツフェードイン*/
@-webkit-keyframes fadeIn{
  0% {opacity: 0; }
  100% {opacity: 1; }
}
@keyframes fadeIn{
  0% {opacity: 0; }
  100% {opacity: 1; }
}

/*モーダル*/
@-webkit-keyframes bg-blk {
  0% {opacity: 0;}
  2.5% {opacity: .8;}
  100% {opacity: .8;}
}
@keyframes bg-blk {
  0% {opacity: 0;}
  2.5% {opacity: .8;}
  100% {opacity: .8;}
}

@-webkit-keyframes rotate-anime-premium-privilege {
    0% { opacity: 0;
         transition: 0s;
         -webkit-transform: rotate(0);
         transform: rotate(0);
       }
    1.1499% {opacity: .5;}
    1.15% {opacity: .5;}
    100% { -webkit-transform: rotate(300deg);
           transform: rotate(300deg);
           opacity: 0.8;
         }
}
@keyframes rotate-anime-premium-privilege {
    0% { opacity: 0;
         transition: 0s;
         -webkit-transform: rotate(0);
         transform: rotate(0);
       }
    1.1499% {opacity: .5;}
    1.15% {opacity: .5;}
    100% { -webkit-transform: rotate(300deg);
           transform: rotate(300deg);
           opacity: 0.8;
         }
}

/*************************************************
プレミアムBOX期間付与
*************************************************/
.contents-bg{
  z-index: 2;
  position: absolute;
  left: 0;
  right: 0;
  top: 394px;
  margin: 0 auto;
  width: 510px;
  height: auto;
  border-radius: 16px;
  padding: 50px 20px 20px;
  background: #FAF8F0;
  text-align: center;
}
.img-green-box{
  z-index: 3;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.img-red-box{
  top: 100px;
  z-index: 3;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.img-flg-txt{
  z-index: 3;
  position: absolute;
  left: 0;
  right: 0;
  top: 370px;
  font-weight: bold;
  text-align: center;
}
.img-flg{
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -30px;
  width: 250px;
}
.contents-bg-star{
  position: relative;
  z-index: 1;
  top:200px;
}
.contents-bg-star img{
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  height: 0 auto;
  margin: 0 auto;
}
.btn-x{
  position: relative;
  display: table;
  left: 50%;
  transform: translateX(-50%);
  width: 200px;
  height: 30px;
  border-radius: 8px;
  text-align: center;
  background: #fff;
  text-decoration:none;
  color: #000 !important;
  z-index: 99;
}

.btn-x-normalbox {
  top: 210px;
}

.btn-x-premium {
  top: 620px;
}

.btn-x .bt-inner{
  display: table-cell;
  vertical-align: middle;
}
.btn-x .ic-x{
  width: 24px;
  height: auto;
  vertical-align: middle;
  margin-right: 5px;
}
.contents-wrap{
  position: relative;
    margin: 0 auto;
}
.main-txt, .period-main-txt{
  font-size: 26px;
}
.open-all-sub-txt {
  font-size: 12px;
}
.main-period-txt{
  color: #ff5a5f;
  font-weight: bold;
}
.sub-txt{
  font-size: 20px;
}
.txt-container{
  margin-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
}
.contents-close-premium-privilege {
  display: block;
  position: relative;
  z-index: 99;
  width: 120px;
  background-color: #fff;
  text-align: center;
  border-radius: 50px;
  margin: 0 auto;
  top: 628px;
  cursor: pointer;
  left: 300px;
}
.txt-container-normal {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 99;
}
.luckybox-cumulative-modal {
  position: relative;
  top: 200px;
  text-align: center;
  z-index: 5;
}
.luckybox-cumulative-region {
  background-color: #FFFFFF;
  border-radius: 8px;
  width: 332px;
  height: 103px;
  position: relative;
  display: inline-block;
}
.luckybox-cumulative-modal-title {
  margin-top: 12px;
  font-weight: bold;
}
.luckybox-cumulative-modal-point {
  color: #FE5A5F;
  font-size: 28px;
  font-family: "Roboto Slab";
  font-weight: bold;
}
.luckybox-cumulative-modal-point-unit {
  color: #FE5A5F;
  font-size: 22px;
  font-family: "Roboto Slab";
}
.luckybox-cumulative-modal-paid-worker-link {
  color: #474747;
  font-size: 12px;
  text-decoration: underline;
}
.luckybox-cumulative-modal-paid-worker-link-red {
  color: #FE5A5F;
  text-decoration: underline;
}
.contents-close__text {
  font-size: 15px;
  color: #808080;
  display: inline-block;
  position: relative;
  font-size: 15px;
  right: 8px;
}
.contents-lbox-premium-privilege {
  position: relative;
  z-index: 1;
  top: 70px;
  text-align: center;
}
.contents-lbox-premium-privilege .box-wrap {
  position: relative;
  z-index: 3;
  display: block;
}
/*青い箱Y軸移動して回転*/
@-webkit-keyframes box-transition-y {
  0% {top :300px;}
  2.5% {
    top :100px;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  3.0% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
  3.5% {
    top :100px;
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  4.5% {
    top :100px;
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
    opacity: 1;
  }
  5.5% {top :100px; opacity: 0;}
  100% {top :100px; opacity: 0;}
}

@keyframes box-transition-y {
  0% {top :300px;}
  2.5% {
    top :100px;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  3.0% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }
  3.5% {
    top :100px;
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  4.5% {
    top :100px;
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
    opacity: 1;
  }
  5.5% {top :100px; opacity: 0;}
  100% {top :100px; opacity: 0;}
}

/* ==========================================================
mp
========================================================== */

/* cmn */

.mp-cmn-title {
  text-align: center;
  margin:54px auto 60px auto;
}

.mp-cmn-title-mp {
  text-align: center;
  margin:56px auto 30px auto;
}

.mp-cmn-title-number {
  font-size: 38px;
  font-weight: bold;
  color:#44bac7
}

.mp-cmn-title-text {
  font-size: 36px;
  font-weight: bold;
  color:#44bac7
}

.mp-cmn-title-text-mp {
  font-size: 38px;
  font-weight: bold;
  color:#44bac7
}

.mp-cmn-box-title {
  font-size: 16px;
  font-weight: bold;
  color: #86857f;
  background: #e0ded5;
  padding: 13px 20px 11px 20px;
  height: 40px;
  line-height: 1;
  border-radius: 8px 8px 0 0;
}

.mp-cmn-box-title-mp {
  font-size: 16px;
  font-weight: bold;
  color: #86857f;
  background: #e0ded5;
  padding: 11px 0px 11px 20px;
  height: 40px;
  line-height: 18px;
  letter-spacing: 1.11px;
  border-radius: 8px 8px 0 0;
}

.mp-cmn-unit {
  display: inline-block;
  margin-top: 4px;
  font-size: 24px;
  color: #ff5a5f;
  font-weight: bold;
}

.mp-cmn-unit-big {
  position: absolute;
  right:50px;
  padding-top:15px;
  display: inline-block;
  margin-top: 4px;
  font-size: 24px;
  color: #ff5a5f;
  font-weight: bold;
  line-height: 17px;
  letter-spacing: 1.18px;
  text-align: right;
}

.mp-cmn-unit-yen {
  font-size: 20px;
}

.mp-cmn-unit-middle {
  position: absolute;
  right:50px;
  display: inline-block;
  margin-top: 4px;
  font-size: 24px;
  color: #ff5a5f;
  font-weight: bold;
  line-height: 17px;
  letter-spacing: 1.18px;
}

.mp-cmn-unit-middle-dark-gray {
  position: absolute;
  right:50px;
  display: inline-block;
  margin-top: 4px;
  font-size: 24px;
  color: #474747;
  font-weight: bold;
  line-height: 17px;
  letter-spacing: 1.18px;
}

.mp-cmn-number {
  display: inline-block;
  margin-top: 4px;
  font-size: 32px;
  color: #ff5a5f;
  font-weight: bold;
}

.mp-cmn-number-big {
  padding-top: 9px;
  position: absolute;
  right:75px;
  display: inline-block;
  margin-top: 4px;
  font-size: 32px;
  color: #ff5a5f;
  font-weight: bold;
  line-height: 23px;
}

.mp-cmn-number-middle {
  position: absolute;
  right:75px;
  display: inline-block;
  font-size: 24px;
  color: #ff5a5f;
  font-weight: bold;
  line-height: 24px;
}

.mp-cmn-number-middle-dark-gray {
  position: absolute;
  right:75px;
  display: inline-block;
  font-size: 24px;
  color: #474747;
  font-weight: bold;
  line-height: 24px;
}

.mp-cmn-unit-small {
  margin-top: 1px;
  font-size: 20px;
  color: #ff5a5f;
  font-weight: bold;
}

.mp-cmn-number-small {
  margin-top: 1px;
  font-size: 24px;
  color: #ff5a5f;
  font-weight: bold;
}

.mp-cmn-unit-green {
  margin-top: 4px;
  font-size: 24px;
  color: #44bac7;
  font-weight: bold;
}

.mp-cmn-unit-green-big {
  position: absolute;
  right:50px;
  display: inline-block;
  margin-top: 15px;
  font-size: 24px;
  color: #44bac7;
  font-weight: bold;
  line-height: 17px;
}

.mp-cmn-number-green {
  margin-top: 4px;
  font-size: 32px;
  color: #44bac7;
  font-weight: bold;
}

.mp-cmn-number-green-big {
  position: absolute;
  right:75px;
  display: inline-block;
  margin-top: 4px;
  font-size: 32px;
  color: #44bac7;
  font-weight: bold;
  line-height: 32px;
}

.mp-cmn-unit-small-green {
  margin-top: 1px;
  font-size: 20px;
  color: #44bac7;
  font-weight: bold;
}

.mp-cmn-number-small-green {
  margin-top: 1px;
  font-size: 24px;
  color: #44bac7;
  font-weight: bold;
}

.mp-ico-cmn-yen-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -10476px;
  width: 34px;
  height: 34px;
  margin:0 13px 33px 0;
}

.mp-ico-cmn-yen-symbol-mp {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -10476px;
  width: 34px;
  height: 34px;
}

.mp-ico-cmn-d-point-symbol-mp {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1119px;
  width: 31px;
  height: 30px;
  background-size: 255px 9273px;
}

.mp-ico-cmn-d-point-symbol {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -1119px;
  width: 31px;
  height: 30px;
  background-size: 255px 9273px;
  margin: 0 14px 38px 1px;
}

.mp-ico-levelup-symbol {
  background-image: url(../img/common/icon_jobta_normal.png);
  width: 30px;
  height: 30px;
  background-size: 100%;
}

.mp-arrow-blue-link {
  background-image: url(../img/common/icon_arrow_blue_left.png);
  width: 8px;
  height: 10px;
  margin: 6px 10px 0 0;
  background-size: 8px 10px;
  vertical-align: top;
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

.mp-ico-cmn-work-count {
  background-image: url(../img/common/work_count.png);
  background-repeat: no-repeat;
  width: 29px;
  height:32px;
  background-size: 100%;
  margin-right: 6px;
}

.mp-ico-cmn-approved-count {
  background-image: url(../img/common/approved_count.png);
  background-repeat: no-repeat;
  width: 30px;
  height: 32px;
  background-size: 100%;
  margin-right: 5px;
}

.mp-cmn-direction-ttl {
  font-size: 18px;
  font-weight: bold;
  color: #474747;
  padding-top: 0px;
  padding-bottom: 0px;
}

.mp-cmn-direction-ttl-mp {
  font-size: 20px;
  font-weight: bold;
  color: #474747;
  padding-top: 0px;
  padding-bottom: 0px;
  letter-spacing: 1.11px;
  line-height: 18px;
}

.mp-cmn-direction-ttl-mp-middle {
  font-size: 18px;
  font-weight: bold;
  color: #474747;
  padding-top: 0px;
  padding-bottom: 0px;
  letter-spacing: 1.11px;
  line-height: 18px;
}

.mp-cmn-direction-ttl-mp-middle-gray {
  display: inline-block;
  font-size: 18px;
  color: #474747;
  padding-top: 0px;
  padding-bottom: 0px;
  letter-spacing: 1.11px;
  line-height: 18px;
}

.mp-cur-wknum-ttl {
  font-size: 18px;
  font-weight: bold;
  color: #474747;
  padding-top: 0px;
  padding-bottom: 0px;
  letter-spacing: 1px;
  line-height: 18px;
}

.mp-cmn-direction-ttl-getpoint {
  display: inline-block;
  margin-top: 6px;
}

.mp-cmn-direction-ttl-getpoint-mp {
  display: inline-block;
  margin-top: 10px;
}

.mp-cmn-direction-ttl-getmoney {
  display: inline-block;
  margin-top: 10px;
}

.mp-cmn-direction {
  border: 1px solid #e0ded5;
  border-radius: 6px;
  background-color: #fff;
  margin-bottom: 24px;
}

.mp-cmn-direction-mymenu {
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background-color: #fff;
  margin-bottom: 24px;
}

.mp-cmn-check-link {
  font-size: 16px;
  color:#1e97cd;
  text-align: right;
}

.mp-cmn-ico-d-point {
  margin:0 11px 0px 1px;
}

.mp-cmn-ico-cmn-yen {
  margin: 0 13px 0px 0;
}

.mp-cmn-ico-cmn-yen-blank {
  width: 40px;
}

.mp-cmn-direction-head {
  display: table-cell;
  vertical-align: middle;
  font-size: 22px;
}

.mp-cmn-direction-head {
  width: 30px;
  display: table-cell;
  vertical-align: middle;
}

.mp-cmn-direction-head-l {
  width: 48px;
  display: table-cell;
  vertical-align: top;
}

.mp-cmn-direction-head-l-mp {
  width: 46px;
  margin-top: 4px;
  display: inline-block;
}

.mp-cmn-direction-head-text {
  display: table-cell;
  vertical-align: top;
}

.mp-arrow-blue-link-up {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 12px;
  height: 9px;
  background-size: 12px 9px;
  margin: 3px 12px 0 4px;
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}

.mp-arrow-blue-link-up-accordion {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 10px;
  height: 8px;
  background-size: 10px 8px;
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}

.mp-arrow-blue-link-down {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 12px;
  height: 9px;
  background-size: 12px 9px;
  margin: 3px 12px 0 4px;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.mp-arrow-blue-link-down-accordion {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 10px;
  height: 8px;
  background-size: 10px 8px;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.mp-cmn-direction-body {
  display: table-cell;
  margin-top: 4px;
  text-align: right;
}

.mp-ico-cmn-d-point{
  margin: 0px 19px 35px 1px;
}

.mp-ico-cmn-yen {
  margin: 0 13px 33px 1px;
}
/* cur */

.mp-cur-title {
  padding-top: 1px;
}

/* fee */

.mp-cur-fee-title {
  margin-top: 1px;
  margin-bottom: 30px;
}

.mp-cur-fee-d-point-confirm-link {
  margin-top: 25px;
  margin-bottom: 46px;
}

/* total */

.mp-cur-fee-total-box-body {
  padding: 35px 50px 0px 32px;
}

.mp-cur-fee-total-box-body-line {
  padding-top: 10px;
  padding-bottom: 10px;
  width: 100%;
  display: table;
  vertical-align: top;
}

/* accordion */

.mp-cur-fee-total-accordion-box {
  border-top: 1px solid #e0ded5;
}

.mp-cur-fee-total-accordion-box-1 {
  padding: 32px 50px 32px 30px;
}

.mp-cur-fee-total-accordion-box-2 {
  padding: 32px 50px 33px 30px;
}

.mp-cur-fee-total-accordion-box-3 {
  padding: 32px 23px 32px 30px;
}

.mp-cur-fee-total-accordion-comment {
  font-size: 14px;
  color: #474747;
  margin-bottom: 12px;
  line-height: 24.5px;
}

.mp-accordion-luckybox-comment {
  font-size: 14px;
  color: #474747;
  margin-top: 7px;
  line-height: 24.5px;
}

.mp-cur-fee-total-accordion-comment ul,.mp-accordion-luckybox-comment ul {
  list-style: none;
}

.mp-cur-fee-total-accordion-comment ul li,.mp-accordion-luckybox-comment ul li {
  text-indent: -1.2em;
  padding-left: 1.2em;

}

.mp-cur-fee-total-accordion-title {
  font-size: 16px;
  font-weight: bold;
  color: #999;
  margin-bottom: 35px;
}

.mp-cur-fee-total-accordion-show-text {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 32px;
  text-align: center;
}

.mp-cur-fee-total-accordion-text{
  color: #000;
}

.mp-cur-fee-total-accordion-rem-link {
  margin-top: 25px;
  margin-bottom: 46px;
}

.mp-cur-fee-total-accordion-bottom {
  padding-bottom: 33px;
}

.close-accordion {
  display: inline-block;
}

.is-active .close-accordion {
  display: none;
}

.open-accordion {
  display: none;
}

.is-active .open-accordion {
  display: inline-block;
}

/* cur-wknum */

.mp-cur-wknum-total-title {
  margin-bottom: 30px;
}

.mp-cur-wknum-total-box-body-line {
  padding: 30px 48px 30px 30px;
  width: 100%;
  height: 100px;
  display: table;
  background-color:#fff;
  border : 1px solid #e0ded5;
  border-bottom:0px
}

.mp-cur-wknum-total-box-body-line-mp {
  padding: 30px 50px 30px 30px;
  width: 100%;
  height: 100px;
  background-color:#fff;
  border : 1px solid #e0ded5;
  border-bottom:0px
}

.mp-cur-wknum-total-box-body-line-mp.uh-levelup-reward-box {
  padding-bottom: 40px;
  height: auto;
}

.mp-dpoint-total-box-body-line {
  padding: 30px 50px 30px 30px;
  width: 100%;
  height: 100px;
  background-color:#fff;
  border : 1px solid #e0ded5;
  border-bottom:0px
}

.mp-dpoint-total-box-body-line.uh-levelup-reward-box {
  height: auto;
}

.mp-dpoint-detail-box-body-line {
  padding: 30px 50px 30px 30px;
  width: 100%;
  height: 138px;
  background-color:#fff;
  border : 1px solid #e0ded5;
  border-bottom:0px
}

.mp-dpoint-previous-month-luckybox-box-body-line {
  padding: 30px 50px 50px 30px;
  width: 100%;
  height: 100px;
  background-color:#fff;
  border : 1px solid #e0ded5;
  border-bottom:0px;
}

.mp-dpoint-warning-box-body-line {
  padding: 30px 30px 30px 30px;
  width: 100%;
  height: 122px;
  background-color:#fff;
  border : 1px solid #e0ded5;
  border-radius: 0 0 8px 8px;
  margin-top: 0px;
  border-bottom : 1px solid #e0ded5;
}

.mp-cur-wknum-total-box-body-line ~ .only-sp {
  display: none;
}

.mp-dpoint-box .mp-dpoint-box-child:last-child {
  border-bottom : 1px solid #e0ded5;
  border-radius: 0 0 8px 8px;
}

.mp-no-sepalate {
  border-top: 0px;
}

.mp-cur-wknum-work-history {
  margin-top: 25px;
  margin-bottom: 35px;
}

.mp-dpoint-box-child-approval {
  border-bottom: 0px;
  padding-bottom: 0px;
  height: 70px;
}

.mp-dpoint-box-child-luckybox {
  padding-top: 15px;
  border-top: 0px;
  height: 85px;
}

.mp-dpoint-box-child-luckybox .mp-cmn-direction-ttl-getpoint {
  margin-left: 42px;
}

.mp-dpoint-total-box-body-line-mp {
  border-bottom:0px;
  height: 100px;
}

/* res */

.mp-res-title-text {
  margin: 81px auto 56px auto !important;
}

.mp-res-line {
  border: 1px solid  #e0ded5;
}

.mp-res-total-box {
  margin-bottom: 80px;
}

/* level-status */
.levelup-period {
  margin-right: 20px;
  float: right;
  font-weight: normal;
  color: #474747;
  letter-spacing: 0px;
}

.level-status-body {
  height: auto;
  padding: 30px;
  font-weight: bold;
  border: 1px solid #e0ded5;
  border-radius: 0 0 8px 8px;
}

.level-status-detail-area {
  display: -webkit-flex;
  display: flex;
}

.level-status-detail-area.height-keep {
  height: 136px;
}

.level-status-bonus-title {
  font-size: 20px;
}

.level-status-detail {
  width: 50%;
  text-align: center;
}

.current-level {
  position: relative;
  height: 100%;
  width: 210px;
  margin: 0 auto;
  padding: 8px;
  border-radius: 12px;
}

.current-level img {
  width: 100px;
}

.current-level p {
  font-size: 16px;
  font-weight: bold;
}

.current-level-nm {
  position: absolute;
  left: 12px;
  font-weight: normal;
}

.level-status-detail.bonus-detail {
  display: grid;
}

.level-bonus-num {
  color: #FF5A5F;
  font-size: 32px;
}

.level-status-detail a {
  font-size: 14px;
  font-weight: normal;
  float: right;
  text-decoration: underline;
  place-self: end;
  cursor: pointer;
}

.next-mnth-level {
  display: -webkit-flex;
  display: flex;
  margin: 12px 0;
  padding-top: 10px;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
  border-top: 1px solid #e0ded5;
}

.next-mnth-level img {
  height: 40px;
  margin-left: 10px;
  vertical-align: middle;
}

.level-status-bar-area {
  position: relative;
  text-align: right;
}

.level-status-detail-area + .level-status-bar-area {
  margin-top: 12px;
  border-top: 1px solid #e0ded5;
}

.level-status-bar-area .next-level {
  font-size: 13px;
  color: #44bac7;
}

.level-status-bar {
  position: relative;
  height: 25px;
  width: 100%;
  background-color: #F2F2F2;
  border-radius: 4px;
}

.level-status-bar-achieve {
  height: 100%;
  width: 0;
  padding-top: 1px;
  border-radius: 4px 0 0 4px;
  background-color: #33CCCC;
  text-align: center;
  overflow: hidden;
  transition: all 2s ease 0s;
}

.level-status-bar-achieve.bar-full {
  padding-top: 1px;
  background-color: #FFD500;
  border-radius: 4px;
}

.unachieved-text {
  font-size: 14px;
  color: #474747;
}

.level-status-bar-achieve .unachieved-text {
  display: none;
}

.unachieved-text span {
  margin-left: 2px;
  font-size: 12px;
}

.achieved-text {
  position: relative;
  font-size: 14px;
  color: #FF5A5F;
}

.achieved-text::after {
  content: '';
  display: block;
  position: absolute;
  top: 4px;
  right: -10px;
  height: 15px;
  width: 10px;
  background: url(../img/common/icon_lankup_arrow.png) no-repeat center top/ 15px;
}

.level-status-bar-icon {
  position: absolute;
  height: 25px;
  width: 25px;
  top: 0;
  left: 0;
  transition: all 2s ease 0s;
}

.level-status-bar-icon img {
  height: 25px;
  width: 25px;
}

.level-status-bar-icon .unachieved-text {
  position: absolute;
  top: 3px;
  margin-left: 6px;
  white-space: nowrap;
}

.up-to-levelup-area {
  display: flex;
  justify-content: space-between;
  margin-top: 3px;
}

.up-to-levelup {
  font-size: 14px;
  font-weight: normal;
}

.up-to-levelup .levelup-num {
  margin-left: 4px;
  color: #FF5A5F;
  font-weight: bold;
}

.levelup-num span {
  font-size: 10px;
}

/* l-menu */

.mp-l-menu {
  margin-top: 30px;
}

.mp-l-menu:first-child {
  margin-top: 0;
}

.mp-l-menu-item {
  margin-top: 30px;
  line-height: 1;
}

.mp-l-menu-item:first-child {
  margin-top: 80px;
}

.mp-menu {
  height: 80px;
  padding:25px 29px 25px 30px;
}

.mp-l-menu-item-2l-ttl {
  display: inline-block;
}

.mp-l-menu-item-user-id {
  padding: 25px 29px 25px 0px;
  height: 80px;
  margin-top: 30px;
}

.mp-l-menu-user-id-title {
  font-size: 18px;
  font-weight: bold;
  color: #86857f;
  padding: 25px 131px 27px 31px;
  background: #e0ded5
}

.mp-l-menu-user-id {
  font-size: 18px;
  color: #000000;
  padding: 25px 33px 27px 33px;
}

.mp-l-menu-text {
  font-size: 20px;
  color: #474747;
  margin: 4px 23px 0 0;
}

.mp-l-menu-text-red {
  font-size: 14px;
  color: #ff5a5a;
  margin: 8px;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, "MS PGothic", "ＭＳ Ｐゴシック", Geneva, Arial, Verdana, sans-serif;
}

/* useage */
.useage-box {
  margin-top: 40px;
}

.useage-box-levelup {
  margin: 50px auto 0;
  width: 760px;
}

.useage-search-box {
  min-height: 0px;
  margin-top: -1px;
}

.useage-line {
  margin-bottom: 1px;
}

.profile-point-text {
  font-size: 16px;
  margin-top: 20px;
}

.profile-required-text {
  display: inline-block;
  text-align: left;
}

.profile-required-text .highlight-text {
  font-size: 24px;
}

.annotation-enq-text {
  font-size: 12px;
  margin-top: 10px;
}

/** registration complete */

/* title */
.work-reg-comp-title {
  margin-bottom: 21px;
  text-align: center;
}

.work-reg-comp-title img {
  width: 700px;
}

.work-reg-comp-box-title {
  width: 100%;
  padding: 16px 0 14px;
  height: 70px;
  line-height: 40px;
  letter-spacing: 3px;
}

.work-reg-comp-prfl-ttl span:first-child {
  font-size: 24px;
  padding-right: 3px;
  color: #fff;
}

/* common */
.work-finish-reg-comp {
  margin-top: 70px;
}

.work-reg-comp-box {
  width: 800px;
}

.work-reg-comp-box + .work-reg-comp-box {
  margin-top: 40px;
}

.rem-plan-box-top span {
  font-size: 30px;
  color: #EBF400;
}

.work-reg-comp-box-under {
  border: 1px solid #44bac7;
  padding-top: 0px;
  padding-bottom: 25px;
}

.work-reg-comp-box-body {
  text-align: center;
  margin-top: 23px;
}

.work-reg-comp-box-body .btn-cmn {
  width: 410px;
}

.work-reg-comp-box-body p {
  font-weight: bold;
  font-size: 20px;
  color: #44bac7;
  margin-top: 7px;
  margin-bottom: 27px;
}

.work-reg-comp-img-area {
  margin: 0 auto;
}

.work-reg-comp-prfl-img {
  width: 360px;
}

.work-reg-comp-mission-img {
  width: 400px;
}

.work-reg-comp-pointup-ttl p {
  font-size: 30px;
}

.work-reg-comp-pointup-ttl span {
  font-size: 32px;
}

.work-reg-comp-pointup-ttl span:nth-child(1) {
  font-size: 24px;
  color: #fff;
}

.work-reg-comp-pointup-ttl span:nth-child(2) {
  position: relative;
}

.work-reg-comp-pointup-ttl span:nth-child(2):after {
  content: "";
  display: block;
  position: absolute;
  top: 8px;
  right: -20px;
  width: 11px;
  height: 27px;
  background: url(../img/common/img_line.png) no-repeat center top/ 12px;
}

.mod-cmn-registration-mission-btn {
  position: relative;
  margin-top: 51px;
}

.pointup-balloon {
  position: absolute;
  left: 60%;
  bottom: 30px;
  width: 143px;
  z-index: 1;
}

/* campaign */
.work-reg-comp-box-campaign {
  margin-bottom: 80px;
}

.work-reg-comp-box-campaign-under {
  padding-top:24px;
  padding-bottom: 34px;
}

.work-reg-comp-campaign {
  display: table-cell;
}

.work-reg-comp-circle {
  margin-top: -10px;
  margin-right: 10px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  flex-flow: column;
  vertical-align: top;
  width: 40px;
  height: 40px;
  color: #ffffff;
  border: 4px solid #44bac7;
  background: #44bac7;
}

.work-reg-comp-circle-text {
  font-size: 1em;
  line-height: 1.5em;
}

/* client */

.work-size-18 {
  font-size: 18px;
}

.work-size-24 {
  font-size: 24px;
}

.work-size-26 {
  font-size: 26px;
}

.work-size-40 {
  font-size: 40px;
}

.work-bold {
  font-weight: bold;
}

.work-color-black {
  color: #606060;
}

.work-color-red {
  color: #ff5a5f;
}

.work-color-cyan {
  color: #44bac7;
}

/* ==========================================================
message-get-past
========================================================== */
.message-get-past {
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}

.message-get-past-arrow-blue-link-up {
  background-image: url(../img/common/icon_arrow_blue_right.png);
  width: 12px;
  height: 9px;
  background-size: 12px 9px;
  margin: 0px 5px 0px 0px;
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}

/* ==========================================================
work-start-detail
========================================================== */
.work-start-detail-btn {
  font-size: 16px;
  font-weight: bold;
  color: #474747;
}

.work-start-detail-border {
  background-image: linear-gradient(to right, #D8D8D8, #D8D8D8 4px, transparent 1px, transparent 4px);
  background-size: 8px 1px;
  background-position: top;
  background-repeat: repeat-x;
  height: 1px;
  width: 100%;
  margin-top: 40px;
}

.cmn-arrow-blue-down {
  background-image: url(../img/common/ico_select_01.png);
  background-repeat: no-repeat;
  width: 12px;
  height: 10px;
  background-size: 100%;
  margin: 0px 12px 0px 0px;
}

.cmn-search-arrow-blue-down {
  background-image: url(../img/common/ico_select_01.png);
  background-repeat: no-repeat;
  width: 12px;
  height: 10px;
  background-size: 100%;
}

.cmn-search-arrow-blue-up {
  background-image: url(../img/common/ico_select_01.png);
  background-repeat: no-repeat;
  width: 12px;
  height: 10px;
  background-size: 100%;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.is-active.work-start-detail-btn .cmn-arrow-blue-down {
  background-image: url(../img/common/ico_select_01.png);
  background-repeat: no-repeat;
  width: 12px;
  height: 10px;
  background-size: 100%;
  margin: 0px 12px 0px 0px;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

/* ==========================================================
work-hidden
========================================================== */
.worker-hidden-link{
  display:none;
}

.start-work-body:not(.only-pc):not(.only-sp) .worker-hidden-link {
  display: inline-block;
  float: right;
  margin-top: 58px;
}

.start-work-body:not(.only-pc):not(.only-sp) .top-search-link {
  display: inline-block;
  float: left;
  margin-top: 58px;
}

.start-work-body:not(.only-pc):not(.only-sp) .footer-order-prev{
  margin-top: 0;
}

.start-work-body:not(.only-pc):not(.only-sp) .worker-hidden-bottom-bar {
  border-bottom: 1px solid #e0ded5;
  margin-bottom: 41px;
  height: 102px;
}

.arrow-blue-link-left {
  background-image: url(../img/common/icon_arrow_blue_left.png);
  background-repeat: no-repeat;
  width: 7px;
  height: 11px;
  background-size: 100%;
  margin-right: 10px;
}

.worker-back-link {
  padding-left: 0px;
}

/* ==========================================================
bl
========================================================== */
.bl-btns {
  margin-bottom: 8px;
}

.list-cmn-form-item.bl-btn-wid {
  width: 36%;
}

.list-cmn-form-item.bl-btn-wid:last-child {
  width: 28%;
}

.bl-list-specify-title {
  font-weight: bold;
  margin: 10px 0 16px -90px;
}

.bl-specify-pulldown {
  width: 230px;
}

.bl-radio-text {
  font-size: 14px;
  padding-left: 28px;
}

.list-specify-txt {
  font-size: 15px;
}

/* ==========================================================
rich-edit
========================================================== */

.richedit-textarea {
  padding-bottom: 1.5em;
  wrap: hard;
  width: 660px;
}

.richedit {
  font-size: 16px;
  color: #000000;
  padding: 5px;
  min-width: 642px;
}

.richedit br {
  font-size: 16px;
  line-height: 1;
}

.rich-red {
  color:#ff5a5f;
}


.rich-big {
  font-size: 20px;
}

.rich-place-holder {
  display: inline-block;
  position: absolute;
  left: 17px;
  top: 50px;
  line-height: 1.05;
  font-size: 16px;
  color: #808080;
}

.rich-small {
  font-size: 15px;
}

.rich-small .rich-big {
  font-size: 18px;
}

.rich-status {
  background: transparent;
}

/* ==========================================================
card
========================================================== */
.ico-card-detail {
  background-repeat: no-repeat;
  width: 52px;
  height: 52px;
  background-size: 100%;
  margin-right: 20px;
}

.ico-card-detail-search {
  background-repeat: no-repeat;
  width: 44px;
  height: 44px;
  background-size: 100%;
  position: absolute;
  right: 18px;
}

.ico-card-detail-up {
  background-image: url(../img/common/card_up_sp.png);
}

.ico-card-detail-up.card-detail-active {
  background-image: url(../img/common/card_up_act_sp.png);
}

.ico-card-detail-easy {
  background-image: url(../img/common/card_easy_sp.png);
}

.ico-card-detail-easy.card-detail-active {
  background-image: url(../img/common/card_easy_act_sp.png);
}

.ico-card-detail-soon {
  background-image: url(../img/common/card_soon_sp.png);
}

.ico-card-detail-soon.card-detail-active {
  background-image: url(../img/common/card_soon_act_sp.png);
}

.ico-card-detail-lucky {
  background-image: url(../img/common/card_lucky_sp.png);
}

.ico-card-detail-lucky.card-detail-active {
  background-image: url(../img/common/card_lucky_act_sp.png);
}

.ico-card-detail-simple {
  background-image: url(../img/common/card_simple_sp.png);
}

.ico-card-detail-simple.card-detail-active {
  background-image: url(../img/common/card_simple_act_sp.png);
}

.card-detail-icons {
  letter-spacing: -.5em;
}

.card-label-caution {
  display: inline-block;
  letter-spacing: normal;
  padding: 0 5px 0 10px;
  color: #999;
  font-size: 22px;
  vertical-align: middle;
  height: 35px;
  line-height: 30px;
}

.card-detail-icons * {
  letter-spacing: normal;
}

.top-campaign-list {
  text-align: right;
  padding: 20px 59px 0px 0;
  margin-bottom: -21px;
}

.top-campaign-list-txt {
  font-size: 16px;
  color: #fff;
  cursor: pointer;
}

.arrow-white-link {
  background-image: url(../img/common/icon_arrow_white_right.png);
  background-repeat: no-repeat;
  width: 6px;
  height: 9px;
  margin: 7px 15px 0 0;
  background-size: 100%;
  vertical-align: top;
}

/* ==========================================================
file-apploval
========================================================== */
.form-file-approval {
  display: none;
}

.file-approval-result {
  margin-top: 15px;
  text-align: center;
}

.file-approval-cp-tooltiptext {
  position: relative;
  cursor: pointer;
}

.file-approval-tooltip-contents {
  position: relative;
}

.file-approval-tooltip-contents::after {
  position: absolute;
  opacity: 0;
  transition: 0s;
  top: 0px;
  right: 0;
  left: 0px;
  display: block;
  padding: 0.2em 0.5em;
  content: attr(data-tooltip);
  color: #ffffff;
  border-radius: 6px;
  background: rgba(17,17,17,.8);
  overflow: hidden;
  word-break: break-all;
  text-overflow: ellipsis;
  text-align: left;
  white-space:pre-wrap;
}

.file-approval-cp-tooltiptext:hover + .file-approval-tooltip-contents::after {
  top: 15px;/*HOVER位置*/
  opacity: 1;
  left: 52%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 1;
}

.file-approval-cp-tooltiptext:hover + .file-approval-tooltip-contents::before {
  content: '';
  border: 8px solid transparent;
  border-bottom-color: rgba(17,17,17,.8);
  position: absolute;
  top: -1px;
  left: 52%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.complete-content-item {
  margin-top: 0px;
}

.complete-content-item-image, .complete-content-item-text, .complete-content-item-link, .complete-content-item-name {
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 0px;
}

.ttl-cmn-05.complete-content-item-image, .ttl-cmn-05.complete-content-item-text,
.ttl-cmn-05.complete-content-item-link, .ttl-cmn-05.complete-content-item-name {
  width: 130px;
  margin-left: 10px;
}

.complete-content-item-name .item-cmnt {
  color: #808080;
  font-size: 15px;
  margin-left: 10px;
}

.complete-content-item-width-lg-112 {
  width: 112px;
}

.complete-content-item-center {
  text-align: center;
}

.complete-contente-add {
  width: 170px;
}

.complete-contente .form-cmn-file-input {
  width: 300px;
}

ul.mod-cmn-board-item-status:nth-child(n+2){
  margin-top: 6px;
}

.list-cmn-status.list-cmn-status-link {
  margin-top: 10px;
}

.btn-search-part-time-job {
  display: inline;
  width:340px;
  text-align: center;
}

.mod-cmn-board-item .mod-cmn-board-item-work-link {
  position: absolute;
  max-width: calc(100% - 497px);
  margin: 10px 30px;
  z-index: 1;
  line-height: 1.75;
}

.mod-cmn-board-item-link.mod-cmn-accordion .mod-cmn-board-item-ttl {
  display: inline-block;
  min-height: 24px;
}

.freeword-block {
  display: inline-block;
  margin-left: 10px;
  position: relative;
}

.txt-search-freeword-place-holder {
  display: inline-block;
  position: absolute;
  background-color: #fff;
  line-height: 1.05;
  font-size: 16px;
  color: #808080;
  top: 13px;
  left: 16px;
  letter-spacing: normal;
}

.freeword-place-holder-search {
  background-image: url(../img/common/sprite.png);
  background-position: 0px -2509px;
  width: 18px;
  height: 18px;
  background-size: 101px 3783.5px;
  margin-right: 10px;
  position: relative;
  top: -3px;
}

input[class="txt-search-freeword"] {
  border-radius: 4px 0 0 4px;
  width: 360px;
}

.btn-search-freeword {
  position: relative;
  left: -1px;
  height: 38px;
  border-radius: 0 4px 4px 0;
  width: 90px;
  background-color: #44bac7;
  box-shadow: 0px 2px 0px 0px #37959f;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  border: 0;
  vertical-align: top;
}

/* ==========================================================
publish-set
========================================================== */
.publish-set-caution {
  padding-left: 12px;
  font-size: 14px;
  color: #44bac7;
}

.cmn-resize-vertical {
    resize: vertical;
}

/* ==========================================================
welcome
========================================================== */

.home-welcome-box {
  padding: 3px;
  margin: 16px 8px -6px;
  background: #ff5a5f;
  color: #FFF;
  text-align: center;
  border-radius: 8px;
  position: relative;
  z-index: 10;
}

.home-welcome-speech-bubble {
  display: block;
  height: 12px;
  width: 12px;
  position: absolute;
  bottom: -5px;
  background: #ff5a5f;
  left: 50%;
  margin: 0 0 0 -10px;
  transform: rotate(-45deg);
}

.client-mymenu-select {
  margin-bottom: 39px;
}

.client-mymenu-btn-ico-region {
  width: 25%;
  margin-right: 5px;
}

.ico-client-mymenu-btn {
  width: 20px;
  height: 20px;
}

.client-mymenu-btn-txt {
  width: 75%;
  text-align: left;
}

.ico-edit-order {
  background: url(../img/common/edit_order.png) no-repeat;
}

.ico-approval-denial-work {
  background: url(../img/common/approval_denial_work.png) no-repeat;
}

.ico-create-file {
  background: url(../img/common/create_file.png) no-repeat;
}

.ico-add-price {
  background: url(../img/common/add_price.png) no-repeat;
}

.ico-pause {
  background: url(../img/common/pause.png) no-repeat;
}

.ico-republish {
  background: url(../img/common/republish.png) no-repeat;
}

.ico-download {
  background: url(../img/common/download.png) no-repeat;
}

.l-center-mlmgzn,.l-center-mlmgzn-time {
  margin-top: 40px;
}

.mod-cmn-search-body-lists-provider .mod-cmn-search-body-lists-item {
  letter-spacing: normal;

}

.mod-cmn-search-accordion-parent {
  display: inline-block;
  width: 189px;
}

/* FAQ Search */

.faq-search-area {
  margin-top: 10px;
  text-align: center;
  vertical-align: top;
}

form .faq-search-input {
  display: inline-block;
  width: 440px;
  height: 56px;
  margin-right: 10px;
}

.faq-search-button-in {
  width: 120px;
  height: 52px;
  display: inline-block;
  top: -2px;
  cursor: pointer;
}

.faq-search-button {
  width: auto;
  margin-left: 0px;
}

/* ==========================================================
limited-release
========================================================== */
.limited-release-caution {
  font-size: 14px;
  color: #44bac7;
}

/* ==========================================================
prj-area
========================================================== */
.prj-area-specify-pulldown {
  width: 230px;
  margin-bottom: 12px;
  display: inline-block;
}

/* ==========================================================
tab
========================================================== */

.cmn-tabs {
  margin-top: 50px;
  padding-bottom: 40px;
  width: 100%;
  margin: 0 auto;
}

.cmn-tab-item {
  width: 470px;
  line-height: 66px;
  border: solid #ddd;
  border-width: 1px 1px 0px 1px;
  background-color: #fff;
  font-size:20px;
  text-align: center;
  color: #474747;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}

.topics-list .cmn-tab-item {
  width: 420px;
  display: inline-block;
  float: none;
}

.cmn-tab-item-left {
  margin-right: 20px;
}

.cmn-tab-item:after {
  background-color: #ddd;
  content: "";
  display: block;
  margin: 0 -1px;
  height: 4px;
 }


input[name="cmn-tab-item"] {
  display: none;
}

.cmn-tab-content {
  display: none;
  padding: 30px 0px 0;
  clear: both;
  overflow: hidden;
}

#new-topics-list,
#rank-topics-list,
.topics-read-more-new,
.topics-read-more-rank {
  display: none;
}

#release:checked ~ #release-content,
#maintenance:checked ~ #maintenance-content,
#new-arrival:checked ~ #new-topics-list,
#popular-ranking:checked ~ #rank-topics-list,
#new-arrival:checked ~ .topics-read-more-new,
#popular-ranking:checked ~ .topics-read-more-rank {
  display: block;
}

.cmn-tabs input:checked + .cmn-tab-item,
.topics-list input:checked + .cmn-tab-item {
  background-color: #fff;
  color: #44bac7;
  border: solid #ddd;
  border-width: 1px 1px 0px 1px;
}

.cmn-tabs input:checked + .cmn-tab-item:after,
.topics-list input:checked + .cmn-tab-item:after {
  background-color: #44bac7;
  content: "";
  display: block;
  margin: 0 -1px;
  height: 4px;
}

/* ==========================================================
info_campaign
========================================================== */

.info-icon-color-greenblue,
.info-icon-color-green,
.info-icon-color-blue,
.info-icon-color-orange,
.info-icon-color-gray {
    margin: 0 8px 4px;
    padding: 4px 0;
    width: 80px;
    height: 20px;
    display: inline-block;
    text-align: center;
    font-size: 11px;
    line-height: 11px;
    font-weight: bold;
    border-radius: 4px;
    vertical-align: bottom;
    letter-spacing: 1px;
}

.info-icon-color-greenblue {
    border: 1px solid #44bac7;
    color: #fff;
    background-color: #44bac7;
}

.info-icon-color-green {
    border: 1px solid #268e9b;
    color: #fff;
    background-color: #268e9b;
}

.info-icon-color-blue {
    border: 1px solid #1e97cd;
    color: #fff;
    background-color: #1e97cd;
}

.info-icon-color-orange {
    border: 1px solid #ffb237;
    color: #fff;
    background-color: #ffb237;
}

.info-icon-color-gray {
    border: 1px solid #707070;
    color: #fff;
    background-color: #707070;
}

.info-reaction-count {
  display: inline-block;
  height: 20px;
  width: 64px;
  border: 1px solid #E0DED5;
  border-radius: 15px;
  font-size: 11px;
  line-height: 14px;
  padding: 1px 0 1px 7px;
  color: #474747;
  margin-bottom: 4px;
  vertical-align: bottom;
}

.info-reaction-area {
  text-align: right;
  margin: -10px 19px -10px 0;
}

.info-reaction-btn {
  display: inline-block;
  width: 114px;
  height: 22px;
  position: relative;
  box-shadow: 0px 2px 0px #999999;
  border: 1px solid #999999;
  border-radius: 4px;
  font-size: 14px;
  text-align: center;
  line-height: 20.5px;
  padding: 2px 11px 2px 27px;
  color: #999999;
}

.info-reaction-thx.is-info-reacted.info-reaction-count {
  border-color: #FF5A5F;
}

.info-reaction-thx.is-info-reacted.info-reaction-btn {
  color: #FF5A5F;
  border-color: #FF5A5F;
  box-shadow: none;
}

.info-reaction-good.is-info-reacted.info-reaction-count {
  border-color: #1E97CD;
}

.info-reaction-good.is-info-reacted.info-reaction-btn {
  color: #1E97CD;
  border-color: #1E97CD;
  box-shadow: none;
}

.info-reaction-fight.is-info-reacted.info-reaction-count {
  border-color: #CDAA00;
}

.info-reaction-fight.is-info-reacted.info-reaction-btn {
  color: #CDAA00;
  border-color: #CDAA00;
  box-shadow: none;
}

.is-info-reacted,
.is-info-react-disabled {
  pointer-events: none;
}

.info-icon-reaction {
  width: 16px;
  height: 16px;
}

.info-reaction-count .info-icon-reaction {
  margin-right: 4px;
  margin-bottom: 3px;
}

.info-reaction-btn .info-icon-reaction {
  position: absolute;
  left: 11px;
  top: 2px;
}

.info-reaction-btn.info-reaction-thx .info-icon-reaction{
  background: url(../img/common/react_thanks_line.png) no-repeat;
  background-size: 100%;
}

.info-reaction-btn.info-reaction-good .info-icon-reaction{
  background: url(../img/common/react_good_line.png) no-repeat;
  background-size: 100%;
}

.info-reaction-btn.info-reaction-fight .info-icon-reaction{
  background: url(../img/common/react_fight_line.png) no-repeat;
  background-size: 100%;
}

.info-reaction-count.info-reaction-thx .info-icon-reaction,
.is-info-reacted.info-reaction-btn.info-reaction-thx .info-icon-reaction {
  background: url(../img/common/react_thanks.png) no-repeat;
  background-size: 100%;
}

.info-reaction-count.info-reaction-good .info-icon-reaction,
.is-info-reacted.info-reaction-btn.info-reaction-good .info-icon-reaction {
  background: url(../img/common/react_good.png) no-repeat;
  background-size: 100%;
}

.info-reaction-count.info-reaction-fight .info-icon-reaction,
.is-info-reacted.info-reaction-btn.info-reaction-fight .info-icon-reaction {
  background: url(../img/common/react_fight.png) no-repeat;
  background-size: 100%;
}

/* ==========================================================
topics
========================================================== */
.topics-list {
  font-size: 0px;
}

.topics-list .box-cmn-card-in {
  padding: 40px;
}

.topics-read-more-rank.l-center,
.topics-read-more-new.l-center {
  margin-top: 40px;
}

.mod-cmn-new-item-link {
  display: block;
  margin-bottom: 20px;
  width: 240px;
  height: 160px;
}

.mod-cmn-article-aside .l-list.topics-work-list {
  margin-top: 30px;
}

.js-read-more .btn-cmn-in {
  padding: 13px 25px;
}

/* ==========================================================
message
========================================================== */

.message-header {
  background-color: #faf8f0;
  padding: 30px 0 30px 0;
  position: absolute;
  justify-content: space-between;
  width: 850px;
  z-index: 5;
}

.message-header:before {
  content: '';
  position: absolute;
  left: 0;
  display: inline-block;
  width: 720px;
  height: 1px;
  background-color: #e0ded5;
  bottom: 0px;
}

.message-header.message-fixed {
  position: fixed;
  top: 60px;
  z-index: 5;
}

.search-header {
  background-color: #faf8f0;
  width: 358px;
  z-index: 5;
}

.search-header.message-fixed {
  position: fixed;
  top: 60px;
  z-index: 5;
}

.message-title-update {
  display: inline-block;
  margin-left: 10px;
  vertical-align: top;
}

.message-title {
  display: inline-block;
  width: 480px;
}

.message-title-text {
  height: 48px;
  font-size: 16px;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
}

.message-title-text-ch {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.message-auto-resize-frame {
  width: 100%;
  position: relative;
  display: inline-block;
}

.message-auto-resize-textarea {
  height: 50px;
  max-height: 217px;
  padding: 14px 8px 8px 30px;
  border: 1px solid #44bac7;
  margin-bottom: 20px;
  margin-top: 38px;
  border-radius: 20px;
  font-size: 14px;
  -ms-overflow-style: none;
  overflow: hidden;
}

.message-auto-resize-textarea::placeholder {
  color: #44bac7;
}

.message-auto-resize-textarea:-ms-input-placeholder {
  color: #44bac7;
}

.message-auto-resize-textarea::-ms-input-placeholder {
  color: #44bac7;
}

.message-auto-resize-textarea-open {
  padding: 30px 32px 44px 30px;
  -ms-overflow-style: auto;
  overflow: auto;
}

.message-auto-resize-textarea-open::placeholder {
  color: #999999;
}

.message-auto-resize-textarea-open:-ms-input-placeholder {
  color: #999999;
}

.message-auto-resize-textarea-open::-ms-input-placeholder {
  color: #999999;
}

.message-send {
  display: none;
  position: absolute;
  right: 20px;
  bottom: 40px;
  color: #000;
}

.message-send-icon {
  background-image: url(/wp-content/themes/d-work/asset/img/common/message_send.png);
  background-size: 26px 24px;
  background-repeat: no-repeat;
  width: 26px;
  height: 24px;
}

.message-selectbox {
  display: inline-block;
  position: relative;
  color: #44bac7;
  font-size: 14px;
}

.message-selectbox-update {
  width: 226px;
  text-align: right;
  vertical-align: top;
}

.message-selectbox-search {
  border: 1px solid #44bac7;
  box-shadow: inset 0 -2px 0 0 rgba(4, 0, 0, 0.1);
  border-radius: 5px;
  width: 236px;
  height: 38px;
  background-color: #fff;
}

.message-selectbox-arrow-down {
  background-repeat: no-repeat;
  width: 12px;
  height: 10px;
  background-size: 100%;
}

.message-selectbox-arrow-blue-down {
  background-image: url(/wp-content/themes/d-work/asset/img/common/ico_select_03.png);
}

.message-selectbox-arrow-blue-green-down {
  background-image: url(/wp-content/themes/d-work/asset/img/common/ico_select_01.png);
}

.message-selectbox-arrow-up {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.message-selectbox .message-select {
  display: inline-block;
  color: #1e97cd;
  min-width: 150px;
  width: 100%;
  height: 100%;
}

.message-selectbox .message-select-search {
  width: 100%;
  color: #44bac7;
}

.message-select-selected {
  display: inline-block;
  width: 200px;
}

.message-selectbox-arrow-frame {
  display: inline-block;
  width: 20px;
  margin-top: 5px;
}

.message-list {
  display: flex;
}

.message-selectbox .message-select span {
  padding-right: 10px;
  display: inline-block;
  height: 20px;
  cursor: default;
}

.message-selectbox-search .message-select span {
  padding-left: 10px;
  vertical-align: middle;
}

.message-selectbox .message-pulldown {
  border: solid #bbb 1px;
  width: 100%;
  max-height: 168px;
  position: absolute;
  background: #fff;
  overflow: auto;
  display: none;
  z-index: 5;
  padding: 10px 0 14px 0;
}

.message-selectbox .message-pulldown div {
  padding: 5px 0px 1px 20px;
  color: #44bac7;
  background-size: 14px;
  background-repeat: no-repeat;
  background-position: left 5px center;
  line-height: 20px;
  -ms-user-select: none;
  user-select: none;
}

.message-selectbox .message-pulldown-update div {
  color: #1e97cd;
}

.message-selectbox .message-pulldown-update {
  right: 0;
  width: 200px;
}

.message-search-cate {
  height: 38px;
  margin-bottom: 10px;
  margin-top: 20px;
}

.message-search-mark {
  margin-bottom:20px;
  height:38px;
}

.message-search-text {
  width: 70px;
  margin-left: 20px;
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
}

.icon-base {
  background-repeat: no-repeat;
  background-position: center left 10px;
}

.message-pulldown-option {
  text-align: left;
}

.message-list-icon-base {
  text-align: left;
  margin-top: 10px;
  margin-left: 16px;
}

.message-pulldown-icon-base {
  margin-right: 10px;
}

.mark-icon2 {
  background-image: url(/wp-content/themes/d-work/asset/img/common/message_must.png);
  width: 18px;
  height: 18px;
  background-position: 7px 0px;
  background-repeat: no-repeat;
}

.mark-icon3 {
  background-image: url(/wp-content/themes/d-work/asset/img/common/message_preparation.png);
  width: 18px;
  height: 16px;
  background-position: 0px 1px;
  background-repeat: no-repeat;
}

.mark-icon4 {
  background-image: url(/wp-content/themes/d-work/asset/img/common/message_complete.png);
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
}

.mark-icon5 {
  background-image: url(/wp-content/themes/d-work/asset/img/common/message_request.png);
  width: 18px;
  height: 17px;
  background-repeat: no-repeat;
}

.message-selectbox .message-pulldown div:hover,
.message-selectbox .message-pulldown div.selected {
  color: #fff;
  background-color: #0089eb;
}

.message-update-balloon-frame {
  display: inline-block;
  position: absolute;
}

.mark-update, .cate-update {
  color: #ff5a5f;
  padding-left: 8px;
  display: none;
}

.message-update-cate, .message-update-mark {
  color: #ff5a5f;
  padding-left: 8px;
  display: none;
}

.worker-message-category-select {
  margin-bottom: 10px;
  margin-top: 10px;
  border: 1px solid #44bac7;
}

.message-update-balloon-mark {
  background-color: #fff;
  border: 1px solid #ff5a5f;
  width: 88px;
  height: 26px;
  padding: 3px 7px;
  border-radius: 5px;
  position: relative;
  top: -27px;
  font-weight: bold;
  font-size: 12px;
}

.message-update-balloon-cate {
  background-color: #fff;
  border: 1px solid #ff5a5f;
  width: 88px;
  height: 26px;
  padding: 3px 7px;
  border-radius: 5px;
  position: relative;
  top: -52px;
  font-weight: bold;
  font-size: 12px;
}

.message-update-balloon-mark:before, .message-update-balloon-cate:before {
  content: "";
  position: absolute;
  top: 20px;
  margin-top: -15px;
  border: 7px solid transparent;
  border-right: 7px solid #fff;
  z-index: 2;
  left: -11px;
}

.message-update-balloon-mark:after, .message-update-balloon-cate:after {
  content: "";
  position: absolute;
  top: 20px;
  margin-top: -13px;
  border: 5px solid transparent;
  border-right: 5px solid #ff5a5f;
  left: -10px;
}

.message-update-balloon-2l-cate, .message-update-balloon-2l-mark {
  background-color: #fff;
  border: 1px solid #ff5a5f;
  width: 100px;
  height: 42px;
  padding: 3px 7px;
  border-radius: 5px;
  position: relative;
  top: -50px;
  font-weight: bold;
  font-size: 12px;
}

.message-update-balloon-2l-mark:before {
  content: "";
  position: absolute;
  margin-top: -15px;
  border: 7px solid transparent;
  border-right: 7px solid #faf8f0;
  z-index: 2;
  left: -11px;
  top: 40px;
}

.message-update-balloon-2l-mark:after {
  content: "";
  position: absolute;
  margin-top: -13px;
  border: 5px solid transparent;
  border-right: 5px solid #ff5a5f;
  left: -10px;
  top: 40px;
}

.message-update-balloon-2l-cate:before {
  content: "";
  position: absolute;
  top: 20px;
  margin-top: -15px;
  border: 7px solid transparent;
  border-right: 7px solid #fff;
  z-index: 2;
  left: -11px;
}

.message-update-balloon-2l-cate:after {
  content: "";
  position: absolute;
  top: 20px;
  margin-top: -13px;
  border: 5px solid transparent;
  border-right: 5px solid #ff5a5f;
  left: -10px;
}

.message-title-balloon {
  display: inline-block;
  position: relative;
}

.message-search-mark-blanc {
  width: 358px;
  height: 126px;
  display: none;
}

.message-header-blanc {
  width: 814px;
  height: 109px;
}

.message-duplicate {
  display: none;
}

/* ==========================================================
reception-time
========================================================== */
.reception-time-contents.contents-main,
.mlmgzn-contents.contents-main {
  padding: 55px 0 100px;
}

.l-center-mlmgzn-time .btn-cmn-txt,
.l-center-mlmgzn .btn-cmn-txt {
  letter-spacing: 4px;
}

.txt-cmn-mlmgzn {
  margin-top: 30px;
  margin-bottom: 40px;
  line-height: 1.75;
}

.ttl-cmn-mlmgzn {
  margin-top: 80px;
  margin-bottom: 28px;
  line-height: 1.5;
  font-size: 16px;
  font-weight: bold;
}

.li-txt-cmn-mlmgzn {
  margin-bottom: 40px;
  line-height: 1.75;
}

.li-txt-cmn-mlmgzn:last-child {
  margin-bottom: 0;
}

.li-txt-cmn-mlmgzn-indnt {
  text-indent: -1em;
  margin-left: 1em;
}

/* ==========================================================
item-answer-prmtr
========================================================== */
.form-cmn-check + .item-answer-prmtr {
  height: auto;
}

.form-cmn-pulldown .form-cmn-check + label:before {
  content: none;
}

.item-answer-prmtr-forward-url {
  width: 100%;
  padding: 10px 20px 0px 100px;
  word-break: break-all;
}

.item-answer-prmtr-forward-url:before {
  content: '';
  width: 50px;
  height: 26px;
  border: solid #e0ded5;
  position: absolute;
  border-top: none;
  border-right: none;
  margin-left: -55px;
  margin-top: -10px;
}

.table-cmn-form-cell select.form-cmn-pulldown {
  display: none;
}

.item-answer-prmtr-select {
  text-align: right;
  margin: 30px 0 -64px 0;
}

.forward_url_label {
  text-align: right;
  margin-top: 10px;
  position: relative;
}

.forward_url_label label {
  position: absolute;
  right: 550px;
  top: 18px;
  cursor: default;
}

.form-cmn-counter .forward_url_label [type=text] {
  padding-left: 16px;
  padding-right: 16px;
}

.forward_url_label:before {
  content: '';
  width: 50px;
  height: 26px;
  border: solid #e0ded5;
  position: absolute;
  border-top: none;
  border-right: none;
  left: 103px;
  margin-top: -10px;
}

.tp-parameter-box {
  width: 78%;
}
/* ==========================================================
box-cmn-form-head
========================================================== */
.box-cmn-form-head-links {
  position: relative;
  top: -2px;
  float: right;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.box-cmn-form-head-link {
  width: 40px;
  padding-right: 2px;
}

.box-cmn-form-head-link-region {
  width: 100%;
  border: solid 2px #000000;
  background-color: #FFFFFF;
}

.box-cmn-form-head-link-arrow {
  color: #808080;
}

.box-cmn-form-head-link-ico {
  position: relative;
  left: 10px;
}

.box-cmn-form-head-links .is-disabled {
  pointer-events: none;
}

.js-move-top,
.js-move-bottom,
.js-work-delete,
.js-work-copy {
  display: block;
}

/* ==========================================================
 preview
========================================================== */
.mod-cmn-preview button:not(.pointer-events-auto),
.mod-cmn-preview .btn-cmn {
  pointer-events: none;
  cursor: auto;
}

.preview-buttons .btn-cmn {
  width: 32%;
  margin-left: 14px;
}

.preview-buttons .btn-cmn:first-child {
  margin-left: 0px;
}

.btn-cmn-preview .btn-cmn-in {
  padding: 5px 25px;
}

.btn-cmn-preview .btn-cmn-txt {
  line-height: 1.2;
  font-size: 19px;
}

.btn-cmn-preview .btn-cmn-preview-txt {
  font-size: 15px;
}

.l-center-narrow.btn-cmn-preview {
  margin-top: 50px;
}

/* ==========================================================
 fancrew-list
========================================================== */
.fancrew-search-area #area_slct option.is-active{
  display: block;
}

.fancrew-list-link {
  margin-top: 10px;
}

.fancrew-list-link a {
  color: #FF5A5F;
  font-size: 14px;
  font-weight: bold;
  text-decoration: underline;
}

.fancrew-search-area-color {
  background-color: #faf8f0;
}

.fancrew-search-area {
  width: 560px;
  margin-left: auto;
  margin-right :auto;
  text-align: center;
  padding-bottom: 70px;
  padding-top: 60px;
}

.fancrew-search-area-pref_slct {
  width: 200px;
  height: 56px;
  margin-right: 20px;
  padding: 15px 30px 13px 20px;
  border: 1px solid #44bac7;
  color: #44bac7;
  line-height: 18px;
}

.fancrew-search-area-area_slct {
  width:340px;
  height: 56px;
  border: 1px solid #44bac7;
  color: #44bac7;
  float:right;
  padding: 15px 30px 13px 20px;
  line-height: 18px;
}

.fancrew-search-area-pref_slct,
.fancrew-search-area-area_slct {
  font-size: 16px;
}

.fancrew-search-area-genre_slct {
  width: 560px;
  height: 56px;
  margin-right: 20px;
  border: 1px solid #44bac7;
  color: #44bac7;
  font-size: 16px;
}

input[type="text"].fancrew-search-area-freeword-txt-box {
  width: 560px;
  height: 56px;
  margin-top: 20px;
  margin-bottom: 40px;
  border: 1px solid #44bac7;
}

.fancrew-search-area-freeword-place-holder {
  display: inline-block;
  position: absolute;
  background-color: #fff;
  line-height: 1.05;
  font-size: 16px;
  color: #999999;
  top: 42px;
  left: 21px;
  letter-spacing: normal;
}

.fancrew-search-area .btn-cmn {
  width: 360px;
}

.fancrew-search-area .btn-cmn-yellow .btn-cmn-in {
  box-shadow: 0px 4px 0px 0px #cdaa00;
  line-height: 18px;
  padding: 18px 138px 20px 137px;
}

.fancrew-search-area-freeword-block {
  display: inline-block;
  position: relative;
}

.fancrew-list-area {
  width:  872px;
  margin-left: auto;
  margin-right: auto;
}

.fancrew-list-area .mod-cmn-sort-wrap {
  padding-top: 40px;
  padding-bottom: 40px;
  height: 120px;
  margin-bottom: 0;
}

.fancrew-list-sort-border {
  border-top: 1px solid #e0ded5;
  margin-left: -350px;
  margin-right: -350px;
  }

.fancrew-list-pager-border{
  margin-top: 65px;
  margin-bottom: 10px;
  border-top: 1px solid #e0ded5;
  margin-left: -180px;
  margin-right: -180px;
}

.fancrew-list-item {
  margin-top: 40px;
}

.fancrew-list-item-name.box-cmn-card-ttl {
  font-size: 26px;
}

.fancrew-list-item:not(:last-child) {
  border-bottom: 1px solid #e0ded5;
}

.fancrew-list-item-img {
  height: 175px;
  width: 250px;
  float: left;
  margin-right: 30px;
  margin-bottom: 30px;
}

.fancrew-list-item-sub-contents p:not(:first-child) {
  margin-top: 20px;
}

.fancrew-list-item-sub-contents {
  clear: both;
}

.fancrew-list-item-main-contents .mod-cmn-category {
  height: 36px;
  margin-bottom: 20px;
}

.fancrew-list-item-main-contents .mod-cmn-label {
  height: 36px;
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 13px;
  line-height: 10px;
}

.fancrew-list-item-catch-phrase p {
  color: #44bac7;
  margin-top: 30px;
  margin-bottom: 30px;
}

.fancrew-list-item-contents-ttl {
  font-weight: bold;
}

.fancrew-list-item-catch-phrase p,
.fancrew-list-item-sub-contents p {
  font-size: 18px;
}

.fancrew-list-item-enquete-submit-expires {
  margin-bottom: 20px;
}

.fancrew-list-item-reward-contents {
  text-align:right;
  color: #999999;
}

.fancrew-list-item-reward {
  text-align:right;
}

.fancrew-list-item-reward,
.fancrew-list-item-limit {
  font-size:18px;
}


.fancrew-list-item-reward .fancrew-list-item-reward-phrase1 {
  font-size: 24px;
  margin-right: 13px;
  line-height: 23px;
}

.fancrew-list-item-reward .fancrew-list-item-reward-phrase2 {
  margin-right: 7px;
  line-height: 10px;
}

.fancrew-list-item-reward .fancrew-list-item-reward-phrase1,
.fancrew-list-item-reward .fancrew-list-item-reward-phrase2 {
  color: #333333;
}

.fancrew-list-item-reward .fancrew-list-item-value.box-cmn-card-point {
  line-height: 30px;
}

.fancrew-list-item-reward .box-cmn-card-point-unit {
  line-height: 15px;
}

.fancrew-list-item-limit {
  margin-right: -13px;
  margin-top: 18px;
  line-height: 10px;
}

.fancrew-list-item-limit .fancrew-list-item-value.box-cmn-card-point {
  font-size: 30px;
  margin-left: 8px;
  line-height: 22px;
}

.fancrew-list-item-limit .box-cmn-card-point-unit {
  margin-left: 4px;
  line-height: 15px;
}

.fancrew-list-item-limit .box-cmn-card-status-or {
  margin-left: 3px;
}

.fancrew-list-item-limit .box-cmn-card-point-unit-yen {
  margin-left: 5px;
  margin-right: 2px;
  line-height: 13px;
}

.l-center.fancrew-list-detail-application {
  margin-top: 50px;
  margin-bottom: 65px;
}

.fancrew-list-detail-application .btn-cmn {
  width: 300px;
}

.fancrew-list-contents-main{
  background-color: #fff;
  padding: 0;
  width:auto;
}

.fancrew-list-pager {
  background-color: #faf8f0;
  padding: 70px 0 100px;
  margin-top: 0;
}

.fancrew-list-item-name,
.fancrew-list-item-catch-phrase {
  width: 592px;
  display: block;
  float: right;
}

.ico-fancrew-help-arrow {
  background: url(../img/common/icon_arrow_pc@2x.png) no-repeat;
  background-size: 100%;
  width: 22px;
  height: 22px;
  top: 330px;
  right: 616px;
  margin-left: 10px;
}

.fancrew-list-item-name {
  line-height: 40px;
}

.fancrew-list-item-catch-phrase {
  line-height: 28px;
  font-weight: bold;
}

.fancrew-list-item-sub-contents p {
  line-height: 30px;
}

.fancrew-list-detail-application .btn-cmn-in {
  line-height: 18px;
  padding: 18px 107px 20px 108px
}

.btn-fancrew {
  margin-left: 0px;
}

/* ==========================================================
 fancrew-shop
========================================================== */
.fancrew-shop-img {
  width: 300px;
  height: 210px;
  margin-left: 40px;
  margin-bottom: 40px;
  float: right;
  margin-top: 30px;
}

.fancrew-shop-main-contents .ttl-cmn-detail {
  margin-top: 30px;
  margin-bottom: 40px;
  line-height: 42px;
}

.fancrew-shop-catch-phrase {
  color: #44bac7;
  margin-bottom: 40px;
  line-height: 30px;
  font-weight: bold;
}

.fancrew-shop-main-contents .ttl-cmn-detail,
.fancrew-shop-main-contents .fancrew-shop-catch-phrase {
  display: block;
  width: 60%;
}

.fancrew-shop-description {
  clear: both;
  line-height: 28px;
}

.fancrew-shop-sub-contents p:not(:nth-child(2)) {
  margin-top: 20px;
}

.fancrew-shop-sub-contents p {
  line-height: 28px;
  font-size: 16px;
}

.fancrew-shop-contents-ttl {
  font-weight: bold;
}

.fancrew-shop-main-contents .mod-cmn-category {
  height: 36px;
}

.fancrew-shop-main-contents .mod-cmn-label {
  height: 36px;
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 13px;
  line-height: 10px;
}

.fancrew-shop-main-contents,
.fancrew-shop-sub-contents {
  width: 860px;
  margin-left: auto;
  margin-right: auto;
}

.fancrew-shop-sub-contents {
  margin-top: 60px;
}

.fancrew-shop-sub-contents .ttl-cmn-04.ttl-cmn-04-a {
  margin-bottom: 16px;
}

.l-center.fancrew-shop-application {
  margin-bottom: 4px;
}

.fancrew-list-item-main-contents {
  overflow: hidden;
}

.fancrew-list-item-address,
.fancrew-shop-address {
  padding-left:3em;
  text-indent:-3em;
  }

.fancrew-list-item-average-budget,
.fancrew-list-item-enquete-submit-expires,
.fancrew-list-item-shipping-fee,
.fancrew-shop-shipping-fee,
.fancrew-shop-average-budget,
.fancrew-shop-access,
.fancrew-shop-business-hours {
  padding-left:5em;
  text-indent:-5em;
}

.fancrew-shop-hp-url {
  padding-left:7em;
  text-indent:-7em;
}

.fancrew-shop-application .btn-cmn-in {
  padding: 18px 43px 20px 43px;
  line-height: 18px;
}

/* ==========================================================
 f-w
========================================================== */
.f-w-bold {
  font-weight: bold;
}

.table-cmn-form-cell-in-all-segment {
  background-color: #e0ded5;
  padding: 10px 0px 10px 25px;
  margin: 0px 200px 0px 45px;
}

.table-cmn-form-cell-in-all-segment .all-segment-num {
  padding-left: 55px;
}

.table-cmn-form-cell-in-all-segment .all-segment-num + span {
  font-size: 11px;
}

.prj-area-specify-pulldown + .list-cmn-form-item {
  padding-left: 10px;
  margin-top: 5px;
}

.list-cmn-form.js-prfctrs-disp {
  width: 108%;
}

.list-cmn-form.js-prfctrs-disp li, .list-cmn-form.js-ocptn-disp .s-width-lg-30per{
  padding-right: 0px;
}

/* ==========================================================
 recommend
========================================================== */
.recommend-area {
  margin: 40px 0 0 0;
}

.recommend-area.recommend-is-search {
  margin: 0 0 30px 0;
}

.recommend-title-balloon {
  position: relative;
  background-color: #43C88E;
  border-radius: 8px;
  color: #fff;
  font-weight: bold;
  text-align: left;
  font-size: 20px;
  line-height: 35px;
}

.recommend-title-balloon::before {
  content: "";
  position: absolute;
  left: 50%;
  right: 0;
  top: calc(100% - 1px);
  margin-left: -14px;
  display: none;
  width: 0px;
  height: 0px;
  border: 14px solid transparent;
  border-top: 12px solid #43C88E;
}

.recommend-is-active::before {
  display: block;
}

.js-accordion-recommend {
  display: block;
  padding: 13px 20px;
  color: #fff;
}

.recommend-area .box-cmn-card-in {
  border: 2px solid #43C88E;
}

.recommend-area .box-cmn-card-in-attention {
  border-left: solid 10px #FF5B5E;
}

.recommend-area .box-cmn-card-in-attention:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10px;
  border-radius: 0 0 0 8px;
  border-bottom: solid 10px #FF5B5E;
}

.ico-recommend-display {
  background: url(../img/common/recommend_open.png) no-repeat;
  background-size: 100%;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 14px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.recommend-is-active .ico-recommend-display {
  background: url(../img/common/recommend_close.png) no-repeat;
  background-size: 100%;
}

.recommend-list {
  margin-top: 30px;
}

.recommend-list .l-list-item:first-child {
  margin-top: 0;
}

/* ==========================================================
 chat
========================================================== */
.chat-end-set {
  margin-top: 20px;
}

.chat-end-select {
  margin: 7px 30px 10px;
  background: #F0F0F0;
  padding: 7px 10px;
}

.chat-end-select.is-active {
  background: #fff;
}

.chat-end-select .form-cmn-check-single + label {
  color: #B7B7B7;
}

.is-active.chat-end-select .form-cmn-check-single + label {
  color: #808080;
}

.chat-end-select .form-cmn-check-single + label:last-child {
  margin-left: 10px;
}

.chat-end-select .form-cmn-check-single[type="radio"]:checked + label:before {
  border-color: #B7B7B7;
}

.chat-end-select .form-cmn-check-single[type="radio"]:checked + label:after {
  background-color: #B7B7B7;
}

.is-active.chat-end-select .form-cmn-check-single[type="radio"]:checked + label:before {
  border-color: #ff5a5f;
}

.is-active.chat-end-select .form-cmn-check-single[type="radio"]:checked + label:after {
  background-color: #ff5a5f;
}

.chat-link-prj-form {
  margin-top: 20px;
  margin-bottom: 30px;
}

.chat-icon-upload .form-cmn-file-item.js-file.is-active{
  margin-top: 0px;
}

.chat-prj-item-link-usr-id {
  margin-top: 8px;
  text-align: right;
}

.prj-item-no-text {
  float: right;
  margin-right: 10px;
  font-size: 12px;
  background-color: #43C88E;
  border-radius: 4px;
  padding: 3px 6px;
  color: #FFFFFF;
  height: 24px;
}

.chat-reading-area {
  background-color: #fff;
  border-radius: 0 26px 26px 28px;
  padding: 13px 35px 13px 35px;
  margin-bottom: 20px;
  line-height: 26px;
  display: inline-block;
  border: 1px solid #DFDFDF;
}

.chat-read-item {
  display: inline-block;
  height: 10px;
}

.chat-read-item:nth-child(1) {
  -webkit-animation: chat-read1 1s steps(1) 0s 2 forwards;
  animation: chat-read1 1s steps(1) 0s 2 forwards;
}

.chat-read-item:nth-child(2) {
  -webkit-animation: chat-read2 1s steps(1) 0s 2 forwards;
  animation: chat-read2 1s steps(1) 0s 2 forwards;
}

.chat-read-item:nth-child(3) {
  -webkit-animation: chat-read3 1s steps(1) 0s 2 forwards;
  animation: chat-read3 1s steps(1) 0s 2 forwards;
}

@-webkit-keyframes chat-read1 {
  0% {
    background-color: #44BAC7;
    opactiy: 1;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }
  25% {
    background-color: #E0DED5;
    opactiy: 0.4;
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
  }
  50% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  75% {
    background-color: #E0DED5;
    margin-top: 1px;
  }
  100% {
    background-color: #E0DED5;
    margin-top: 5px;
  }
}

@-webkit-keyframes chat-read2 {
  0% {
    background-color: #44BAC7;
    opacity: 0.4;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  25% {
    background-color: #44BAC7;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
    opacity: 1;
  }
  50% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  75% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@-webkit-keyframes chat-read3 {
  0% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  25% {
    background-color: #44BAC7;
    opacity: 0.4;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  50% {
    background-color: #44BAC7;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
    opacity: 1;
  }
  75% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@keyframes chat-read1 {
  0% {
    background-color: #44BAC7;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
    opacity: 1;
  }
  25% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  50% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  75% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@keyframes chat-read2 {
  0% {
    background-color: #44BAC7;
    opacity: 0.4;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  25% {
    background-color: #44BAC7;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
    opacity: 1;
  }
  50% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  75% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@keyframes chat-read3 {
  0% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  25% {
    background-color: #44BAC7;
    opacity: 0.4;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  50% {
    background-color: #44BAC7;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
    opacity: 1;
  }
  75% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    background-color: #E0DED5;
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

.chat-icon {
  display: inline-block;
  vertical-align: top;
  padding-right: 15px;
}

.chat-icon-img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.chat-message {
  max-width: 600px;
  background-color: #fff;
  border-radius: 0 26px 26px 28px;
  padding: 16px 20px;
  margin-bottom: 20px;
  line-height: 26px;
  display: inline-block;
  color: #808080;
  border: 1px solid #DFDFDF;
}

.chat-link-area {
  font-size: 0;
}

.chat-text-link {
  display: inline-block;
  max-width:600px;
  background-color: #fff;
  border-radius: 0 26px 26px 28px;
  padding: 12px 20px;
  margin-bottom: 20px;
  text-decoration: underline;
  line-height: 26px;
  border: 1px solid #DFDFDF;
  font-size: 18px;
}

.chat-image-link {
  display: inline-block;
  border-radius: 0 26px 26px 28px;
  margin-bottom: 20px;
  border: 1px solid #DFDFDF;
}

.chat-image-link-img {
  border-radius: 0 26px 26px 28px;
  max-width: 300px;
}

.contents-chat {
  background-color: #FAF8F0;
}

.contents-main-chat {
  background-color: #FAF8F0;
  width: 840px;
  margin-left: auto;
  margin-right: auto;
  letter-spacing: 0.9px;
  font-size: 18px;
  margin-top: 46px;
  padding: 10px 20px;
  border-right: 1px solid #CAC7BB;
  border-left: 1px solid #CAC7BB;
}

.chat-select-area {
  font-size: 0;
}

.chat-select-message {
  display: inline-block;
  max-width: 600px;
  border-radius: 0 26px 26px 28px;
  margin-bottom: 20px;
  background-color: #fff;
  padding: 16px 20px;
  line-height: 26px;
  color: #808080;
  font-size: 18px;
  border: 1px solid #DFDFDF;
}

.chat-message b,
.chat-select-message b {
  color:#474747;
}

.chat-message .rich-red b,
.chat-select-message .rich-red b{
  color: #ff5a5f;
}

.chat-select-item {
  color: #474747;
  font-weight: bold;
}

.chat-select {
  position: fixed;
  width: 760px;
  bottom: 0px;
  background-color: #FFFFFF;
  padding: 23px 2px 35px 32px;
  border-radius: 20px;
  margin: 0 auto;
  text-align: center;
  border: 1px solid #DFDFDF;
  left: calc(50% - 380px);
}

.chat-select-1l {
  height: 170px;
}

.chat-select-2l {
  height: 278px;
}

.chat-select-blank-1l {
  height: 170px;
}

.chat-select-blank-2l {
  height: 278px;
}

.chat-select-text {
  padding-bottom: 25px;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 1px;
  line-height: 24px;
}

.chat-select-button-li {
  display: inline-block;
}

.chat-select-button {
  width: 60px;
  height: 56px;
  background-color: #fff;
  border: 2px solid #3CA3AF;
  margin-right: 15px;
  margin-bottom: 20px;
  border-radius: 10px;
  font-size: 30px;
  font-weight: bold;
  color: #44BAC7;
  text-align: center;
  vertical-align: middle;
  box-shadow: 0px 2px 0px 0px #3CA3AF;
}

.chat-select-button:hover {
  margin-top: 2px;
  margin-bottom: 18px;
  background-color: #3CA3AF;
  color: #fff;
  box-shadow: 0px 0px 0px 0px #3CA3AF;
}

.chat-finish {
  background-color: #FAF8F0;
  text-align: center;
  padding: 50px 0 60px 0;
  margin: 0 -12px 0 -12px;
}

.chat-finish-button {
  width: 360px;
  height: 56px;
  background-color: #44BAC7;
  color: #fff;
  border-radius: 8px;
  font-size: 20px;
  box-shadow: 0px 4px 0px #3CA3AF;
  letter-spacing: 2px;
}

.chat-complete-bannar {
  padding-top: 30px;
  background-color: #FAF8F0;
  margin: 0 -12px 0 -12px;
}

.chat-user-select {
  text-align: right;
}

.chat-user-select-body {
  background-color: #FFD500;
  border-radius: 26px 0 28px 26px;
  padding: 12px 20px 13px;
  margin: 0 0 20px auto;
  display: inline-block;
  font-weight: bold;
  line-height: 26px;
  border: 1px solid #DFDFDF;
  max-width: 600px;
}

.chat-circle {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #E0DED5;
}

.chat-circle:nth-last-child(n+2) {
  margin-right: 5px;
}

.chat-wallet {
  margin-bottom: 10px;
  margin-top: 10px;
}

.chat-wallet-body {
  width: 230px;
  height: 230px;
  border-radius: 25px;
  border: 1px solid #DFDFDF;
  padding-top: 32px;
}

.chat-wallet-body .ico-cmn-wallet {
  background-position: 0px 820px;
  width: 91px;
  height: 81px;
  background-size: 211px 7919px;
}

.chat-wallet-body .mod-cmn-wallet-txt {
  font-size: 51px;
}

.chat-wallet-body .mod-cmn-wallet-unit {
  font-size: 23px;
  line-height: 40px;
}

.chat-wallet-body .mod-cmn-wallet-txt-sub {
  font-size: 15px;
  line-height: 23px;
  letter-spacing: 1.5px;
}

.chat-msg-by-selected {
  width: 514px;
  height: 56px;
  margin: 0 18px 0 42px;
  padding: 15px 16px;
  font-size: 16px;
}

.chat-msg-by-selected-area {
  position: relative;
  font-size: 0px;
}

.chat-msg-by-selected-area:before {
  content: '';
  background: url(../img/common/chat_next_msg_arrow.png) no-repeat;
  background-size: 100%;
  width: 22px;
  height: 16px;
  position: absolute;
  left: 10px;
  top: -2px;
}

.chat-msg-by-selected-area label {
  font-size: 16px;
  vertical-align: middle;
}

.chat-msg-by-selected-title {
  font-size: 14px;
  font-weight: bold;
  color: #44BAC7;
  margin: 8px 0 6px 42px;
}

.prj-item-no-number {
  font-size: 13px;
  font-family: "Roboto Slab";
}

.chat-select-link-pic {
  display: table-cell;
  width: 170px;
}

.chat-select-link-text {
  margin-right: 30px;
}

.chat-select-link.extens-picture-input .form-cmn-file-item {
  width: 300px;
}

.chat-select-link .form-cmn-file-input {
  width: 300px;
  padding: 0 24px 0 16px;
}

.chat-select-link.extens-picture-input {
  border: 0px;
  border-radius: 0px;
  padding: 0px;
  margin-bottom: 20px;
}

.chat-select-link .extens-picture-ul .js-file-select .btn-cmn-in {
  height: 36px;
  width: 148px;
  padding: 8px;
}

input[type="text"].chat-extnd-forwrd-url {
  height: 56px;
}

.chat-add-usr-id {
  margin-top: 16px;
}

.chat-form-head-links.box-cmn-form-head-links {
  top: 0px;
}

.chat-form-head-links .box-cmn-form-head-link {
  width: 24px;
  height: 24px;
  padding-right: 0px;
}

.chat-form-head-links .box-cmn-form-head-link-region {
  height: 24px;
  border: solid 1px #707070;
}

.chat-form-head-links .box-cmn-form-head-link-ico {
  position: absolute;
  left: 5px;
  top: 5px;
}

.chat-form-head-links .chat-form-head-links-move {
  margin-right: 10px;
}

.chat-counter .form-cmn-add-list {
  margin-bottom: 20px;
}

.chat-end-select .form-cmn-check-single:disabled + label:before,
.chat-end-select .form-cmn-check-single:disabled + label:after {
  background-color: #fff;
}

/* ==========================================================
 promotion
========================================================== */
.start-work-body.only-pc .promotion-parts {
  display: none;
}

.promotion-btn-top.only-pc .promotion-parts {
  display: block;
}

.promotion-img {
  width: 300px;
  height: 250px;
  display: block;
  object-fit: contain;
}

.promotion-img-outer {
  width: 300px;
  height: 250px;
  float: left;
  margin-bottom: 24px;
}

.promotion-detail {
  width: 100%;
  height: 100%;
  padding: 30px 30px 0 30px;
  margin-top: 0px;
  table-layout: fixed;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background-color: #fff;
}

.promotion-detail-overview {
  font-size: 16px;
  padding-bottom: 30px;
}

.promotion-attachment {
  margin-top: 30px;
  border-top: 1px solid #e0ded5;
}

.promotion-detail-lh {
  line-height: 26px;
  clear: both;
}

.promotion-list-cmn-status {
  margin-top: 36px;
}

.start-work-body:not(.only-pc):not(.only-sp).promotion-start-work-body {
  margin-top: 36px;
}

.promotion-detail-content {
  display: inline-block;
  padding-top: 4px;
  width: auto;
  overflow-wrap: break-all;
  width: calc(100% - 150px);
}

.promotion-detail-title {
  padding-left: 324px;
}

.promotion-detail-title-label {
  color: #44bac7;
  font-size: 22px;
  vertical-align: top;
  display: inline-block;
  width: 118px;
}

.promotion-detail-border-top {
  padding-top: 10px;
  border-top: 1px solid #474747;
}

.promotion-detail-popup-reward {
  min-height: auto;
  padding-bottom: 20px
}

.promotion-detail-popup-warning {
  color: #000;
  margin-top: 15px;
  min-height: auto;
  padding-bottom: 20px
}

.promotion-detail-popup-confirm {
  margin: 10px 0 8px 0;
}

.btn-promotion-tooltip {
  background-image: url(../img/common/icon_tooltips.png);
  background-size: 100%;
  width: 20px;
  height: 20px;
  position: relative;
  z-index: 4;
  margin: 5px 8px 0px 4px;
}

.btn-promotion-tooltip-after {
  background-image: url(../img/common/icon_tooltips_after.png);
}

.prm-tooltip {
  font-size: 13px;
  font-weight: bold;
  line-height: 1.6;
  text-align: left;
  position: absolute;
  width: 100%;
  max-width: 311px;
  z-index: 5;
  padding-left: 14px;
  background: #fff;
  border-radius: 8px;
  border: 2px solid #44BAC7;
  box-shadow: 0px 3px 8px #00000029;
}

.prm-tooltip-balloon {
  margin: -10px 0px 0px 60px;
  width: 18px;
  height: 18px;
  transform: rotate(225deg);
  background: linear-gradient(225deg, #fff, #fff);
  border-right: 2px solid #44BAC7;
  border-bottom: 2px solid #44BAC7;
}

.prm-tooltip-ttl {
  color: #44BAC7;
  font-size: 14px;
  padding-top: 3px;
}

.prm-tooltip-txt {
  color: #474747;
  padding-right: 18px;
}

.prm-tooltip-att {
  color: #999999;
  font-size: 12px;
  padding-left: 1em;
  padding-right: 17px;
  text-indent: -1em;
}

.prm-tooltip-url {
  color: #44BAC7;
  float: right;
  font-weight: normal;
  padding: 8px 20px 8px 0px;
}

.prm-tooltip-bg {
  display: none;
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ==========================================================
 cpx-research
========================================================== */
.cpx-att-area {
  padding: 14px 15px 15px 16px;
  width: 100%;
  height: 100%;
  border: 1px solid #e0ded5;
  border-radius: 8px;
  background-color: #fff;
  line-height: 23px;
  font-size: 14px;
}

.cpx-read-must {
  background-image: url(../img/common/read_must.png);
  background-size: 100% 100%;
  margin-right: 5px;
  margin-bottom: 1px;
  width: 31px;
  height: 19px;
}

.cpx-read-must-txt {
  color: #FF5A5F;
  font-size: 16px;
  font-weight: bold;
  text-decoration: underline;
  text-align: center;
  margin-bottom: 7px;
}

.cpx-result-area {
  margin-top: 25px;
  margin-bottom: 30px;
}

.cpx-list-area {
  margin-bottom: 30px;
}

.cpx-original-pay {
  text-decoration: line-through;
  color: #aaa;
}

/* ==========================================================
 normal
========================================================== */
.normal-img {
  display: block;
  margin: 0 auto 24px;
  width: 300px;
  height: 250px;
  object-fit: contain;
}

/* ==========================================================
 tp-select
========================================================== */
.tp-title {
  color: #44bac7;
  font-weight: bold;
  font-size: 24px;
  line-height: 100%;
}

.tp-select {
  display: table;
  width: 100%;
  margin-top:30px;
}

.tp-select-title {
  display: table-cell;
  padding-right: 20px;
  font-weight: bold;
  width: 100px;
}

.tp-select-area {
  display: table-cell;
  width: 230px;
}

.tp-select-select {
  width: 230px;
  display: inline-block;
}

.reward-check {
  padding-left: 15px;
  display: inline-block;
}

/* ==========================================================
 work-cw
========================================================== */
.btn-txt-cw {
  display: block;
  font-size: 12px;
}

/* ----------------------------------------------------------
 word-break
---------------------------------------------------------- */
.wb-ba {
  word-break: break-all;
}

/* ----------------------------------------------------------
 thmbnl
---------------------------------------------------------- */
.thmbnl-card-lists {
  clear: left;
  padding-top: 16px;
  margin-top: 0;
}

.thmbnl-card-lists .box-cmn-card-list {
  font-size: 18px;
}

.mp-dpoint-detail-box-body-line-lmtd-pnt {
  height: 177px;
}

.mp-cmn-direction-ttl-lmtd-pnt {
  padding-left: 57px;
  margin-top: 6px;
}

.mod-cmn-work-get.detail-add-utprice-fixed-rate {
  top: -25px;
}

.list-add-utprice.add-utprice-fixed-rate {
  bottom: 56px;
}

.box-cmn-card-reward-area-period-limited-point .list-add-utprice.add-utprice-fixed-rate {
  bottom: 76px;
}

.list-add-utprice.add-utprice-fixed-rate .new-rwrd {
  padding-right: 4px;
}

.list-add-utprice.add-utprice-fixed-rate .new-rwrd .box-cmn-card-point-unit,
.detail-add-utprice-fixed-rate .new-rwrd .box-cmn-card-point-unit {
  margin-left: 2px;
}

.box-cmn-card-status.add-utprice-fixed-rate {
  margin-top: 25px;
}

.box-cmn-card-status.add-utprice-fixed-rate .old-rwrd,
.detail-add-utprice-fixed-rate .old-rwrd {
  font-size: 18px;
  padding-left: 55px;
  height: auto;
  margin: 5px 0px 5px 0px;
}

.detail-add-utprice-fixed-rate .new-rwrd {
  padding-right: 0px;
}

.detail-add-utprice-fixed-rate .old-rwrd-group {
  display: block;
  margin-bottom: 10px;
  margin-top: 10px;
}

.detail-add-utprice-fixed-rate .mod-cmn-board-item-period-limited-point-text {
  display: block;
  width: 100%;
}

/* ----------------------------------------------------------
  top-cate-group
 -------------------------------------------------------- */

.top-cate-group-ttl {
  margin-top: 30px;
  margin-bottom: 30px;
  line-height: 1.5;
  font-size: 20px;
  font-weight: bold;
  border-bottom: none;
  padding-bottom: 0;
}

.top-cate-group-ttl-in {
  display: inline-block;
  position: relative;
  padding-left: 20px;
}

.top-cate-group-ttl-in:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 5px;
  height: 100%;
  background-color: #44bac7;
  border-radius: 6px;
}

.top-cate-group-more {
  text-align: right;
  margin-top: 15px;
  font-size: 15px;
}

/* ----------------------------------------------------------
  useage-histry
---------------------------------------------------------- */

.uh-table-row {
  display: table-row;
}

.uh-table-cell {
  display: table-cell;
}

.uh-direction-head-dpoint {
  display: table-cell;
  width: 380px;
  vertical-align: top;
  padding-bottom: 10px;
  border-bottom: 1px solid #E0DED5;
}

.uh-direction-head-dpoint-line {
  border-bottom: 1px solid #E0DED5;
}

.uh-point {
  font-size: 32px;
  color: #ff5a5f;
  font-weight: bold;
  margin-right: 8px;
}

.uh-unit {
  font-size: 24px;
  color: #ff5a5f;
  font-weight: bold;
}

.uh-unit-font-small {
  font-size: 16px;
}

.uh-dpoint-total-box-body-line {
  display:table;
  vertical-align: top;
  border-bottom: 1px solid #e0ded5;
}

.uh-dpoint-total-box-body-line.uh-levelup-reward-box {
  display: block;
}

.mod-cmn-board-item-point-overflow {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: #474747;
}

.uh-period-limited-point-text {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.uh-get-reward-type {
  font-size: 18px;
  color: #999999;
  width: 72px;
  padding-left: 20px;
}

.uh-get-reward-type-small {
  font-size: 14px;
}

.research-start-work-body:not(.only-pc):not(.only-sp) .footer-order-item, .research-start-work-body:not(.only-pc):not(.only-sp) .research-work-caution-txt {
  display: none;
}

.tentame-start-work-body .footer-order-item,.tentame-start-work-body .worker-tentame-guide-area{
  display: none;
}

.uh-select-sts {
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}

.uh-select-sts li {
  width: 31%;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  background: #E0DED5;
  border-radius: 8px 8px 0 0;
  cursor: pointer;
}

.uh-select-sts li:hover {
  opacity: .7;
}

.uh-select-sts li:nth-of-type(2) {
  line-height: 35px;
}

.uh-select-sts li:nth-of-type(2) span {
  display: block;
  line-height: 5px;
  font-size: 14px;
  font-weight: normal;
  text-align: center;
}

.uh-select-sts li.select-sts-btn-selected {
  position: relative;
  margin-top: -8px;
  height: 58px;
  line-height: 58px;
  background: #fff;
  border: 1px solid #44bac7;
  border-bottom: none;
  z-index: 1;
}

.uh-select-sts li.select-sts-btn-selected:hover {
  opacity: 1;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(68, 186, 199, 0.7);
  border-bottom: none;
  color: rgba(71, 71, 71, 0.7);
}

.uh-select-sts li.select-sts-btn-selected::after {
  display: block;
  position: absolute;
  bottom: -2px;
  width: 100%;
  height: 3px;
  content: '';
  background: #fff;
}

.uh-select-sts li:nth-of-type(2).select-sts-btn-selected {
  line-height: 36px;
}

.uh-select-year-month {
  display: -webkit-flex;
  display: flex;
  position: relative; /* JSでのボタン表示位置制御に必要 */
  padding: 10px 12px;
  overflow-x: scroll;
  background: #fff;
  border-top: 1px solid #44bac7;
}

.uh-select-year-month-btn {
  padding: 4px;
  width: 120px;
  min-width: 120px;
  height: 54px;
  line-height: 28px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  color: #44bac7;
  border-radius: 8px;
  border: 1px solid #44bac7;
  cursor: pointer;
}

.uh-select-year-month-btn:hover {
  opacity: .7;
}

.uh-select-year-month-btn + .uh-select-year-month-btn {
  margin-left: 14px;
}

.uh-select-year-month-btn span {
  display: block;
  line-height: 12px;
}

.uh-select-year-month-btn-selected {
  background: #44bac7;
  color: #fff;
}

.uh-levelup-reward-row {
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  margin-bottom: 7px;
  height: 35px;
  line-height: 35px;
}

.uh-prj-list-ttl {
  position:relative;
  margin-bottom: 30px;
  text-align: center;
  font-weight: bold;
  font-size: 24px;
  color: #44bac7;
}
 
.uh-prj-list-ttl::before,
.uh-prj-list-ttl::after {
  display:block;
  position: absolute;
  top: 16px;
  content: '';
  width: calc(50% - 65px);
  height: 1px;
  background: #e0ded5;
}

.uh-prj-list-ttl::before {
  left: 0;
}

.uh-prj-list-ttl::after {
  right: 0;
}

.uh-prj-list-label {
  display: block;
  padding: 1px 7px;
  height: 22px;
  line-height: 22px;
  font-size: 14px;
  border-radius: 4px;
  background: #44BAC7;
  color: #fff;
  font-family: 'メイリオ', 'Meiryo','ＭＳ ゴシック','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
  text-align: center;
}

.uh-prj-list-label.add-mt {
  margin-top: 4px;
}

.uh-prj-list-label.only-sp {
  display: none;
}

.uh-prj-list-label-wrapp-outer {
  display: inline-block;
  width: 126px;
  height: 48px;
  vertical-align: bottom;
}

.uh-prj-list-label-wrapp-inner {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  height: 100%;
}

.uh-prj-list-no-item {
  margin-top: 20px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

.uh-application-history-area {
  margin-top: 20px;
  text-align: center;
}

.uh-application-history {
  display: inline-block;
  text-align: left;
}

.uh-application-history a {
  color: #44bac7;
  font-size: 16px;
  font-weight: bold;
  line-height: 60px;
  text-decoration: underline;
}

.uh-toggle-area {
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
  margin: 10px 0;
  font-family: 'メイリオ', 'Meiryo','ＭＳ ゴシック','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
  font-size: 14px;
  font-weight: bolder;
}

.uh-toggle-area p {
  margin: auto 0;
}

.uh-toggle-btn {
  margin: auto 10px;
  line-height: 25px;
  text-align: center;
}

.uh-toggle-btn input[type="checkbox"]:checked + label span:after {
  position: relative;
  right: 0;
  content: "ON";
  padding: 0 30px 0 0;
  color: #474747;
}

.uh-toggle-btn label span:after {
  position: absolute;
  right: 10px;
  content: "OFF";
  font-size: 12px;
  line-height: 27px;
  color: #474747;
}

.uh-toggle-btn span {
  font-size: 10px;
}

.uh-cmn-toggle {
  position: absolute;
  visibility: hidden;
}

.uh-cmn-toggle + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  user-select: none;
}

input.uh-cmn-toggle-round-flat + label {
  padding: 2px;
  width: 70px;
  height: 30px;
  background-color: #d0cece;
  border-radius: 60px;
  transition: background 0.4s;
}

input.uh-cmn-toggle-round-flat + label:before,
input.uh-cmn-toggle-round-flat + label:after {
  display: block;
  position: absolute;
  content: "";
}

input.uh-cmn-toggle-round-flat + label:before {
  top: 2px;
  left: 2px;
  bottom: 2px;
  right: 2px;
  border-radius: 60px;
  transition: background 0.4s;
}

input.uh-cmn-toggle-round-flat + label:after {
  top: 2px;
  left: 2px;
  bottom: 2px;
  width: 30px;
  background-color: #fff;
  border-radius: 52px;
  transition: margin 0.4s, background 0.4s;
}

input.uh-cmn-toggle-round-flat:checked + label {
  background-color: #44bac7;
}

input.uh-cmn-toggle-round-flat:checked + label:before {
  background-color: #fff;
}

input.uh-cmn-toggle-round-flat:checked + label:after {
  margin-left: 37px;
  background-color: #44bac7;
}

/* ----------------------------------------------------------
  approval
---------------------------------------------------------- */

.textarea-approval_condition {
  width: 75%;
  display: table-cell;
}

.entry_sample {
  font-size: 14px;
  padding-left: 10px;
}

.work-id-region.is-unactive {
  display: none;
}

.work-id-select {
  text-overflow: ellipsis; 
}

/* ----------------------------------------------------------
  approval
---------------------------------------------------------- */

.confirm_title {
  width: 75px;
  color:#44bac7;
  margin-right:10px;
}


/* ==========================================================
  worker-poikatsu-guide worker-tentame-guide-area worker-tentame-guide other-tentame-link
========================================================== */
.worker-poikatsu-guide {
  margin-top: 10px;
}

.worker-tentame-guide-area {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
    justify-content: center;
  -webkit-align-items: baseline;
  -ms-flex-align: baseline;
    align-items: baseline;
  column-gap: 30px;
  margin-top: 15px;
}

.worker-poikatsu-guide a,.worker-tentame-guide a {
  color: #FF5A5F;
  font-size: 14px;
  font-weight: bold;
  text-decoration: underline;
}

.other-tentame-link a {
  color: #44bac7;
  font-size: 14px;
  font-weight: bold;
  text-decoration: underline;
}

.worker-read-must {
  background-image: url(../img/common/read_must.png);
  background-size: 100% 100%;
  margin-right: 6px;
  width: 35px;
  height: 21px;
}

/* ==========================================================
  worker-inquery
========================================================== */
.work-inq-file {
  margin-bottom: 10px;
  font-weight: normal;
}

.work-inq-area {
  width: 660px;
}

.work-inq-poikatsu-warning ,.work-inq-remuneration-warning {
  margin-top: 10px;
}

.work-inq-filesize-warning {
  font-weight: normal;
}

.work-inq-remuneration-warning-txt-indent {
  text-indent: 1em;
}

.non-login-inq {
  display: block;
  width: fit-content;
  margin: 15px auto 0;
  cursor: pointer;
}

/* ==========================================================
  client-recruit-count
========================================================== */
.recruit_count_line {
  position: absolute;
  width: 90px;
  height: 140px;
  border-left: 2px solid #808080;
  border-bottom: 2px solid #808080;
  top: -112px;
  left: -2px;
  pointer-events: none;
}

.recruit_count_input_title {
  padding-left: 8px;
  text-align: left;
  display: inline-block;
  margin-left: 28px;
  width: 88px;
  color: #808080;
  position: relative;
  pointer-events: none;
}

/* ==========================================================
  dcard
========================================================== */
.dcard-modal-anchor {
  text-decoration: underline;
  color: #ff5a5f;
}

.dcard-header .l-container-sp-header {
  position: relative;
  width: 1024px;
  height: 80px;
}

.dcard-header .header-copy {
  position: absolute;
  right: 0;
  bottom: 10px;
  font-size: 14px;
}

.dcard-contents {
  margin: 0 auto;
  padding: 0 32px;
  width: 100%;
  max-width: 1024px;
  background: #fff;
  box-sizing: border-box;
}

.dcard-contents img {
  width: 100%;
}

.dcard-contents .btn {
  text-align: center;
}

.dcard-contents .btn-cmn {
  width: 604px;
}

.dcard-contents .btn-cmn-in {
  padding: 0;
  height: 110px;
  box-shadow: 0px 7px 0px 0px #cdaa00;
  border-radius: 12px;
}

.dcard-contents .btn-cmn-yellow:hover:not(:disabled) .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px #cdaa00;
}

.dcard-contents .btn-cmn:hover:not(:disabled) .btn-cmn-in {
  margin-top: 5px;
  margin-bottom: -1px;
}

.dcard-contents .btn-cmn-txt {
  font-size: 36px;
  line-height: 110px;
}

.dcard-contents-wrapper {
  padding: 40px 0 125px;
  background: #FAF8F0;
}

.dcard-appreciation {
  margin: 0 auto 16px;
  width: 800px;
}

.dcard-eyecatch {
  margin-bottom: 48px;
}

.dcard-benefits {
  margin: 0 auto 15px;
  width: 480px;
}

.dcard-notifications {
  margin: 57px auto 0;
  padding: 32px 17px;
  width: 885px;
  border-radius: 12px;
  background: #fff;
  border: 5px solid #FF5A5F;
  box-sizing: border-box;
}

.dcard-notifications p {
  padding-left: 56px;
  text-indent: -56px;
  font-size: 24px;
}

.dcard-notifications p + p{
  margin-top: 15px;
}

.dcard-notifications-icon {
  display: inline-block;
  margin-right: 16px;
  background: url(../img/dcard/icon_caution.png) no-repeat 0 0;
  width: 40px;
  height: 40px;
  background-size: 100%;
}

.dcard-txt-red {
  color: #FF5A5F;
  font-weight: bold;
}

/* ==========================================================
  dcard-description
========================================================== */
.dcard-description-contents {
  margin: 0 auto;
  padding: 40px 32px 0;
  max-width: 1024px;
  width: 100%;
  box-sizing: border-box;
  background: #fff;
}

.dcard-description-contents img {
  width: 100%;
}

.dcard-description-message {
  margin-bottom: 39px;
}

.dcard-description-message-top {
  margin: 0 auto 40px;
  width: 800px;
}

.dcard-description-message-middle {
  margin: 0 auto 45px;
  width: 600px;
}

.dcard-description-message-bottom {
  margin: 0 auto;
  width: 500px;
}

.dcard-description-contents .btn {
  text-align: center;
  cursor: pointer;
}

.dcard-description-contents .btn-cmn {
  width: 604px;
}

.dcard-description-contents .btn-cmn-in {
  padding: 0;
  height: 110px;
  box-shadow: 0px 7px 0px 0px #cdaa00;
  border-radius: 12px;
}

.dcard-description-contents .btn-cmn-yellow:hover:not(:disabled) .btn-cmn-in {
  box-shadow: 0px 2px 0px 0px #cdaa00;
}

.dcard-description-contents .btn-cmn:hover:not(:disabled) .btn-cmn-in {
  margin-top: 5px;
  margin-bottom: -1px;
}

.dcard-description-contents .btn-cmn-txt {
  font-size: 36px;
  line-height: 110px;
}

.dcard-description-contents-wrapper {
  margin-top: 57px;
  padding: 43px 32px 120px;
  background: #FAF8F0;
}

.dcard-description-howtouse {
  margin-bottom: 50px;
  border: 5px solid #44BAC7;
  border-radius: 12px;
  background: #44BAC7;
}

.dcard-description-howtouse-ttl {
  line-height: 120px;
  text-align: center;
  font-weight: bold;
  font-size: 42px;;
  color: #fff;
}
.dcard-description-howtouse-wrapp {
  padding: 48px 0 61px;
  border-radius: 0 0 12px 12px;
  background: #fff;
}

.dcard-description-section {
  text-align: center;
}

.dcard-description-section:first-of-type {
  margin: 0 auto 70px;
}

.dcard-description-section:nth-of-type(2) {
  margin-bottom: 32px;
}

.dcard-description-section-ttl {
  display: inline-block;
  margin-bottom: 32px;
  font-size: 32px;
  font-weight: bold;
  line-height: 40px;
  border-bottom: 6px solid #44BAC7;
}

.dcard-description-section-img {
  margin: 0 auto;
  width: 600px;
  border: 1px solid #C7C7C7;
}

.dcard-description-notifications {
  margin-bottom: 60px;
  border: 5px solid #44BAC7;
  border-radius: 12px;
  background: #44BAC7;
}

.dcard-description-notifications-ttl {
  line-height: 120px;
  text-align: center;
  font-weight: bold;
  font-size: 42px;;
  color: #fff;
}

.dcard-description-notifications-wrapp {
  padding: 40px 59px 57px;
  border-radius: 0 0 10px 10px;
  background: #fff;
}

.dcard-description-notifications-wrapp p {
  padding-left: 56px;
  text-indent: -56px;
  font-size: 28px;
}

.dcard-description-notifications-wrapp p + p {
  margin-top: 15px;
  margin-bottom: 36px;
}

.dcard-description-notifications-icon {
  display: inline-block;
  margin-right: 16px;
  width: 40px;
  height: 40px;
  background: url(../img/dcard/icon_caution.png) no-repeat 0 0;
  background-size: 100%;
}

.dcard-description-notifications .dcard-description-txt-red {
  font-weight: bold;
  color: #ff5a5f;
}

.dcard-description-benefits-ttl {
  margin-bottom: 33px;
}

.dcard-description-benefits-section {
  padding: 5px;
  background: #fff;
  border: 4px solid #e0ded5;
  border-radius: 20px;
}

.dcard-description-benefits-section + .dcard-description-benefits-section {
  margin-top: 25px;
}

.dcard-description-benefits-section-ttl {
  padding: 27px 40px;
  height: 200px;
  border-bottom: 4px solid #e0ded5;  
}

.dcard-description-benefits-section-content {
  padding: 35px 35px 20px;
}

.dcard-description-benefits-section-txt {
  margin-bottom: 20px;
  font-size: 40px;
}

.dcard-description-benefits-section-txt-annotation {
  color: #777;
  font-size: 16px;
  text-indent: -1.25em;
  margin-left: 1.25em;
  margin-top: 20px;
  margin-bottom: 20px;
}

.dcard-description-benefits-section-img {
  margin-bottom: 30px;
}

.dcard-description-benefits-section:last-of-type .dcard-description-benefits-section-img {
  margin-top: 40px;
  padding: 0 35px;
}

.dcard-description-to-detail {
  font-size: 28px;
  text-align: right;
}

.dcard-description-to-detail a {
  text-decoration: underline;
}

/* ==========================================================
  friend-share
========================================================== */

.friend-share-text {
  color: #44BAC7;
  font-size: 30px;
  margin-bottom: 16px;
  font-weight: bold
}

.friend-share-text-link {
  font-weight: bold;
  text-decoration: underline;
}

.friend-share-area {
  position: relative;
  margin: 12px auto 0;
  width: 569px;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}
.friend-share-btn {
  height: 44px;
  padding: 6px 12px 6px 8px;
  border-radius: 8px;
  color: #fff;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
}

.friend-share-btn-text {
  padding-top: 5px;
  margin: 0 auto;
}

.friend-share-btn-line {
  width: 179px;
  background-color: #4CC764;
}

.friend-share-btn-x {
  width: 179px;
  background-color: #000;
}

.friend-share-btn-link {
  width: 179px;
  background-color: #FF5A5F;
}

.ico-sns-area {
  width: 32px;
  height: 32px;
}

.friend-share-btn-line-ico {
  background: url(../img/common/line_logo.png) no-repeat;
  background-size: 100%;
}

.friend-share-btn-x-ico {
  background: url(../img/common/x_logo_white.png) no-repeat;
  background-size: 100%;
}

.friend-share-btn-btn-link-ico {
  background: url(../img/common/icon_link.png) no-repeat;
  background-size: 100%;
}

.friend-share {
  margin-top: 30px;
 }

 .friend-login-modal-btn {
  width: 280px;
 }

/* ==========================================================
  work-search
========================================================== */
#work-search {
  letter-spacing: -1em;
}

.usr-srch-area {
  position: relative;
}

#work-search .form-cmn-select-strong {
  margin-right: 15px;
}

#work-search .txt-search-freeword-place-holder {
  left: 290px;
}

.usr-srch-warning-area {
  margin-top: 20px;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

/* ==========================================================
  disp-utprice
========================================================== */
.utprice-table {
  margin-bottom: 15px;
}

.utprice-table-stripe {
  margin-top: 0px;
  border-bottom: none;
  width:520px;
}

.table-cmn-stripe-head .utprice-table-stripe-ttl {
  padding: 12px 0;
}

.table-cmn-stripe-cell.utprice-table-stripe-detail{
  padding: 0;
  height: 70px;
  position: relative;
}

.utprice-table-stripe-detail-in {
  border-right: 1px solid #474747;
  height: 20px;
}

.table-cmn-stripe-cell:last-child .utprice-table-stripe-detail-in {
  border-right: none;
}

.utprice-list-form {
  width: 130px;
}

.disp-utprice-flex {
  display: flex;
}

.mod-cmn-calc-input-title.is-cpa-active {
  width: 90px;
}

.utprice-table-w-32 {
  width: 32%;
}

.utprice-table-w-36 {
  width: 36%;
}

.utprice-table-w-50 {
  width: 50%;
}

.utprice-table-w-64 {
  width: 64%;
}

.utprice-table-stripe-detail-input {
  position: absolute;
  top: 2px;
  left: 2px;
  height: 98% !important;
  width: 98%;
  border: none !important;
  border-radius:0px !important;
  text-align: center;
}

/* ==========================================================
  tile-label
========================================================== */
.tile-label_15_yellow {
  background: url(../img/common/label_1.5_yellow.png) no-repeat 0 0;
  height: 38px;
  width: 38px;
  position: absolute;
  z-index: 1;
  background-size: 100%;
  pointer-events: none;
}

.tile-label_15_red {
  background: url(../img/common/label_1.5_red.png) no-repeat 0 0;
  height: 38px;
  width: 38px;
  position: absolute;
  z-index: 1;
  background-size: 100%;
  pointer-events: none;
}

.tile-label_2_yellow {
  background: url(../img/common/label_2_yellow.png) no-repeat 0 0;
  height: 38px;
  width: 38px;
  position: absolute;
  z-index: 1;
  background-size: 100%;
  pointer-events: none;
}

.tile-label_2_red {
  background: url(../img/common/label_2_red.png) no-repeat 0 0;
  height: 38px;
  width: 38px;
  position: absolute;
  z-index: 1;
  background-size: 100%;
  pointer-events: none;
}

a:hover .tile-label_15_yellow
,a:hover .tile-label_15_red
,a:hover .tile-label_2_yellow
,a:hover .tile-label_2_red {
  opacity: 0.6;
}

/* ==========================================================
  apurihiroba
========================================================== */
.apurihiroba-contents-main {
  width: 800px;
  padding: 0px 55px 0px;
  background-color: #fff;
}

.apurihiroba-icon-area {
  background-color: #fff;
}

.apurihiroba-icons {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  align-items: flex-end;
}

.apurihiroba-icon {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-flow: column;
  align-items:center;
  width: 33.3%;
  padding: 2%;
}

.apurihiroba-icon-2 {
  width: 50%;
}

.apurihiroba-icon-img {
  width: 200px;
  margin: 0 auto;
}