@charset "UTF-8";
 http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)




html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}



@media only screen and (max-width: 568px) {
br.pc{ content: none;}
}

.h-title:before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -40%;
    display: inline-block;
    width: 15%;
    height: 9%;
    transform: translate(-50%);
    background-color: #0068b7;
}


.pc{}
.sp{display: none;}

.text-l {text-align: left;}
.text-r {text-align: right;}
.text-c {text-align: center;}
@media only screen and (max-width: 568px) {
.pc{display: none;}
.sp{display: block;}
}

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

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

#area01{padding-top: 20px;
}

#area05{padding:0 0 30px;
}
/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/* -----  setting & detail  ----- */
html {
  font-size: 62.5%;
}

body {
  background-size: cover;
  color: #fff;
  text-align: center;
  font-size: 1.8rem;
  font-family: "YuGothic", "游ゴシック", "HiraKakuPro", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Roboto, Osaka, sans-serif;
  font-weight: 500;
}

h1 {
  display: none;
}

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

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

.hiddenheader {
  display: none;
}


span.br {
   display: inline-block;
}

/* -----  float_button  ----- */
.floatbtnarea {
  position: fixed;
  bottom: 0;
  padding: 0;
  visibility: visible;
  right: 0;
  /*right: calc((100% - 1280px)/2);*/
  margin: 0 auto;
  line-height: 5rem;
  text-decoration: none;
  z-index: 10;
}

@media screen and (max-width: 1280px) {
  .floatbtnarea {
    right: 0;
  }
}

.floatButtons {
  width: 100%;
  margin: 0 auto;
  text-align: right;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .floatButtons {
    max-width: inherit;
  }
}

.floatButtons__free {
  opacity: 1;
  visibility: visible;
}

.floatButtons__freeimg {
  width: 270px;
  margin-right: 16px;
}

@media only screen and (max-width: 568px) {
  .floatButtons__freeimg {
    display: none;
  }
}

.floatButtons__freeimgSp {
  display: none;
  max-width: 275px;
  margin-right: 16px;
}

@media only screen and (max-width: 568px) {
  .floatButtons__freeimgSp {
    display: inherit;
  }
}

@media screen and (max-width: 371px) {
  .floatButtons__freeimgSp {
    margin-right: 3px;
    max-width: 240px;
  }
}

@media only screen and (max-width: 320px) {
  .floatButtons__freeimgSp {
    margin-right: 3px;
    max-width: 240px;
  }
}

.floatButtons__topimg {
  width: 80px;
  margin-right: 22px;
}

@media only screen and (max-width: 568px) {
  .floatButtons__topimg {
    width: 65px;
    margin-right: 12px;
  }
}

@media only screen and (max-width: 320px) {
  .floatButtons__topimg {
    margin-right: 10px;
    width: 55px;
  }
}

.button-fadeout {
  opacity: 0;
  visibility: hidden;
}

/* -----  heading_title_default  ----- */
.preload * {
  -webkit-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

.dottedLine {

  font-size: 2.8rem;
  font-weight: bold;
}

@media only screen and (max-width: 568px) {
  .dottedLine {
    font-size: 2.0rem;
  }
}

.dottedLine > span {
  padding: 0 20px;
}

.dottedLine::before, .dottedLine::after {
  /*background-image: url("../images/mori_dot_line.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_dot_line.png");
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  height: 4px;
}

@media all and (-ms-high-contrast: none) {
  .dottedLine::before, .dottedLine::after {
    -webkit-box-flex: 1 auto;
        -ms-flex-positive: 1 auto;
            flex-grow: 1 auto;
    display: block;
  }
}

@media only screen and (max-width: 568px) {
  .dottedLine::before, .dottedLine::after {
    /*background-image: url("../images/mori_dot_line_sp_pattern2.png");*/
    background-image: url("/wp-content/uploads/2018/06/mori_dot_line_sp_pattern2.png");
    background-repeat: repeat-x;
  }
}

.dottedLine::before {
  margin-right: 1rem;
  background-position: right;
}

@media only screen and (max-width: 568px) {
  .dottedLine::before {
    margin-left: 20px;
  }
}

@media only screen and (max-width: 320px) {
  .dottedLine::before {
    margin-left: 5px;
  }
}

.dottedLine::after {
  margin-left: 1rem;
  background-position: left;
}

@media only screen and (max-width: 568px) {
  .dottedLine::after {
    margin-right: 20px;
  }
}

@media only screen and (max-width: 320px) {
  .dottedLine::after {
    margin-right: 5px;
  }
}

.underLine {
  position: relative;
  display: inline-block;
  margin: 0 auto 40px;
  padding-bottom: 20px;
  letter-spacing: 2px;
  font-size: 3.6rem;
  font-weight: bold;
  letter-spacing: 0.01em;
  color: #000;
}

.underLine::after{
   background: #009688;
    content: "";
    position: absolute;
    height: 4px;
    bottom: -5px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100px;
}

@media only screen and (max-width: 568px) {
  .underLine {
    margin: -5px 0 25px;
    font-size: 2rem;
    line-height: 1.5;}

.underLine::after{
    height: 3px;
    bottom: 5px;
    width: 80%;
}
  }
}




/*--.underLine::after {
  content: " ";
  border-bottom: 4px solid #009688;
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(51% - 0px);
}

.underLine::before {
  content: " ";
  border-bottom: 4px solid #009688;
  position: absolute;
  left: 0;
  bottom: 0;
  width: calc(50% - 0px);
}--*/
.underLine__topcontent{
  font-size: 2.3rem;
  font-weight: bold;
  letter-spacing: 0.01em;
  color: #4679bd;
  margin-bottom: 25px;
  text-align: center;
  padding-top:50px;
}
.underLine__topcontent::before{
  /*content: url("../images/before.png");*/
  content: url("/wp-content/uploads/2020/07/mori_head_bkslash.png");
  margin-right:5px;
  height:1.0rem;
}
.underLine__topcontent::after{
  /*content: url("../images/after.png");*/
  content:url("/wp-content/uploads/2020/07/mori_head_slash.png");
  margin-left:5px;
  width:20%;
}


.underLine__topimg {
  margin-top: 100px;
  margin-bottom: 15px;
  width: 100%;
  text-align: center;
}

.underLine__topimg > img {
  width: 67px;
}

.underLine span::before {
  top: 96%;
  left: calc(50% - 7px);
  /*background-image: url("../images/mori_balloon_triangle.png");*/
/*  background-image: url("/wp-content/uploads/2018/06/mori_balloon_triangle.png");*/
  content: " ";
  background-repeat: no-repeat;
  background-size: contain;
  width: calc(33px / 2);
  height: calc(29px / 2);
  position: absolute;
  pointer-events: none;
}

.jsFrameIn {
  opacity: 0;
  -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
          transform: translateY(20px);
  -webkit-transition: opacity .5s, -webkit-transform .5s;
  transition: opacity .5s, -webkit-transform .5s;
  -o-transition: opacity .5s, transform .5s;
  transition: opacity .5s, transform .5s;
  transition: opacity .5s, transform .5s, -webkit-transform .5s;
}

.jsFrameIn.jsActive {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

.hover-Anim {
  -webkit-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition: 0.3s ease 0s;
  -o-transition: 0.3s ease 0s;
  transition: 0.3s ease 0s;
}

@media only screen and (min-width: 569px) {
  .hover-Anim:hover {
    opacity: .8;
  }
}

/* -----  modal  ----- */
.modal {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  max-width: 1020px;
  width: 100%;
  margin: 0 auto;
  background: #fff;
  border-radius: 10px;
  z-index: 1000;
  display: none;
  position: fixed;
}

@media only screen and (max-width: 568px) {
  .modal {
    position: fixed;
    width: 90%;
    height: auto;
    padding-bottom: 20px;
  }
}

@media screen and (max-width: 1040px) {
  .modal {
    width: 90%;
  }
}

.modal__title {
  max-width: 1020px;
  width: 100%;
  background-color: #4679bd;
  border-radius: 10px 10px 0 0;
  padding: 20px 0;
  z-index: 1010;
  position: relative;
}

@media only screen and (max-width: 568px) {
  .modal__title {
    width: 100%;
  }
}

.modal__title--icon {
  position: absolute;
  top: 8px;
  left: 10px;
  border-radius: 5px;
  background-color: #fff;
  padding: 4px;
}

@media only screen and (max-width: 320px) {
  .modal__title--icon {
    top: 10px;
    left: 10px;
  }
}

.modal__title--icon > img {
  height: 43px;
  width: auto;
}

@media only screen and (max-width: 568px) {
  .modal__title--icon > img {
    height: 38px;
  }
}

@media only screen and (max-width: 320px) {
  .modal__title--icon > img {
    height: 28px;
  }
}

.modal__title--body {
  top: 0;
  color: #fff;
  font-size: 3rem;
}

@media only screen and (max-width: 568px) {
  .modal__title--body {
    font-size: 2.2rem;
  }
}

.modal__title--close {
  position: absolute;
  top: 50%;
  right: 15px;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
}

@media only screen and (max-width: 568px) {
  .modal__title--close {
    right: 18px;
    top: 32px;
  }
}

.modal__title--closeButton {
  color: #00f;
  text-decoration: underline;
  cursor: pointer;
}

.modal__title--closeButton > img {
  width: 36px;
  height: auto;
}

@media only screen and (max-width: 568px) {
  .modal__title--closeButton > img {
    width: 20px;
  }
}

.modal__box {
  height: 100%;
}

@media screen and (max-height: 750px) {
  .modal__box {
    height: 100%;
  }
}

.modal__box--body {
  width: 100%;
}

.modal__box--body > p {
  padding: 0 50px 50px;
  text-align: justify;
  text-justify: inter-ideograph;
  color: #333;
  font-size: 1.6rem;
  line-height: 2;
}

@media screen and (max-height: 750px) {
  .modal__box--body > p {
    font-size: 1.4rem;
    padding: 5px 15px;
  }
}

@media only screen and (max-width: 568px) {
  .modal__box--body > p {
    padding: 20px;
  }
}

.modal__box--mov {
  width: 100%;
  padding: 50px 50px 20px 50px;
  margin: 0 auto;
}

@media screen and (max-height: 750px) {
  .modal__box--mov {
    padding: 5px;
    width: calc((65vh * 1.778) - 100px);
  }
}

@media screen and (max-height: 400px) {
  .modal__box--mov {
    padding: 5px;
    height: 90%;
  }
}

@media only screen and (max-width: 568px) {
  .modal__box--mov {
    width: 100%;
    padding: 10px;
  }
}

.modal__box--mov > .modalMov {
  padding-top: 56.25%;
  position: relative;
  width: 100%;
}

@media screen and (max-height: 750px) {
  .modal__box--mov > .modalMov {
    padding-top: inherit;
  }
}

@media only screen and (max-width: 568px) {
  .modal__box--mov > .modalMov {
    width: 100%;
    height: auto;
  }
}

@media screen and (max-height: 750px) {
  .modal__box--mov > .modalMov:before {
    content: "";
    display: block;
    padding-top: 56.25%;
  }
}

.modal__box--mov > .modalMov iframe {
  height: 100%;






  left: 0;
  position: absolute;
  top: 0;

  width: 100%;
}

.modal__box--spCloseBtn {
  display: none;
}

@media only screen and (max-width: 568px) {
  .modal__box--spCloseBtn {
    cursor: pointer;
    display: block;
    width: 135px;
    height: 35px;
    margin: 20px auto;
    padding-top: 7px;
    border-radius: 64px;
    border: solid #4679bd 2px;
    color: #4679bd;
  }
}

.modalOverlay {
  background-color: rgba(0, 0, 0, 0.75);
  bottom: 0;
  cursor: pointer;
  left: 0;
  opacity: 0;
  position: fixed;
  right: 0;
  top: 0;
  -webkit-transition: .6s all;
  -o-transition: .6s all;
  transition: .6s all;
  visibility: hidden;
  z-index: 101;
}

.modalOverlay.jsActive {
  opacity: 1;
  visibility: visible;
}

.spOnry {
  display: none;
}

@media only screen and (max-width: 568px) {
  .spOnry {
    display: block;
  }
}

/* -----  spmenu  ----- */
.globalMenuSp {
  visibility: hidden;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  background: #fff;
  color: #000;
  text-align: center;
  -webkit-transform: translateY(-120%);
      -ms-transform: translateY(-120%);
          transform: translateY(-120%);
  -webkit-transition: all 0.9s;
  -o-transition: all 0.9s;
  transition: all 0.9s;
  width: 100%;
}

.globalMenuSp ul {
  background: #fff;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

.globalMenuSp ul li {
  font-size: 1.1em;
  list-style-type: none;
  padding: 0;
  width: 95%;
  margin: 0 auto;
  border-top: 1px solid #efefef;
  text-align: left;
  position: relative;
}

.globalMenuSp ul li:after {
  content: "";
  position: absolute;
  top: 15px;
  right: 15px;
  width: 9px;
  height: 9px;
  border-top: 2px solid #009688;
  border-right: 2px solid #009688;
  -webkit-transform: translateY(50%) rotate(45deg);
  -ms-transform: translateY(50%) rotate(45deg);
  transform: translateY(50%) rotate(45deg);
}

.globalMenuSp ul li:last-child {
  padding-bottom: 0;
  border-bottom: none;
  border-bottom: 1px solid #efefef;
  text-align: left;
}

.globalMenuSp ul li a {
  display: block;
  color: #000;
  padding: 19px 0 18px 30px;
  text-decoration: none;
}

.globalMenuSp__logo {
  width: 100%;
  padding: 10px;
  text-align: center;
}

.globalMenuSp__logo--img {
  width: 130px;
}

.globalMenuSp.active {
  visibility: visible;
  -webkit-transform: translateY(0%);
      -ms-transform: translateY(0%);
          transform: translateY(0%);
}

.globalMenuSp__button {
  display: block;
  margin: 20px auto;
  max-width: 355px;
  text-align: center;
  width: 90%;
  font-size: 2.2rem;
  font-weight: bold;
  padding-top: 19px;
  background-color: #ff9900;
  height: 58px;
  color: #fff;
  border-radius: 29px;
  text-decoration: none;
}

.globalMenuSp__buttonAnchor {
  text-decoration: none;
}

.spMenuButton {
  display: block;
  position: absolute;
  right: 3px;
  top: 1px;
  width: 40px;
  height: 51px;
  z-index: 1003;
  text-align: center;
}

@media only screen and (min-width: 569px) {
  .spMenuButton {
    display: none;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .spMenuButton {
    display: block;
  }
}

.spMenuButton:hover {
  cursor: pointer;
}

.spMenuButton.active {
  position: fixed;
}

.spMenuButton span {
  display: block;
  position: absolute;
  width: 28px;
  border-bottom: solid 2px #009688;
  -webkit-transition: .35s ease-in-out;
  -o-transition: .35s ease-in-out;
  transition: .35s ease-in-out;
  left: 6px;
}

.spMenuButton span:nth-child(1) {
  top: 9px;
}

.spMenuButton span:nth-child(2) {
  top: 18px;
}

.spMenuButton span:nth-child(3) {
  top: 27px;
}

.spMenuButton span:nth-child(4) {
  border: none;
  color: #4679bd;
  font-size: 5px;
  top: 34px;
}

.spMenuButton.active span:nth-child(1) {
  top: 18px;
  left: 6px;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.spMenuButton.active span:nth-child(2),
.spMenuButton.active span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

.spMenuButton .menuOpen {
  width: 26px;
}

.spMenuButton .menuClose {
  display: none;
  width: 20px;
}

/* -----  header  ----- */
.header {
  width: 100%;
  background-color: #fff;
  position: relative;
  z-index: 1;
  /*background-image: url("../images/mori_bg_checkered.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_checkered.jpg");
  background-repeat: repeat;
}

.headerInfomationArea {
  background-color: #ffffff;
  width: 100%;
}

.headerInfomation {
  background-color: #ffffff;
  /* max-width: 1240px; */
  margin: -20px auto 0;
  position: relative;
  height: 90px;
  border-bottom:  5px #ddd solid;
}
 
@media only screen and (max-width: 981px) {
  .headerInfomation {
    height: 80px;
     margin: 50px auto 0;
  }
}

@media only screen and (max-width: 782px) {
  .headerInfomation {
      height: 80px;
      margin: 0px auto 0;
  }
}

@media only screen and (max-width: 568px) {
  .headerInfomation {
    height: 50px;
  }
}
.headerInfomation__logoimg {
  width: 400px;
  top: 15px;
  left: 20px;
  position: absolute;
  /* border-bottom: 5px #ddd solid; */
}

@media only screen and (max-width: 568px) {
  .headerInfomation__logoimg {
    top: 5px;
    left: 7px;
    width: 250px;
  }
}

.headerInfomation__menu {
  display: none;
}

@media only screen and (min-width: 569px) {
  .headerInfomation__menu {
    display: block;
    /* width: 600px; */
    margin: 0 20px 0 226px;
    /* background-color: #fff; */
    position: relative;
    text-align: right;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .headerInfomation__menu {
    display: none;
    list-style: none;
  }
}

.headerInfomation__menu--item {
  list-style: none;
  padding-top: 17px;
}

.headerInfomation__menu--item > li {
  font-size: 1.8rem;
  margin: 0 8px;
  font-weight: bold;
  text-align: center;
  display: inline-block;
}

.headerInfomation__menu--item > li > a {
  text-decoration: none;
  color: #333;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  height: 55px;
  padding: 5px 5px 5px 5px;
  -webkit-transition: none;
  -o-transition: none;
  transition: none;
}

.headerInfomation__menu--item > li > a:before {
  visibility: hidden;
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  border-bottom: 3px solid #009688;
  -webkit-transform: scaleX(0);
  -ms-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s;
}

.headerInfomation__menu--item > li > a:hover:before, .headerInfomation__menu--item > li > a.is-active:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
          transform: scaleX(1);
}

.headerInfomation__menu--item > li > a:hover {
  text-decoration: none;
}

.headerInfomation__menu--item > li > a.is-active {
  pointer-events: none;
}

.headerInfomation__contactimgs {
  display: none;
}

@media screen and (min-width: 1181px) {
  .headerInfomation__contactimgs {
    display: block;
    right: 110px;
    position: absolute;
    top: 14px;
    width: 210px;
  }
}

@media only screen and (max-width: 568px) {
  .headerInfomation__contactimgs {
    display: block;
    right: 50px;
    position: absolute;
    top: 7px;
    width: 120px;
  }
}

.headerInfomation__contactimgs > img {
  position: absolute;
  width: 210px;
}

.headerInfomation__contactimgs:hover{
  opacity: 0.6;
  filter: alpha(opacity=60);
  -moz-opacity:0.6;
}


.headerInfomation__tmcimgs {
  display: none;
}



@media screen and (min-width: 981px) {
  .headerInfomation__tmcimgs {
    display: block;
    right: 4px;
    position: absolute;
    top: 21px;
    width: 75px;
  }
}

@media screen and (min-width: 1180px) {
  .headerInfomation__tmcimgs {
    display: block;
    right: 4px;
    position: absolute;
    top: 21px;
    width: 75px;
  }
}

/* -----  main visual  ----- */
.Mainvisual {
  /*background-image: url("../images/mori_keyvisual_mainbg_pc.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_keyvisual_mainbg_pc.png");
  background-position: 0 -90px;
  background-repeat: no-repeat;
  background-size: 100%;
  max-width: 1282px;
  height: 580px;
  width: 100%;
  margin: 0 auto;
  position: relative;
}

@media only screen and (max-width: 1280px) {
  .Mainvisual {
    background-size: cover;
    background-position: center -90px;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual {
    background-position: 0 -45px;
    /*background-image: url("../images/mori_keyvisual_mainbg_sp.png");*/
    background-image: url("/wp-content/uploads/2018/06/mori_keyvisual_mainbg_sp.png");
  }
}

.Mainvisual__maintext {
  position: absolute;
}

.Mainvisual__maintext > img {
  max-width: 90%;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext > img {
    max-width: 390px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .Mainvisual__maintext {
    display: block;
    right: 50px;
  }
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext {
    text-align: right;
    top: 230px;
    right: 91px;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual__maintext {
    display: none;
  }
}

.Mainvisual__maintext--copy2 {
  font-size: 2.3rem;
  position: absolute;
  letter-spacing: 0.02em;
  line-height: 1.3em;
  color: #4679bd;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext--copy2 {
    text-align: right;
    top: 389px;
    right: 104px;
  }
}

.Mainvisual__deviceimg {
  position: absolute;
  bottom: 0;
  left: 94px;
  width: 33.4765625%;
}

@media only screen and (max-width: 568px) {
  .Mainvisual__deviceimg {
    display: none;
  }
}

.Mainvisual__deviceimg > img {
  width: 100%;
}

.Mainvisual__overawardimg {
  position: absolute;
  bottom: 20px;
  left: 0;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__overawardimg {
    bottom: 37px;
    left: 100px;
  }
}

.Mainvisual__overawardimg img {
  width: 80%;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__overawardimg img {
    max-width: 450px;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual__maintext_sp {
    display: block;
    padding-top: 170px;
    margin: 0px auto;
  }
}

.Mainvisual__maintext_sp > img {
  max-width: 90%;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext_sp {
    display: none;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual__maintext_sp {
    width: 300px;
  }
}

.Mainvisual__deviceimg_sp {
  display: block;
  margin: 10px auto;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__deviceimg_sp {
    display: none;
  }
}

.Mainvisual__deviceimg_sp > img {
  width: 280px;
  margin-right: 20px;
}
/* ----- グループウェアとは ----- */
.about{
  padding:100px 0 70px;
  /*background-image: url("../images/mori_bg_box.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_stripe.jpg");
}
.aboutArea{
  color: #333;
  max-width: 1080px;
  width: 100%;
  margin: 0 auto;
}
.aboutcontent{
  width: 75%;
  margin: 50px auto;
  font-size:1.7rem;
  text-align: left;
  line-height: 1.6;
}

/* ----- こんなお悩みありませんか ----- */
.understand {
  width: 100%;
  margin: 0 auto;
  /*background-image: url("../images/mori_bg_checkered.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_checkered.jpg");
  background-repeat: repeat;
  padding: 140px 0px;
}

@media only screen and (max-width: 568px) {
  .understand {
    padding-bottom: 30px;
  }
}

.understand .dottedLine {
  margin: 40px auto 56px;
}

@media only screen and (max-width: 568px) {
  .understand .dottedLine {
    width: 100%;
  }
}

.understand .hiddenheader {
  display: none;
}

.understand .underLine {
  margin-bottom: 72px;
  padding-bottom: 18px;
  letter-spacing: 0.07em;
}

@media only screen and (max-width: 568px) {
  .understand .underLine {
    margin-bottom: 50px;
  }
}

@media only screen and (max-width: 568px) {
  .understand .underLine__topimg {
    margin-top: 30px;
  }
}
/* -----  特徴　こんなことでお悩みではありませんか  ----- */
.troubleList {
  max-width: 872px;
  width: 100%;
  margin: -20px auto 0;
}

@media screen and (max-width: 850px) {
  .troubleList {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 568px) {
  .troubleList {
    padding: 0 0px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .troubleList {
    padding: 0 20px;
  }
}

.troubleList__body {
  font-size: 2.4rem;
  color: #000;
  text-align: left;
  padding-left: 30px;
  line-height: 30px;
  /*background: url("../images/mori_chk.png");*/
  background: url("/wp-content/uploads/2018/06/mori_chk.png");
  background-repeat: no-repeat;
  background-size: 30px;
  padding: 0 0 30px;
  font-weight: bold;
}

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

.troubleList__body > p {
  padding: 0 0 0 2em;
  background-position: left top;
  text-indent: 0em;
}

@media only screen and (max-width: 568px) {
  .troubleList__body > p {
    font-size: 1.8rem;
    margin: 20px -0;
  }
}

.resolution {
  /*background: url("../images/mori_ic_arrow_1.png");*/
  background: url("/wp-content/uploads/2018/06/mori_ic_arrow_1.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 50px;
  padding-top: 113px;
  font-weight: bold;
  margin: 40px auto 20px;
  color: #4679bd;
}

@media only screen and (max-width: 568px) {
  .resolution {
    padding-top: 55px;
    background-size: 23px;
  }
}

.resolution__body {
  font-size: 39px;
  padding: 0px;
  letter-spacing: 0.1rem;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(80%, transparent), color-stop(80%, #fceb5c));
  background: -webkit-linear-gradient(transparent 80%, #fceb5c 80%);
  background: -o-linear-gradient(transparent 80%, #fceb5c 80%);
  background: linear-gradient(transparent 80%, #fceb5c 80%);
}

@media only screen and (max-width: 568px) {
  .resolution__body {
    padding-bottom: 5px;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, transparent), color-stop(80%, #fceb5c));
    background: -webkit-linear-gradient(transparent 65%, #fceb5c 80%);
    background: -o-linear-gradient(transparent 65%, #fceb5c 80%);
    background: linear-gradient(transparent 65%, #fceb5c 80%);
    font-size: 2.5rem;
    letter-spacing: 0.3rem;
    font-weight: inherit;
    line-height: 1.4;
  }
}

/* -----  特徴  ----- */
.characteristic {
  width: 100%;
  margin: 0 auto;
  /*background-image: url("../images/mori_bg_checkered.jpg");*/
/*  background-image: url("/wp-content/uploads/2018/06/mori_bg_checkered.jpg");
  background-repeat: repeat;*/
  padding:50px 10px 40px;
}

@media only screen and (max-width: 568px) {
  .characteristic {
    padding-bottom: 30px;
  }
}

.characteristic .dottedLine {
  margin: 40px auto 56px;
}

@media only screen and (max-width: 568px) {
  .characteristic .dottedLine {
    width: 100%;
  }
}

.characteristic .hiddenheader {
  display: none;
}

.characteristic .underLine {
  margin-bottom: 30px;
  padding-bottom: 18px;
  letter-spacing: 0.07em;
}

@media only screen and (max-width: 568px) {
  .characteristic .underLine {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 568px) {
  .characteristic .underLine__topimg {
    margin-top: 30px;
  }
}

.characteristicThree {
  color: #333;
  display: block;
  max-width: 1140px;
  width: 100%;
  margin: 20px auto;
  table-layout: fixed;
  height: 100%;
}

@media only screen and (min-width: 569px) {
  .characteristicThree {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 0 0 0 0px;
  }
}

.characteristicThree__box {
  display: block;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box {
    width: 100%;
  }
}

@media only screen and (min-width: 569px) {
  .characteristicThree__box {
    margin: 0 30px;
  }
}

.characteristicThree__box--imageArea {
  display: block;
  max-width: 315px;
  height: 208px;
  width: 100%;
  padding: 1px 0 0 0;
  position: relative;
}

@media screen and (max-width: 1040px) {
  .characteristicThree__box--imageArea {
    height: 18vw;
  }
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--imageArea {
    max-width: inherit;
    width: 90%;
    margin: 20px;
    height: 55vw;
  }
}

.characteristicThree__box--imageArea_photo {
  position: absolute;
  top: 45px;
  left: 0px;
  width: 100%;
  height: auto;
  z-index: 1;
}

.characteristicThree__box--imageArea_icon {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 75px;
  z-index: 2;
}

.characteristicThree__box--image {
  display: block;
  max-width: 315px;
  width: 100%;
  padding: 0;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--image {
    max-width: inherit;
    width: 90%;
    margin: 20px;
  }
}

.characteristicThree__box--title {
  max-width: 315px;
  width: 100%;
  margin: 33px 0 20px;
  text-align: justify;
  text-justify: inter-ideograph;
  font-size: 2.4rem;
  font-weight: bold;
  padding: 0;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--title {
    font-size: 2rem;
    letter-spacing: 0.1em;
    margin: 40px 0 13px;
    max-width: inherit;
    text-align: center;
    width: 100%;
  }
}

.characteristicThree__box--title > h4 > span {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);
  line-height: 1.6;
}

.characteristicThree__box--text {
  max-width: 315px;
  width: 100%;
  text-align: justify;
  text-justify: inter-ideograph;
  font-size: 1.7rem;
  padding: 0;
  line-height: 1.9;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--text {
    max-width: inherit;
    width: 100%;
    margin: 10px 0px 35px;
    padding: 0 20px 0px 10px;
  }
}
/* ----- 概要 ----- */
.recommendedArea-top {
  color: #333;
  max-width: 1200px;
  width: 100%;
  margin: 5px auto 20px;
}

/*@media screen and (max-width: 1100px) {
 .recommendedArea-top {
    padding: 20px 0;
  }
}

@media only screen and (min-width: 569px) {
  .recommended-top {
    margin: 0 0 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended-top {
    margin: 0 30px 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
*/

  .recommended__img-top {
    width: 100%;
}

/*@media only screen and (min-width: 569px) {
  .recommended-top:nth-child(odd) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-flow: row-reverse;
           /* flex-flow: row-reverse;
  }
}

@media only screen and (min-width: 569px) {
  .recommended-top:nth-child(odd) .recommended__img-top {
    margin: 0;
    text-align: right;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended-top:nth-child(odd) .recommended__img-top {
     margin: 0 20px;
  }
}*/

  .recommended__img-top img {
   max-width: 1000px;
  }

@media only screen and (max-width: 1000px) {
  .recommended__img-top img {
    width: 95%;
  }
}


@media only screen and (min-width: 569px) {
  .recommended__box-top {
    margin: 30px 30px 10px;
   
  }
}

.recommended__title-top {
    text-align: center;
    text-justify: inter-ideograph;
    font-size: 2.5rem;
    font-weight: bold;
    /* letter-spacing: 0.1rem; */
    line-height: 1.2;
    margin-bottom: 30px;
    margin-top: 20px;}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__title-top {
      text-align: center; 
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 0px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__title-top {
    text-align: center;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 18px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

.recommended__title-top span {
/*  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);*/
  padding: 0;
}

@media only screen and (min-width: 569px) {
  .recommended__text-top {
    line-height: 1.5;
    text-align: center;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    letter-spacing: 0.1rem;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__text-top {
    line-height: 1.9;
     text-align: center;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    padding: 0 20px;
    margin-bottom: 15px;
  }
}
/* ----- 特徴 ----- */
.recommendedArea {
  color: #333;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

@media screen and (max-width: 1100px) {
  .recommendedArea {
    padding: 0 10px;
  }
}

@media only screen and (min-width: 569px) {
  .recommended {
    margin: 0 0 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended {
    margin: 0 30px 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 569px) {
  .recommended__img {
    width: 100%;
    margin: 0 0 0 0;
    text-align: left;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__img {
    width: 100%;
    margin: 0 20px;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__img {
    width: 100%;
  }
}

@media only screen and (min-width: 569px) {
  .recommended:nth-child(odd) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-flow: row-reverse;
           /* flex-flow: row-reverse;*/
  }
}

@media only screen and (min-width: 569px) {
  .recommended:nth-child(odd) .recommended__img {
    margin: 0;
    text-align: right;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended:nth-child(odd) .recommended__img {
     margin: 0 20px;
  }
}

@media only screen and (min-width: 569px) {
  .recommended__img img {
    /*max-width: 420px;*/
    width: 100%;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__img img {
    width: 100%;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__img img {
    width: 100%;
  }
}

@media only screen and (min-width: 569px) {
  .recommended__box {
    width: 50%;
    margin: 0 30px 10px;
  }
}

.recommended__title {
    text-align: justify;
    text-justify: inter-ideograph;
    font-size: 2.5rem;
    font-weight: bold;


    /* letter-spacing: 0.1rem; */
    line-height: 1.2;
    margin-bottom: 10px;
    margin-top: 20px;}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__title {
    text-align: justify;
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 0px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__title {
    text-align: center;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 18px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

.recommended__title span {
/*  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);*/
  padding: 0;
}

@media only screen and (min-width: 569px) {
  .recommended__text {
    line-height: 1.5;
    text-align: justify;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    letter-spacing: 0.1rem;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__text {
    line-height: 1.9;
    text-align: justify;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    padding: 0 20px;
    margin-bottom: 15px;
  }
}


/* -----  機能一覧  ----- */
.functionList {
  padding: 50px 0;
  color: #333;
  text-align: center;
  /*background-image: url("../images/mori_bg_box.jpg");*/
  background-color:#f1f1f185;
  background-repeat: repeat;
}

@media only screen and (max-width: 568px) {
  .functionList {
    padding: 80px 0 40px;
  }
}

.functionList__heading {
  padding: 80px 0 80px 0;
  text-align: center;
}

.functionList .dottedLine {
  margin: 0px auto 50px;
}

@media only screen and (max-width: 568px) {
  .functionList .dottedLine {
    width: 100%;
    margin: 0px auto 40px;
  }
}

.functionList-body {
  font-size: 1.9rem;
  font-weight: bold;
  letter-spacing: 0.06rem;
  color: #000;
  line-height: 1.5;
}

@media only screen and (max-width: 568px) {
  .functionList-body {
    font-size: 1.7rem;
    margin: 0 20px;
  }
}

.functionList__list {
  max-width: 1040px;
  margin: 0 auto;
  padding-top: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
}

@media screen and (max-width: 1040px) {
  .functionList__list {
    padding: 35px 20px 0;
  }
}

@media only screen and (max-width: 568px) {
  .functionList__list {
    padding: 35px 0 0 0;
  }
}

.functionList__list-box {
  border: solid transparent 3px;
  height: 180px;
  background-color: #fff;
  margin-top: 11px;
  margin-bottom: 24px;
  margin-left: 14px;
  margin-right: 14px;
  -ms-flex-item-align: auto;
      align-self: auto;
  border-radius: 90px;
  cursor: pointer;
  width: 180px;
  -webkit-transition: .5s all;
  -o-transition: .5s all;
  transition: .5s all;
}

@media screen and (max-width: 1040px) {
  .functionList__list-box {
    margin-left: calc((100% - 720px) / 8);
    margin-right: calc((100% - 720px) / 8);
  }
}

@media screen and (max-width: 800px) {
  .functionList__list-box {
    margin-left: calc((100% - 540px) / 6);
    margin-right: calc((100% - 540px) / 6);
  }
}

@media only screen and (max-width: 568px) {
  .functionList__list-box {
    width: 150px;
    height: 150px;
    border-radius: 100%;
    margin: calc((100% - 300px) / 4);
  }
}

@media only screen and (max-width: 320px) {
  .functionList__list-box {
    width: 130px;
    height: 130px;
    border-radius: 100%;
    margin: calc((100% - 260px) / 4);
  }
}

@media only screen and (min-width: 569px) {
  .functionList__list-box:hover {
    border: solid #4679bd 3px;
    color: #4679bd;
  }
}

.functionList__list-box-icon {
  height: 130px;
}

.functionList__list-box--iconimg {
  margin-top: 40px;
  margin-bottom: 10px;
  height: 80px;
}

@media only screen and (max-width: 568px) {
  .functionList__list-box--iconimg {
    margin-top: 15px;
  }
}

@media only screen and (max-width: 320px) {
  .functionList__list-box--iconimg {
    height: 60px;
    margin-top: 20px;
  }
}

.functionList__list-box--title {
  font-size: 1.6rem;
}

@media only screen and (max-width: 568px) {
  .functionList__list-box--title {
    margin-top: 5px;
    margin-bottom: 20px;
  }
}

.functionList__list-notice {
  max-width: 1040px;
  margin: 19px auto 90px;
  text-align: right;
  font-size: 1.7rem;
}

@media only screen and (max-width: 568px) {
  .functionList__list-notice {
    margin: 0px 20px 30px;
    text-align: left;
    line-height: 1.5;
  }
}

.functionList__list-nonedisplay {
  visibility: hidden;
  height: 0;
  margin: 0;
  padding: 0;
}

/* -----  機能一覧　　簡単に連携できるオプション  ----- */
.optionLists {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 1000px;
    margin: 0px auto 30px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #FFF;
    padding: 20px 0;
    border-radius: 15px;
}

@media only screen and (max-width: 1040px) {
  .optionLists {
    width: 95%;
  }
}




.optionLists__itme {
  text-align: center;
}



.optionLists__itme > img {
  max-width: 300px;
  width: 100%;
  padding: 10px;
}

.optionLists__itme > a > img {
  max-width: 300px;
  width: 100%;
  padding: 10px;
}

@media only screen and (max-width: 650px) {
.optionLists__itme > img {
  max-width: 200px;
  padding: 10px;
}

.optionLists__itme > a > img {
  max-width: 200px;
  padding: 10px;
}

  
  }
  
@media only screen and (max-width: 440px) {
.optionLists__itme > img {
  max-width: 300px;
  width: 100%;
  padding: 10px;
}

.optionLists__itme > a > img {
  max-width: 300px;
 width: 100%;
  padding: 10px;
}

}


.companylist {
  padding: 10px 0 5px;
  background-color: #fff;
  color: #333;
  text-align: center;
  border-top: solid 5px #ddd;
}

.companylist .dottedLine {
  margin: 0px auto 60px;
}

@media only screen and (max-width: 568px) {
  .companylist .dottedLine {
    width: 100%;
  }
}

.companylist__heading {
  padding: 80px 0;
  text-align: center;
}

/* -----  導入実績  ----- */
.companylists {
 /* max-width: 1040px; */
 margin: 0 0 0 -40px;
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 align-content: center;
 align-items: flex-start;
 justify-content: center;
 flex-direction: row;
}

.companylists ul {
  margin: 0 15px 5px;
}

.companylists__box {
  /* width: 480px; */
  /* height: 400px;*/
  margin: 0 15px 5px;
  font-weight: bold;
}

.companylists__box--icon {
  width: 500px;
  /*padding: 0 45px;*/
  /*height: 400px;*/
  display: table-cell;
  vertical-align: middle;
}

.companylists__box--icon > img {
  width: 500px;
  height: auto;
    
}
@media only screen and (max-width: 568px) {
    .companylists__box {
  width: 90%;
}

.companylists__box--icon {
  width: 100%;
}


  .companylists__box--icon > img {
      
      width: 100%; }
}
}
.companylists__box--userName {

}

.companylists__box--userName > img {
  
}

.companylists__box--nonedisplay {
  margin: 0 10px 0;
  padding: 0 0 0 0;
}

/* ----- 導入実績　お客様の声 ----- */
.voicelists {
  max-width: 900px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
  padding: 0 0 30px;
}

.voicelists__box{
  width: 100%;
  display: flex;
  margin: 30px 0px 30px;
  padding: 5% 0px 2.4% 0px;
  border-top: solid #aaa 1px;
}
.voicelists__box:first-child{
  border-top: none;
  margin: 0px 0px 30px;
  padding: 0px 0px 2.4% 0px;
}
@media only screen and (max-width: 568px) {
  .voicelists__box{
    display: block;
    margin: 0 auto;
  }
  .voicelists__box:first-child{
    margin: 0 auto;
  }
}
@media screen and (max-width: 778px) {
  .voicelists__box{
    display: block;
    margin: 0 auto;
  }
  .voicelists__box:first-child{
    margin: 0 auto;
  }
}

.voicelists__box--img {
  width: 350px;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--img{
    text-align: center;
    margin: 0 auto;
    width: 100%;
  }
}
@media screen and (max-width: 778px) {
  .voicelists__box--img{
    text-align: center;
    margin: 0 auto;
    width: 100%;
  }
}
.voicelists__box--img > a img{
  width: 90%;
  height: auto;
}

.voicelists__box--user{
  width:550px;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user{
    margin: 0 auto;
    width: 90%;
  }
}
@media screen and (max-width: 778px) {
  .voicelists__box--user{
    margin: 0 auto;
    width: 90%;
  }
}

.voicelists__box--user_userName{
  text-align: justify;
  font-size: 2.0rem;
  font-weight: bold;
  letter-spacing: 0.1rem;
  line-height: 2;
  margin-bottom: 5px;
}
.voicelists__box--user_userName:after{
  content:"　様";
}
.voicelists__box--user_userName span {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);
  padding: 0;
}
.voicelists__box--user_userName a{
  text-decoration: none;
  color:#000;

}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_userName {
    text-align: center;
    font-size: 1.7rem;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_userName {
    text-align: center;
    font-size: 1.7rem;
  }
}

.voicelists__box--user_title{
  text-align: justify;
  /*font-size: 2.4rem;*/
/*  font-weight: bold;*/
  letter-spacing: 0.1rem;
  line-height: 1;
  margin-bottom: 10px;color:#000;
}
.voicelists__box--user_title a{
  text-decoration: none;
color:#000;
}
.voicelists__box--user_title a:hover{
  opacity: 0.7;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_title {
    text-align: center;
    font-size: 2.0rem;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_title {
    text-align: center;
    font-size: 2.0rem;
  }
}

.voicelists__box--user_type{
  display:flex;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_type {
    text-align: center;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_type {
    text-align: center;
  }
}
.voicelists__box--user_type:before{
  position: absolute;
  margin: 5px 0;
  padding: 6px 3px;
  color:#4679bd;
  border:1px solid #4679bd;
  border-radius: 6px;
  content: "業種";
}
.voicelists__box--user_type > p {
  display: block;
  text-align: left;
  position: relative;
  margin: 5px;
  padding: 5px 0 0 40px;
  font-size: 1.7rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
}

.voicelists__box--user_id{
  display:flex;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_id {
    text-align: center;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_id {
    text-align: center;
  }
}
.voicelists__box--user_id:before{
  position: absolute;
  margin: 5px 0;
  padding: 6px 3px;
  color:#4679bd;
  border:1px solid #4679bd;
  border-radius: 6px;
  content: "導入規模";
}
.voicelists__box--user_id > p {
  display: block;
  text-align: left;
  position: relative;
  margin: 5px;
  padding: 5px 0 0 75px;
  font-size: 1.7rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
}


.voicelists__box--user_service{
  display:flex;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_service {
    text-align: center;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_service {
    text-align: center;
  }
}
.voicelists__box--user_service:before{
  position: absolute;
  margin: 5px 0;
  padding: 6px 3px;
  color:#4679bd;
  border:1px solid #4679bd;
  border-radius: 6px;
  content: "ご利用中のサービス";
}
.voicelists__box--user_service > p {
  display: block;
  text-align: left;
  position: relative;
  margin: 5px;
  padding: 5px 0 0 155px;
  font-size: 1.7rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
}


/* -----  ご利用ステップ  ----- */
.ordersteparea {
  /*background-image: url("../images/mori_bg_stripe.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_stripe.jpg");
  background-repeat: repeat;
  padding-top: 5px;
  color: #333;
}

.ordersteparea .dottedLine {
  margin: 0px auto 15px;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .dottedLine {
    width: 100%;
  }
}

@media screen and (max-width: 778px) {
  .ordersteparea .dottedLine::before, .ordersteparea .dottedLine::after {
    /*background-image: url("../images/mori_dot_line_sp_pattern2.png");*/
    background-image: url("/wp-content/uploads/2018/06/mori_dot_line_sp_pattern2.png");
    background-repeat: repeat-x;
  }
}

@media screen and (max-width: 778px) {
  .ordersteparea .dottedLine::before {
    margin-left: 20px;
  }
}

@media screen and (max-width: 778px) {
  .ordersteparea .dottedLine::after {
    margin-right: 20px;
  }
}

.ordersteparea .underLine__topimg {
  margin-top: 65px;
}

.ordersteparea .underLine__topimg > img {
  width: 158px;
}

.ordersteparea .orderstep {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding-top: 40px;
  padding-bottom: 30px;
  height: 300px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: inherit;
  margin: 0 auto;
}

@media only screen and (min-width: 569px) {
  .ordersteparea .orderstep {
    max-width: 1080px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 1024px) {
  .ordersteparea .orderstep {
    width: 90%;
  }
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep {
    padding-right: inherit;
    height: inherit;
    width: 100%;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep {
    padding-right: inherit;
    height: inherit;
    width: 100%;
  }
}

.ordersteparea .orderstep__step {
  width: 47%;
  position: relative;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step {
    width: 100%;
    position: inherit;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step {
    width: 100%;
    position: inherit;
  }
}

.ordersteparea .orderstep__step--arrow {
  max-width: 40px;
  margin-top: 90px;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--arrow {
    display: none;
    position: inherit;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--arrow {
    display: none;
    position: inherit;
  }
}

.ordersteparea .orderstep__step--title {
  position: absolute;
  top: 0;
  left: 0;
  font-family: Helvetica, sans-serif;
  font-weight: bold;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--title {
    width: 100%;
    position: inherit;
    margin: 0 auto;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--title {
    width: 100%;
    position: inherit;
    margin: 0 auto;
  }
}

.ordersteparea .orderstep__step--title_step1 {
  color: #34a02c;
  font-size: 2.2rem;
  width: 200px;
  height: 200px;
  background-color: #fff;
  -ms-flex-item-align: auto;
      align-self: auto;
  border-radius: 100px;
  border: solid #34a02c 5px;
  padding-top: 48px;
}

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


  .ordersteparea .orderstep__step--title_step1 {
    margin: 0 auto;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--title_step1 {
    margin: 0 auto;
  }
}

.ordersteparea .orderstep__step--title_step2 {
  font-size: 2.2rem;
  color: #ff9900;
  width: 200px;
  height: 200px;
  background-color: #fff;
  -ms-flex-item-align: auto;
      align-self: auto;
  border-radius: 100px;
  border: solid #ff9900 5px;
  padding-top: 48px;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--title_step2 {
    margin: 0 auto;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--title_step2 {
    margin: 0 auto;
  }
}

.ordersteparea .orderstep__step--title_string1 {
  font-size: 3.2rem;
}

.ordersteparea .orderstep__step--title_string2 {
  margin-top: 16px;
  font-size: 2.8rem;
  font-weight: 300;
}

.ordersteparea .orderstep__step--body {
  position: absolute;
  top: 30px;
  left: 240px;
  text-align: justify;
  text-justify: inter-ideograph;
  max-width: 270px;
  line-height: 1.9em;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--body {
    max-width: inherit;
    width: 100%;
    position: inherit;
    padding: 20px;
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--body {
    max-width: inherit;
    width: 600px;
    position: inherit;
    padding: 20px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}

.ordersteparea .orderstep__step--body > p {
  width: 100%;
}

.ordersteparea .orderstep__arrow {
  display: inline;
  vertical-align: middle;
}

/* -----  価格  ----- */
.pricesarea {
  padding-top: 75px;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  color: #333;
  padding: 100px 0 60px;
}

.pricesarea__trialText {
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.8rem;
  width: 100%;
  text-align: center;
  margin: 50px auto 20px;
  padding: 0 20px;
}

.pricesarea__trialbody {
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.8rem;
  width: 100%;
  text-align: center;
  margin: 50px auto 20px;
  padding: 0 20px;
}

@media only screen and (max-width: 568px) {
  .pricesarea__trialbody {
    padding: 0px;
  }
}

.pricesarea .dottedLine {
  margin: 0px auto 0px;
}

@media only screen and (max-width: 568px) {
  .pricesarea .dottedLine {
    width: 100%;
  }
}

.pricesarea .underLine {
  margin: 105px auto 20px;
}

@media only screen and (max-width: 568px) {
  .pricesarea .underLine {
    font-size: 2rem;
  }
}

.pricesareaWrapper {
  padding-top: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  width: 100%;
  margin: 0 auto;
  color: #333;
}

.pricesList {
  border-collapse: collapse;
  font-size: 1.4rem;
  max-width: 555px;
  width: 100%;
}

@media only screen and (max-width: 568px) {
  .pricesList {
    max-width: inherit;
    margin-left: inherit;
    width: 100%;
    margin: 10px 20px;
  }
}

@media screen and (max-width: 1100px) {
  .pricesList {
    max-width: 450px;
    width: 100%;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .pricesList {
    max-width: 550px;
    width: 100%;
    margin: 10px auto;
  }
}

.pricesList table {
  position: relative;
  max-width: 555px;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

@media screen and (max-width: 1100px) {
  .pricesList table {
    width: 100%;
  }
}

.pricesList table::before {
  content: '';
  border: 1px solid #4679bd;
  width: 100%;
  display: block;
  position: absolute;
  height: 100%;
}

.pricesList tr {
  height: 45px;
}

.pricesList th {
  text-align: center;
  background-color: #4679bd;
  border-left: 1px solid #e8e8e8;
  color: #fff;
  font-size: 1.6rem;
  vertical-align: middle;
}

@media only screen and (max-width: 568px) {
  .pricesList th {
    padding: 10px 0;
  }
}

.pricesList td {
  vertical-align: middle;
  border-bottom: 1px solid #e8e8e8;
  border-left: 1px solid #e8e8e8;
  font-size: 1.5rem;
}

@media only screen and (max-width: 568px) {
  .pricesList td {
    padding: 10px 0;
  }
}

.pricesList td:first-child {
  font-size: 1.6rem;
}

@media only screen and (max-width: 568px) {
  .pricesList td:first-child {
    width: 30%;
  }
}

.pricesClac {
  margin-left: 75px;
  color: #fff;
  /*background-image: url("../images/mori_clac_easy_bg.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_clac_easy_bg.png");
  background-size: 100%;
  background-repeat: no-repeat;
  background-color: #003366;
  max-width: 450px;
  width: 100%;
}

@media screen and (max-width: 1100px) {
  .pricesClac {
    margin-left: 0px;
  }
}

@media only screen and (max-width: 568px) {
  .pricesClac {
    max-width: inherit;
    width: 100%;
    margin: 20px 20px 20px 20px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .pricesClac {
    margin-top: 30px;
    margin-left: 0px;
    max-width: 550px;
  }
}

.pricesClac__itme {
  width: 100%;
}

.pricesClac__title {
  font-size: 2.4rem;
  width: 87%;
  margin: 20px auto 25px;
  border-bottom: 1px solid #fff;
  padding: 0 0 15px 0;
  text-align: center;
}

@media only screen and (max-width: 568px) {
  .pricesClac__title {
    margin: 20px auto 10px;
  }
}

.pricesClac__title {
  font-size: 2.4rem;
  text-align: center;
}

.pricesClac__body {
  font-size: 1.4rem;
}

@media only screen and (max-width: 568px) {
  .pricesClac__body {
    text-align: left;
    line-height: 2;
    margin: 0 20px;
  }
}

.pricesClac__table--box {
  background-color: #fff;
  width: 200px;
  height: 95px;
  position: relative;
  border-radius: 5px;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table--box {
    width: 100%;
  }
}

.pricesClac__table--box01 {
  color: #333;
  font-size: 1.2rem;
  position: absolute;
  top: 12px;
  left: 12px;
}

.pricesClac__table--box02 {
  color: #4679bd;
  position: absolute;
  bottom: 28px;
  right: 32px;
}

.pricesClac__table ul {
  margin: 23px 10px;
  display: table;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul {
    display: inherit;
  }
}

.pricesClac__table ul li {
  display: table-cell;
  text-align: center;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li {
    display: inline-block;
    width: 100%;
  }
}

.pricesClac__table ul li:nth-child(2) {
  width: 45%;
  text-align: left;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li:nth-child(2) {
    width: 80%;
  }
}

.pricesClac__table ul li:nth-child(2) input {
  background-color: #fff;
  width: 200px;
  height: 40px;
  border-radius: 5px;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li:nth-child(2) input {
    width: 100%;
  }
}

.pricesClac__table ul li:nth-child(3) {
  width: 10%;
  vertical-align: bottom;
}

.pricesClac__table ul li:nth-child(1) {
  width: 36%;
  vertical-align: middle;
  font-weight: bold;
  font-size: 1.8rem;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li:nth-child(1) {
    width: 90%;
    margin: 0 0 20px 0;
    text-align: left;
  }
}

.pricesClac__table ul:nth-child(1) {
  margin-bottom: 25px;
}

.pricesClac__table--ordermember {
  color: #333;
  padding-left: 15px;
  -moz-appearance: textfield;
}

.pricesClac__table--ordermember::-webkit-input-placeholder {
  color: #ccc;
}


.pricesClac__table--ordermember:-ms-input-placeholder {
  color: #ccc;
}

.pricesClac__table--ordermember::-ms-input-placeholder {
  color: #ccc;
}

.pricesClac__table--ordermember::placeholder {
  color: #ccc;

}

.pricesClac__table--ordermember::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.pricesClac__table--orderpriceNum {
  font-size: 3rem;
  font-weight: bold;
  font-family: Helvetica, Arial, sans-serif;
}

/* -----  動作環境  ----- */
.operatingArea {
  width: 100%;
  margin: 0 auto;
  color: #333;
  background-color: #f8f8f8;
  text-align: center;
  padding: 70px 0 0;
}

.operatingArea__body {
  font-size: 2rem;
  width: 100%;
  text-align: center;
  margin: 20px auto;
}

.operatingArea .dottedLine {
  margin: 0px auto 0px;
}

@media only screen and (max-width: 568px) {
  .operatingArea .dottedLine {
    width: 100%;
  }
}

.operatingList {
  border-collapse: collapse;
  font-size: 1.6rem;
  max-width: 880px;
  width: 90%;
  margin: 15px auto 0;
  padding-bottom: 40px;
}

@media only screen and (max-width: 568px) {
  .operatingList {
    width: 100%;
  }
}

.operatingList table {
  position: relative;
  max-width: 870px;
  width: 100%;
  margin: 0 auto;
  border-collapse: separate;
  border-spacing: 0;
}

@media only screen and (max-width: 568px) {
  .operatingList table {
    width: 94%;
    margin: 30px auto;
  }
}

.operatingList table::before {
  content: '';
  border-top: 1px solid #999999;
  border-bottom: 1px solid #999999;
  width: 100%;
  display: block;
  position: absolute;
  height: 100%;
}

.operatingList tr {
   height: 100px;
}

.operatingList th {
  text-align: center;
  vertical-align: middle;
        font-weight: bold;
   
}

.operatingList th:first-child {
  width: 28%;
}

@media only screen and (max-width: 568px) {
  .operatingList th:first-child {
    padding: 15px 0;
    width: 45%;
  }
     
}
  .operatingList td li{display: block; margin: 3px 0;}
}

 .operatingList td ul{/*text-align: left;*/}

.operatingList th:last-child {
  width: 72%;
}

@media only screen and (max-width: 568px) {
  .operatingList th:last-child {
    width: 55%;
  }
}

.operatingList td {
  line-height: 1.6;

  padding: 12px 30px;
  vertical-align: middle;
}

@media only screen and (max-width: 568px) {
  .operatingList td {
    padding: 5px;
  }
}

.operatingList td:first-child {
  vertical-align: middle;
}

.operatingList td:last-child {
  text-align: left;
}

/* -----  よくある質問  ----- */
.faq {
  width: 100%;
  background-color: #fff;
  color: #333;
  padding: 70px 0 90px;
}

@media only screen and (max-width: 568px) {
  .faq {
    padding: 70px 0 0px;
  }
}

.faq .dottedLine {
  margin: 0 auto 33px;
}

@media only screen and (max-width: 568px) {
  .faq .dottedLine {
    width: 100%;
  }
}

.faqList {
  color: #4664af;
  font-weight: bold;
  font-size: 2rem;
  width: 100%;
  max-width: 890px;
  margin: 0 auto;
  border-bottom: solid #aaa 1px;
}

@media screen and (max-width: 1100px) {
  .faqList {
    width: 100%;
  }
}

@media only screen and (max-width: 568px) {
  .faqList {
    width: 100%;
    padding: inherit;
    margin-bottom: 50px;
  }
}

.faqList__title:first-child {
  border-top: none;
}

.faqList__title {
  border-top: solid #aaa 1px;
  color: #333;
  cursor: pointer;
  margin-bottom: 20px;
  padding: 5% 20px 2.4% 113px;
  position: relative;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: left;
  line-height: 1.6;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .faqList__title {
    font-size: 2rem;
    padding: 5% 30px 2.4% 113px;
  }
}

@media only screen and (max-width: 568px) {
  .faqList__title {
    font-size: 2rem;
    padding: 20px 40px 20px 74px;
  }
}

.faqList__title::before {
  /*background: url("../images/mori_faq_question_icon.png") center no-repeat;*/
  background: url("/wp-content/uploads/2018/06/mori_faq_question_icon.png") center no-repeat;
  background-size: contain;
  content: '';
  display: block;
  height: 60px;
  left: 10px;
  position: absolute;
  top: 20px;
  width: 60px;
}

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

  .faqList__title::before {
    width: 50px;
    height: 50px;
  }
}

.faqList__title > span {
  width: 20px;
  height: 15px;
  /*background-image: url("../images/mori_arrow_faq_down.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_arrow_faq_down.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 70%;
  right: 11px;
  margin-top: -12px;
  margin-left: 20px;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
}

.faqList__title > span.active {
  width: 20px;
  height: 15px;
  /*background-image: url("../images/mori_arrow_faq_down.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_arrow_faq_down.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 70%;
  right: 11px;
  margin-top: -12px;
  margin-left: 20px;
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.faqList__answer {
  color: #333;
  display: none;
  font-size: 1.7rem;
  font-weight: normal;
  line-height: 3rem;
  padding: 0 20px 7.8% 113px;
  position: relative;
  text-align: justify;
  text-justify: inter-ideograph;
}

@media only screen and (max-width: 568px) {
  .faqList__answer {
    padding: 20px 40px 20px 74px;
  }
}

.faqList__answer::before {
  /*background: url("../images/mori_faq_answer_icon.png") center no-repeat;*/
  background: url("/wp-content/uploads/2018/06/mori_faq_answer_icon.png") center no-repeat;
  background-size: contain;
  content: '';
  display: block;
  height: 60px;
  left: 10px;
  position: absolute;
  top: 0;
  width: 60px;
}

@media only screen and (max-width: 568px) {
  .faqList__answer::before {
    width: 50px;
    height: 50px;
  }
}

/* -----  お申し込み  ----- */
.contactForm {
  padding: 50px 0;
  background-color: #eff7ff;
}

.contactForm .dottedLine {
  margin: 0px auto 50px;
}

@media screen and (max-width: 750px) {
  .contactForm .dottedLine {
    width: 100%;
    margin: 0px auto 10px;
  }
}

@media only screen and (max-width: 568px) {
  .contactForm .dottedLine {
    width: 100%;
    margin: 0px auto 10px;
  }
}
.contactArea {
  width: 80%; 
  margin: 0 auto;
}

@media only screen and (max-width: 568px) {
  .contactArea {
    width: 100%; 
  }
}

/* -----  お問合せ完了  ----- */
.thanksarea {
 padding-top: 75px;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  color: #333;
  padding: 20px 0 0px;
}

.thanksarea__Text {
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.8rem;
  width: 100%;
  text-align: center;
  margin: 20px auto 20px;
  padding: 0 20px;
}

/* -----  footer  ----- */
.footer {
  background-color: #fff;
  width: 100%;
  border-top: 1px solid #bbb;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .footer {
    height: inherit;
  }
}

@media only screen and (max-width: 568px) {
  .footer {
    height: inherit;
  }
}

.footerArea {
  max-width: 1240px;
  margin: 0 auto;
  position: relative;
  color: #333;
  text-align: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media only screen and (min-width: 662px) and (max-width: 980px) {
  .footerArea {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

@media only screen and (max-width: 662px) {
  .footerArea {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

.footerArea__icon {

  margin: 20px 26px;
  width: 75px;
  display: inline-block;
  position: relative;
}

@media only screen and (min-width: 662px) and (max-width: 980px) {
  .footerArea__icon {
    margin: 20px 20px 20px 10px;
  }
}


@media only screen and (max-width: 662px) {
.footerArea__icon {
    margin: 20px auto 0;
    display: block;
    text-align: center;
}
}

.footerArea__icon img {
  width: 75px;
}

.footerArea__text {
  position: relative;
  line-height: 2rem;
  padding: 15px 0;
  font-size: 1.5rem;
  letter-spacing: 1px;
  width: 40%;
  display: inline-block;
}

@media only screen and (min-width: 662px) and (max-width: 980px) {
  .footerArea__text {
    font-size: 1.3rem;
    width: calc(100% - 105px);
  }
}

@media only screen and (max-width: 662px) {
  .footerArea__text {
    width: 100%;
    display: block;
      text-align: center;
        padding: 0;
  }
}

.footerArea__text--url {
  text-decoration: none;
  color: #333;
}

.footerArea__copy {
  display: inline-block;
  text-align: center;
  position: relative;
  margin: 5px 26px;
  padding: 5px 0 0 0;
  width: calc(100% - 0px);
  line-height: 2rem;
  letter-spacing: 1px;
  font-size: 1.5rem;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .footerArea__copy {
    width: 100%;
    right: inherit;
    font-size: 1.3rem;
    text-align: center;
    padding: 20px 0;
  }
}

@media only screen and (max-width: 568px) {
  .footerArea__copy {
    width: 100%;
    right: inherit;
    font-size: 1.3rem;
    text-align: center;
    padding: 20px 0;
  }
}

/* -----  概要  ----- */
.topcontent-top{
  position:relative;
    width:100%;
    margin: 0 auto;


  }
@media only screen and (max-width: 568px) {
    .topcontent-top{
    width:100%;
  }
}

/* -----  特徴  ----- */
.topcontent{
    position:relative;
    max-width: 1000px;
    width:100%;
    margin: 0 auto 50px;
    padding: 20px 15px;
    background:#FFFFFF;

    border-radius:10px;
    box-shadow:0 0 8px #aaa;
  }
@media only screen and (max-width: 568px) {
    .topcontent{
    width:100%;
  }
}
/* -----  詳細  ----- */

dl.area03 {
    text-align: left;
    margin: 0 auto 42px;
    max-width: 1000px;
    padding: 0 20px;
}
dt{font-weight: bold;
margin: 5px 0 ;}
dd{margin-bottom: 20px;}
/* -----  バリエーション  ----- */
/* -----  スペック・サイズ  ----- */
.link1{
 /* font-size: 2rem;*/
  font-weight: bold;
  margin:20px 0 0px;
}
.link1 > a{
  text-decoration: none;
}
.link1--item {
display: block;
    margin: 10px auto;
    width: 400px;
    height: 60px;
    line-height: 50px;
    text-align: center;
    color: #004da2;
    background-color: #ffffff;
    border: 4px solid #004da2;
    border-radius: 5px;
    transition: .5s;
}
}

.link1--item:hover {
  background-color: #8ac3ff;
  border: 4px solid #004da2;
}


.link2{
  font-size: 2rem;
  font-weight: bold;
  margin:20px 0 0px;
}
.link2 > a{
  text-decoration: none;
}
.link2--item {
  display: inline-block;
  margin:10px;
  width: 300px;
  height:60px;
  line-height: 60px;
  text-align: center;
  color: #fff;
  background-color: #004da2;
  border-bottom: 6px solid #002853;
  border-radius: 5px;
  transition: .5s;
}

.link2--item:hover {
  background-color: #8ac3ff;
  border-bottom: 6px solid #002853;
}

/* -----  ダウンロード  ----- */
.link{
  font-size: 2rem;
  font-weight: bold;
  margin:20px 0 40px;
}
.link > a{
  text-decoration: none;
}
.link--item {
  display: inline-block;
  /* margin:10px; */
  width: 260px;
  height:60px;
  line-height: 60px;
  text-align: center;
  color: #fff;
  background-color: #4caf50;
  border-bottom: 6px solid #264c28;
  border-radius: 100px;
  transition: .5s;
}

.link--item:hover {
  background-color: #8BC34A;
  border-bottom: 6px solid #333;
}
/* -----  フォーム  ----- */
input[type="radio"] {text-align: left;}
}

#satori__creative_container *, #satori__creative_container :after, #satori__creative_container :before, #satori__form_container *, #satori__form_container :after, #satori__form_container :before, #satori__html_part_container *, #satori__html_part_container :after, #satori__html_part_container :before {

    text-align: left;@charset "UTF-8";
 http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)




html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}



@media only screen and (max-width: 568px) {
br.pc{ content: none;}
}

.h-title:before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -40%;
    display: inline-block;
    width: 15%;
    height: 9%;
    transform: translate(-50%);
    background-color: #0068b7;
}


.pc{}
.sp{display: none;}

.text-l {text-align: left;}
.text-r {text-align: right;}
.text-c {text-align: center;}
@media only screen and (max-width: 568px) {
.pc{display: none;}
.sp{display: block;}
}

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

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */
a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */

b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

#area01{padding-top: 20px;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/* -----  setting & detail  ----- */
html {
  font-size: 62.5%;
}

body {
  background-size: cover;
  color: #fff;
  text-align: center;
  font-size: 1.8rem;
  font-family: "YuGothic", "游ゴシック", "HiraKakuPro", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Roboto, Osaka, sans-serif;
  font-weight: 500;
}

h1 {
  display: none;
}

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

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

.hiddenheader {
  display: none;
}

/* -----  float_button  ----- */
.floatbtnarea {
  position: fixed;
  bottom: 0;
  padding: 0;
  visibility: visible;
  right: 0;
  /*right: calc((100% - 1280px)/2);*/
  margin: 0 auto;
  line-height: 5rem;
  text-decoration: none;
  z-index: 10;
}

@media screen and (max-width: 1280px) {
  .floatbtnarea {
    right: 0;
  }
}

.floatButtons {
  width: 100%;
  margin: 0 auto;
  text-align: right;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .floatButtons {
    max-width: inherit;
  }
}

.floatButtons__free {
  opacity: 1;
  visibility: visible;
}

.floatButtons__freeimg {
  width: 270px;
  margin-right: 16px;
}

@media only screen and (max-width: 568px) {
  .floatButtons__freeimg {
    display: none;
  }
}

.floatButtons__freeimgSp {
  display: none;
  max-width: 275px;
  margin-right: 16px;
}

@media only screen and (max-width: 568px) {
  .floatButtons__freeimgSp {
    display: inherit;
  }
}

@media screen and (max-width: 371px) {
  .floatButtons__freeimgSp {
    margin-right: 3px;
    max-width: 240px;
  }
}

@media only screen and (max-width: 320px) {
  .floatButtons__freeimgSp {
    margin-right: 3px;
    max-width: 240px;
  }
}

.floatButtons__topimg {
  width: 80px;
  margin-right: 22px;
}

@media only screen and (max-width: 568px) {
  .floatButtons__topimg {
    width: 65px;
    margin-right: 12px;
  }
}

@media only screen and (max-width: 320px) {
  .floatButtons__topimg {
    margin-right: 10px;
    width: 55px;
  }
}

.button-fadeout {
  opacity: 0;
  visibility: hidden;
}

/* -----  heading_title_default  ----- */
.preload * {
  -webkit-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

.dottedLine {

  font-size: 2.8rem;
  font-weight: bold;
}

@media only screen and (max-width: 568px) {
  .dottedLine {
    font-size: 2.0rem;
  }
}

.dottedLine > span {
  padding: 0 20px;
}

.dottedLine::before, .dottedLine::after {
  /*background-image: url("../images/mori_dot_line.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_dot_line.png");
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  height: 4px;
}

@media all and (-ms-high-contrast: none) {
  .dottedLine::before, .dottedLine::after {
    -webkit-box-flex: 1 auto;
        -ms-flex-positive: 1 auto;
            flex-grow: 1 auto;
    display: block;
  }
}

@media only screen and (max-width: 568px) {
  .dottedLine::before, .dottedLine::after {
    /*background-image: url("../images/mori_dot_line_sp_pattern2.png");*/
    background-image: url("/wp-content/uploads/2018/06/mori_dot_line_sp_pattern2.png");
    background-repeat: repeat-x;
  }
}

.dottedLine::before {
  margin-right: 1rem;
  background-position: right;
}

@media only screen and (max-width: 568px) {
  .dottedLine::before {
    margin-left: 20px;
  }
}

@media only screen and (max-width: 320px) {
  .dottedLine::before {
    margin-left: 5px;
  }
}

.dottedLine::after {
  margin-left: 1rem;
  background-position: left;
}

@media only screen and (max-width: 568px) {
  .dottedLine::after {
    margin-right: 20px;
  }
}

@media only screen and (max-width: 320px) {
  .dottedLine::after {
    margin-right: 5px;
  }
}

.underLine {
  position: relative;
  display: inline-block;
  margin: 0 auto 40px;
  padding-bottom: 20px;
  letter-spacing: 2px;
  font-size: 3.6rem;
  font-weight: bold;
  letter-spacing: 0.01em;
  color: #000;
}

@media only screen and (max-width: 568px) {
  .underLine {
    margin: -5px 0 25px;
    font-size: 2rem;
    line-height: 1.5;
      
  }
}

.underLine::after {
  content: " ";
  border-bottom: 4px solid #009688;
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(51% - 0px);
}

.underLine::before {
  content: " ";
  border-bottom: 4px solid #009688;
  position: absolute;
  left: 0;
  bottom: 0;
  width: calc(50% - 0px);
}

.underLine__topcontent{
  font-size: 2.3rem;
  font-weight: bold;
  letter-spacing: 0.01em;
  color: #4679bd;
  margin-bottom: 25px;
  text-align: center;
  padding-top:50px;
}
.underLine__topcontent::before{
  /*content: url("../images/before.png");*/
  content: url("/wp-content/uploads/2020/07/mori_head_bkslash.png");
  margin-right:5px;
  height:1.0rem;
}
.underLine__topcontent::after{
  /*content: url("../images/after.png");*/
  content:url("/wp-content/uploads/2020/07/mori_head_slash.png");
  margin-left:5px;
  width:20%;
}


.underLine__topimg {
  margin-top: 100px;
  margin-bottom: 15px;
  width: 100%;
  text-align: center;
}

.underLine__topimg > img {
  width: 67px;
}

.underLine span::before {
  top: 96%;
  left: calc(50% - 7px);
  /*background-image: url("../images/mori_balloon_triangle.png");*/
/*  background-image: url("/wp-content/uploads/2018/06/mori_balloon_triangle.png");*/
  content: " ";
  background-repeat: no-repeat;
  background-size: contain;
  width: calc(33px / 2);
  height: calc(29px / 2);
  position: absolute;
  pointer-events: none;
}

.jsFrameIn {
  opacity: 0;
  -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
          transform: translateY(20px);
  -webkit-transition: opacity .5s, -webkit-transform .5s;
  transition: opacity .5s, -webkit-transform .5s;
  -o-transition: opacity .5s, transform .5s;
  transition: opacity .5s, transform .5s;
  transition: opacity .5s, transform .5s, -webkit-transform .5s;
}

.jsFrameIn.jsActive {
  opacity: 1;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

.hover-Anim {
  -webkit-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition: 0.3s ease 0s;
  -o-transition: 0.3s ease 0s;
  transition: 0.3s ease 0s;
}

@media only screen and (min-width: 569px) {
  .hover-Anim:hover {
    opacity: .8;
  }
}

/* -----  modal  ----- */
.modal {
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  max-width: 1020px;
  width: 100%;
  margin: 0 auto;
  background: #fff;
  border-radius: 10px;
  z-index: 1000;
  display: none;
  position: fixed;
}

@media only screen and (max-width: 568px) {
  .modal {
    position: fixed;
    width: 90%;
    height: auto;
    padding-bottom: 20px;
  }
}

@media screen and (max-width: 1040px) {
  .modal {
    width: 90%;
  }
}

.modal__title {
  max-width: 1020px;
  width: 100%;
  background-color: #4679bd;
  border-radius: 10px 10px 0 0;
  padding: 20px 0;
  z-index: 1010;
  position: relative;
}

@media only screen and (max-width: 568px) {
  .modal__title {
    width: 100%;
  }
}

.modal__title--icon {
  position: absolute;
  top: 8px;
  left: 10px;
  border-radius: 5px;
  background-color: #fff;
  padding: 4px;
}

@media only screen and (max-width: 320px) {
  .modal__title--icon {
    top: 10px;
    left: 10px;
  }
}

.modal__title--icon > img {
  height: 43px;
  width: auto;
}

@media only screen and (max-width: 568px) {
  .modal__title--icon > img {
    height: 38px;
  }
}

@media only screen and (max-width: 320px) {
  .modal__title--icon > img {
    height: 28px;
  }
}

.modal__title--body {
  top: 0;
  color: #fff;
  font-size: 3rem;
}

@media only screen and (max-width: 568px) {
  .modal__title--body {
    font-size: 2.2rem;
  }
}

.modal__title--close {
  position: absolute;
  top: 50%;
  right: 15px;
  -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
          transform: translate(0, -50%);
}

@media only screen and (max-width: 568px) {
  .modal__title--close {
    right: 18px;
    top: 32px;
  }
}

.modal__title--closeButton {
  color: #00f;
  text-decoration: underline;
  cursor: pointer;
}

.modal__title--closeButton > img {
  width: 36px;
  height: auto;
}

@media only screen and (max-width: 568px) {
  .modal__title--closeButton > img {
    width: 20px;
  }
}

.modal__box {
  height: 100%;
}

@media screen and (max-height: 750px) {
  .modal__box {
    height: 100%;
  }
}

.modal__box--body {
  width: 100%;
}

.modal__box--body > p {
  padding: 0 50px 50px;
  text-align: justify;
  text-justify: inter-ideograph;
  color: #333;
  font-size: 1.6rem;
  line-height: 2;
}

@media screen and (max-height: 750px) {
  .modal__box--body > p {
    font-size: 1.4rem;
    padding: 5px 15px;
  }
}

@media only screen and (max-width: 568px) {
  .modal__box--body > p {
    padding: 20px;
  }
}

.modal__box--mov {
  width: 100%;
  padding: 50px 50px 20px 50px;
  margin: 0 auto;
}

@media screen and (max-height: 750px) {
  .modal__box--mov {
    padding: 5px;
    width: calc((65vh * 1.778) - 100px);
  }
}

@media screen and (max-height: 400px) {
  .modal__box--mov {
    padding: 5px;
    height: 90%;
  }
}

@media only screen and (max-width: 568px) {
  .modal__box--mov {
    width: 100%;
    padding: 10px;
  }
}

.modal__box--mov > .modalMov {
  padding-top: 56.25%;
  position: relative;
  width: 100%;
}

@media screen and (max-height: 750px) {
  .modal__box--mov > .modalMov {
    padding-top: inherit;
  }
}

@media only screen and (max-width: 568px) {
  .modal__box--mov > .modalMov {
    width: 100%;
    height: auto;
  }
}

@media screen and (max-height: 750px) {
  .modal__box--mov > .modalMov:before {
    content: "";
    display: block;
    padding-top: 56.25%;
  }
}

.modal__box--mov > .modalMov iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.modal__box--spCloseBtn {
  display: none;
}

@media only screen and (max-width: 568px) {
  .modal__box--spCloseBtn {
    cursor: pointer;
    display: block;
    width: 135px;
    height: 35px;
    margin: 20px auto;
    padding-top: 7px;
    border-radius: 64px;
    border: solid #4679bd 2px;
    color: #4679bd;
  }
}

.modalOverlay {
  background-color: rgba(0, 0, 0, 0.75);
  bottom: 0;
  cursor: pointer;
  left: 0;
  opacity: 0;
  position: fixed;
  right: 0;
  top: 0;
  -webkit-transition: .6s all;
  -o-transition: .6s all;
  transition: .6s all;
  visibility: hidden;
  z-index: 101;
}

.modalOverlay.jsActive {
  opacity: 1;
  visibility: visible;
}

.spOnry {
  display: none;
}

@media only screen and (max-width: 568px) {
  .spOnry {
    display: block;
  }
}

/* -----  spmenu  ----- */
.globalMenuSp {
  visibility: hidden;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  background: #fff;
  color: #000;
  text-align: center;
  -webkit-transform: translateY(-120%);
      -ms-transform: translateY(-120%);
          transform: translateY(-120%);
  -webkit-transition: all 0.9s;
  -o-transition: all 0.9s;
  transition: all 0.9s;
  width: 100%;
}

.globalMenuSp ul {
  background: #fff;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

.globalMenuSp ul li {
  font-size: 1.1em;
  list-style-type: none;
  padding: 0;
  width: 95%;
  margin: 0 auto;
  border-top: 1px solid #efefef;
  text-align: left;
  position: relative;
}

.globalMenuSp ul li:after {
  content: "";
  position: absolute;
  top: 15px;
  right: 15px;
  width: 9px;
  height: 9px;
  border-top: 2px solid #009688;
  border-right: 2px solid #009688;
  -webkit-transform: translateY(50%) rotate(45deg);
  -ms-transform: translateY(50%) rotate(45deg);
  transform: translateY(50%) rotate(45deg);
}

.globalMenuSp ul li:last-child {
  padding-bottom: 0;
  border-bottom: none;
  border-bottom: 1px solid #efefef;
  text-align: left;
}

.globalMenuSp ul li a {
  display: block;
  color: #000;
  padding: 19px 0 18px 30px;
  text-decoration: none;
}

.globalMenuSp__logo {
  width: 100%;
  padding: 10px;
  text-align: center;
}

.globalMenuSp__logo--img {
  width: 130px;
}

.globalMenuSp.active {
  visibility: visible;
  -webkit-transform: translateY(0%);
      -ms-transform: translateY(0%);
          transform: translateY(0%);
}

.globalMenuSp__button {
  display: block;
  margin: 20px auto;
  max-width: 355px;
  text-align: center;
  width: 90%;
  font-size: 2.2rem;
  font-weight: bold;
  padding-top: 19px;
  background-color: #ff9900;
  height: 58px;
  color: #fff;
  border-radius: 29px;
  text-decoration: none;
}

.globalMenuSp__buttonAnchor {
  text-decoration: none;
}

.spMenuButton {
  display: block;
  position: absolute;
  right: 3px;
  top: 1px;
  width: 40px;
  height: 51px;
  z-index: 1003;
  text-align: center;
}

@media only screen and (min-width: 569px) {
  .spMenuButton {
    display: none;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .spMenuButton {
    display: block;
  }
}

.spMenuButton:hover {
  cursor: pointer;
}

.spMenuButton.active {
  position: fixed;
}

.spMenuButton span {
  display: block;
  position: absolute;
  width: 28px;
  border-bottom: solid 2px #009688;
  -webkit-transition: .35s ease-in-out;
  -o-transition: .35s ease-in-out;
  transition: .35s ease-in-out;
  left: 6px;
}

.spMenuButton span:nth-child(1) {
  top: 9px;
}

.spMenuButton span:nth-child(2) {
  top: 18px;
}

.spMenuButton span:nth-child(3) {
  top: 27px;
}

.spMenuButton span:nth-child(4) {
  border: none;
  color: #4679bd;
  font-size: 5px;
  top: 34px;
}

.spMenuButton.active span:nth-child(1) {
  top: 18px;
  left: 6px;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.spMenuButton.active span:nth-child(2),
.spMenuButton.active span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

.spMenuButton .menuOpen {
  width: 26px;
}

.spMenuButton .menuClose {
  display: none;
  width: 20px;
}

/* -----  header  ----- */
.header {
  width: 100%;
  background-color: #fff;
  position: relative;
  z-index: 1;
  /*background-image: url("../images/mori_bg_checkered.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_checkered.jpg");
  background-repeat: repeat;
}

.headerInfomationArea {
  background-color: #ffffff;
  width: 100%;
}

.headerInfomation {
  background-color: #ffffff;
  /* max-width: 1240px; */
  margin: -20px auto 0;
  position: relative;
  height: 90px;
  border-bottom:  5px #ddd solid;
}
 
@media only screen and (max-width: 981px) {
  .headerInfomation {
    height: 80px;
     margin: 50px auto 0;
  }
}

@media only screen and (max-width: 782px) {
  .headerInfomation {
      height: 80px;
      margin: 0px auto 0;
  }
}

@media only screen and (max-width: 568px) {
  .headerInfomation {
    height: 50px;
  }
}
.headerInfomation__logoimg {
  width: 400px;
  top: 15px;
  left: 20px;
  position: absolute;
  /* border-bottom: 5px #ddd solid; */
}

@media only screen and (max-width: 568px) {
  .headerInfomation__logoimg {
    top: 5px;
    left: 7px;
    width: 250px;
  }
}

.headerInfomation__menu {
  display: none;
}

@media only screen and (min-width: 569px) {
  .headerInfomation__menu {
    display: block;
    /* width: 600px; */
    margin: 0 20px 0 226px;
    /* background-color: #fff; */
    position: relative;
    text-align: right;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .headerInfomation__menu {
    display: none;
    list-style: none;
  }
}

.headerInfomation__menu--item {
  list-style: none;
  padding-top: 17px;
}

.headerInfomation__menu--item > li {
  font-size: 1.8rem;
  margin: 0 8px;
  font-weight: bold;
  text-align: center;
  display: inline-block;
}

.headerInfomation__menu--item > li > a {
  text-decoration: none;
  color: #333;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  height: 55px;
  padding: 5px 5px 5px 5px;
  -webkit-transition: none;
  -o-transition: none;
  transition: none;
}

.headerInfomation__menu--item > li > a:before {
  visibility: hidden;
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  border-bottom: 3px solid #4CAF50;
  -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s;
}

.headerInfomation__menu--item > li > a:hover:before, .headerInfomation__menu--item > li > a.is-active:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
          transform: scaleX(1);
}

.headerInfomation__menu--item > li > a:hover {
  text-decoration: none;
}

.headerInfomation__menu--item > li > a.is-active {
  pointer-events: none;
}

.headerInfomation__contactimgs {
  display: none;
}

@media screen and (min-width: 1181px) {
  .headerInfomation__contactimgs {
    display: block;
    right: 110px;
    position: absolute;
    top: 14px;
    width: 210px;
  }
}

@media only screen and (max-width: 568px) {
  .headerInfomation__contactimgs {
    display: block;
    right: 50px;
    position: absolute;
    top: 7px;
    width: 120px;
  }
}

.headerInfomation__contactimgs > img {
  position: absolute;
  width: 210px;
}


.headerInfomation__contactimgs:hover{
  opacity: 0.6;
  filter: alpha(opacity=60);

  -moz-opacity:0.6;
}


.headerInfomation__tmcimgs {
  display: none;
}

@media screen and (min-width: 981px) {
  .headerInfomation__tmcimgs {
    display: block;
    right: 4px;
    position: absolute;
    top: 21px;
    width: 75px;
  }
}

@media screen and (min-width: 1180px) {
  .headerInfomation__tmcimgs {
    display: block;
    right: 4px;
    position: absolute;
    top: 21px;
    width: 75px;
  }
}

/* -----  main visual  ----- */
.Mainvisual {
  /*background-image: url("../images/mori_keyvisual_mainbg_pc.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_keyvisual_mainbg_pc.png");
  background-position: 0 -90px;
  background-repeat: no-repeat;
  background-size: 100%;
  max-width: 1282px;
  height: 580px;
  width: 100%;
  margin: 0 auto;
  position: relative;
}

@media only screen and (max-width: 1280px) {
  .Mainvisual {
    background-size: cover;
    background-position: center -90px;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual {
    background-position: 0 -45px;
    /*background-image: url("../images/mori_keyvisual_mainbg_sp.png");*/
    background-image: url("/wp-content/uploads/2018/06/mori_keyvisual_mainbg_sp.png");
  }
}

.Mainvisual__maintext {
  position: absolute;
}

.Mainvisual__maintext > img {
  max-width: 90%;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext > img {
    max-width: 390px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .Mainvisual__maintext {
    display: block;
    right: 50px;
  }
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext {
    text-align: right;
    top: 230px;
    right: 91px;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual__maintext {
    display: none;
  }
}

.Mainvisual__maintext--copy2 {
  font-size: 2.3rem;
  position: absolute;
  letter-spacing: 0.02em;
  line-height: 1.3em;
  color: #4679bd;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext--copy2 {
    text-align: right;
    top: 389px;
    right: 104px;
  }
}

.Mainvisual__deviceimg {
  position: absolute;
  bottom: 0;
  left: 94px;
  width: 33.4765625%;
}

@media only screen and (max-width: 568px) {
  .Mainvisual__deviceimg {
    display: none;
  }
}

.Mainvisual__deviceimg > img {
  width: 100%;
}

.Mainvisual__overawardimg {
  position: absolute;
  bottom: 20px;
  left: 0;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__overawardimg {
    bottom: 37px;
    left: 100px;
  }
}

.Mainvisual__overawardimg img {
  width: 80%;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__overawardimg img {
    max-width: 450px;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual__maintext_sp {
    display: block;
    padding-top: 170px;
    margin: 0px auto;
  }
}

.Mainvisual__maintext_sp > img {
  max-width: 90%;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__maintext_sp {
    display: none;
  }
}

@media only screen and (max-width: 568px) {
  .Mainvisual__maintext_sp {
    width: 300px;
  }
}

.Mainvisual__deviceimg_sp {
  display: block;
  margin: 10px auto;
}

@media only screen and (min-width: 569px) {
  .Mainvisual__deviceimg_sp {
    display: none;
  }
}

.Mainvisual__deviceimg_sp > img {
  width: 280px;
  margin-right: 20px;
}
/* ----- グループウェアとは ----- */
.about{
  padding:100px 0 70px;
  /*background-image: url("../images/mori_bg_box.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_stripe.jpg");
}
.aboutArea{
  color: #333;
  max-width: 1080px;
  width: 100%;
  margin: 0 auto;
}
.aboutcontent{
  width: 75%;
  margin: 50px auto;
  font-size:1.7rem;
  text-align: left;
  line-height: 1.6;
}

/* ----- こんなお悩みありませんか ----- */
.understand {
  width: 100%;
  margin: 0 auto;
  /*background-image: url("../images/mori_bg_checkered.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_checkered.jpg");
  background-repeat: repeat;
  padding: 140px 0px;
}

@media only screen and (max-width: 568px) {
  .understand {
    padding-bottom: 30px;
  }
}

.understand .dottedLine {
  margin: 40px auto 56px;
}

@media only screen and (max-width: 568px) {
  .understand .dottedLine {
    width: 100%;
  }
}

.understand .hiddenheader {
  display: none;
}

.understand .underLine {
  margin-bottom: 72px;
  padding-bottom: 18px;
  letter-spacing: 0.07em;
}

@media only screen and (max-width: 568px) {
  .understand .underLine {
    margin-bottom: 50px;
  }
}

@media only screen and (max-width: 568px) {
  .understand .underLine__topimg {
    margin-top: 30px;
  }
}
/* -----  特徴　こんなことでお悩みではありませんか  ----- */
.troubleList {
  max-width: 872px;
  width: 100%;
  margin: -20px auto 0;
}

@media screen and (max-width: 850px) {
  .troubleList {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 568px) {
  .troubleList {
    padding: 0 0px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .troubleList {
    padding: 0 20px;
  }
}

.troubleList__body {
  font-size: 2.4rem;
  color: #000;
  text-align: left;
  padding-left: 30px;
  line-height: 30px;
  /*background: url("../images/mori_chk.png");*/
  background: url("/wp-content/uploads/2018/06/mori_chk.png");
  background-repeat: no-repeat;
  background-size: 30px;
  padding: 0 0 30px;
  font-weight: bold;
}

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

.troubleList__body > p {
  padding: 0 0 0 2em;
  background-position: left top;
  text-indent: 0em;
}

@media only screen and (max-width: 568px) {
  .troubleList__body > p {
    font-size: 1.8rem;
    margin: 20px -0;
  }
}

.resolution {
  /*background: url("../images/mori_ic_arrow_1.png");*/
  background: url("/wp-content/uploads/2018/06/mori_ic_arrow_1.png");
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 50px;
  padding-top: 113px;
  font-weight: bold;
  margin: 40px auto 20px;
  color: #4679bd;
}

@media only screen and (max-width: 568px) {
  .resolution {
    padding-top: 55px;
    background-size: 23px;
  }
}

.resolution__body {
  font-size: 39px;
  padding: 0px;
  letter-spacing: 0.1rem;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(80%, transparent), color-stop(80%, #fceb5c));
  background: -webkit-linear-gradient(transparent 80%, #fceb5c 80%);
  background: -o-linear-gradient(transparent 80%, #fceb5c 80%);
  background: linear-gradient(transparent 80%, #fceb5c 80%);
}

@media only screen and (max-width: 568px) {
  .resolution__body {
    padding-bottom: 5px;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, transparent), color-stop(80%, #fceb5c));
    background: -webkit-linear-gradient(transparent 65%, #fceb5c 80%);
    background: -o-linear-gradient(transparent 65%, #fceb5c 80%);
    background: linear-gradient(transparent 65%, #fceb5c 80%);
    font-size: 2.5rem;
    letter-spacing: 0.3rem;
    font-weight: inherit;
    line-height: 1.4;
  }
}

/* -----  特徴  ----- */
.characteristic {
  width: 100%;
  margin: 0 auto;
  /*background-image: url("../images/mori_bg_checkered.jpg");*/
/*  background-image: url("/wp-content/uploads/2018/06/mori_bg_checkered.jpg");
  background-repeat: repeat;*/
  padding:50px 10px 40px;
}

@media only screen and (max-width: 568px) {
  .characteristic {
    padding-bottom: 30px;
  }
}

.characteristic .dottedLine {
  margin: 40px auto 56px;
}

@media only screen and (max-width: 568px) {
  .characteristic .dottedLine {
    width: 100%;
  }
}

.characteristic .hiddenheader {
  display: none;
}

.characteristic .underLine {
  margin-bottom: 30px;
  padding-bottom: 18px;
  letter-spacing: 0.07em;
}

@media only screen and (max-width: 568px) {
  .characteristic .underLine {
    margin-bottom: 20px;
  }
}

@media only screen and (max-width: 568px) {
  .characteristic .underLine__topimg {
    margin-top: 30px;
  }
}

.characteristicThree {
  color: #333;
  display: block;
  max-width: 1140px;
  width: 100%;
  margin: 20px auto;
  table-layout: fixed;
  height: 100%;
}

@media only screen and (min-width: 569px) {
  .characteristicThree {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 0 0 0 0px;
  }
}

.characteristicThree__box {
  display: block;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box {
    width: 100%;
  }
}

@media only screen and (min-width: 569px) {
  .characteristicThree__box {
    margin: 0 30px;
  }
}

.characteristicThree__box--imageArea {
  display: block;
  max-width: 315px;
  height: 208px;
  width: 100%;
  padding: 1px 0 0 0;
  position: relative;
}

@media screen and (max-width: 1040px) {
  .characteristicThree__box--imageArea {
    height: 18vw;
  }
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--imageArea {
    max-width: inherit;
    width: 90%;
    margin: 20px;
    height: 55vw;
  }
}

.characteristicThree__box--imageArea_photo {
  position: absolute;
  top: 45px;
  left: 0px;
  width: 100%;
  height: auto;
  z-index: 1;
}

.characteristicThree__box--imageArea_icon {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 75px;
  z-index: 2;
}

.characteristicThree__box--image {
  display: block;
  max-width: 315px;
  width: 100%;
  padding: 0;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--image {
    max-width: inherit;
    width: 90%;
    margin: 20px;
  }
}

.characteristicThree__box--title {
  max-width: 315px;
  width: 100%;
  margin: 33px 0 20px;
  text-align: justify;
  text-justify: inter-ideograph;
  font-size: 2.4rem;
  font-weight: bold;
  padding: 0;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--title {
    font-size: 2rem;
    letter-spacing: 0.1em;
    margin: 40px 0 13px;
    max-width: inherit;
    text-align: center;
    width: 100%;
  }
}

.characteristicThree__box--title > h4 > span {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);
  line-height: 1.6;
}

.characteristicThree__box--text {
  max-width: 315px;
  width: 100%;
  text-align: justify;
  text-justify: inter-ideograph;
  font-size: 1.7rem;
  padding: 0;
  line-height: 1.9;
}

@media only screen and (max-width: 568px) {
  .characteristicThree__box--text {
    max-width: inherit;
    width: 100%;
    margin: 10px 0px 35px;
    padding: 0 20px 0px 10px;
  }
}
/* ----- 概要 ----- */
.recommendedArea-top {
  color: #333;
  max-width: 1200px;
  width: 100%;
  margin: 5px auto 20px;
}

/*@media screen and (max-width: 1100px) {
 .recommendedArea-top {
    padding: 20px 0;
  }
}

@media only screen and (min-width: 569px) {
  .recommended-top {
    margin: 0 0 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended-top {
    margin: 0 30px 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
*/

  .recommended__img-top {
    width: 100%;
}

/*@media only screen and (min-width: 569px) {
  .recommended-top:nth-child(odd) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-flow: row-reverse;
           /* flex-flow: row-reverse;
  }
}

@media only screen and (min-width: 569px) {
  .recommended-top:nth-child(odd) .recommended__img-top {
    margin: 0;
    text-align: right;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended-top:nth-child(odd) .recommended__img-top {
     margin: 0 20px;
  }
}*/

  .recommended__img-top img {
   max-width: 1000px;
  }

@media only screen and (max-width: 768px) {
  .recommended__img-top img {
    width: 95%;
  }
}


@media only screen and (min-width: 569px) {
  .recommended__box-top {
    margin: 30px 30px 10px;
   
  }
}

.recommended__title-top {
    text-align: center;
    text-justify: inter-ideograph;
    font-size: 2.5rem;
    font-weight: bold;
    /* letter-spacing: 0.1rem; */
    line-height: 1.2;
    margin-bottom: 30px;
    margin-top: 20px;}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__title-top {
      text-align: center; 
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 0px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__title-top {
    text-align: center;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 18px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

.recommended__title-top span {
/*  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);*/
  padding: 0;
}

@media only screen and (min-width: 569px) {
  .recommended__text-top {
    line-height: 1.5;
    text-align: center;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    letter-spacing: 0.1rem;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__text-top {
    line-height: 1.9;
     text-align: center;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    padding: 0 20px;
    margin-bottom: 15px;
  }
}
/* ----- 特徴 ----- */
.recommendedArea {
  color: #333;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

@media screen and (max-width: 1100px) {
  .recommendedArea {
    padding: 0 10px;
  }
}

@media only screen and (min-width: 569px) {
  .recommended {
    margin: 0 0 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended {
    margin: 0 30px 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 569px) {
  .recommended__img {
    width: 100%;
    margin: 0 0 0 0;
    text-align: left;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__img {
    width: 100%;
    margin: 0 20px;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__img {
    width: 100%;
  }
}

@media only screen and (min-width: 569px) {
  .recommended:nth-child(odd) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-flow: row-reverse;
           /* flex-flow: row-reverse;*/
  }
}

@media only screen and (min-width: 569px) {
  .recommended:nth-child(odd) .recommended__img {
    margin: 0;
    text-align: right;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended:nth-child(odd) .recommended__img {
     margin: 0 20px;
  }
}

@media only screen and (min-width: 569px) {
  .recommended__img img {
    /*max-width: 420px;*/
    width: 100%;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__img img {
    width: 100%;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__img img {
    width: 100%;
  }
}


@media only screen and (min-width: 569px) {
  .recommended__box {
    width: 50%;
    margin: 0 30px 10px;
  }
}

.recommended__title {
    text-align: justify;
    text-justify: inter-ideograph;
    font-size: 2.5rem;
    font-weight: bold;


    /* letter-spacing: 0.1rem; */
    line-height: 1.2;
    margin-bottom: 10px;
    margin-top: 20px;}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .recommended__title {
    text-align: justify;
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 0px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__title {
    text-align: center;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.2;
    margin-top: 18px;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
  }
}

.recommended__title span {
/*  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);*/
  padding: 0;
}

@media only screen and (min-width: 569px) {
  .recommended__text {
    line-height: 1.5;
    text-align: justify;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    letter-spacing: 0.1rem;
  }
}

@media only screen and (max-width: 568px) {
  .recommended__text {
    line-height: 1.9;
    text-align: justify;
    text-justify: inter-ideograph;
    display: block;
    width: 100%;
    font-size: 1.6rem;
    padding: 0 20px;
    margin-bottom: 15px;
  }
}


/* -----  機能一覧  ----- */
.functionList {
  padding: 80px 0;
  color: #333;
  text-align: center;
  /*background-image: url("../images/mori_bg_box.jpg");*/
  background-color:#f1f1f185;
  background-repeat: repeat;
}

@media only screen and (max-width: 568px) {
  .functionList {
    padding: 80px 0 40px;
  }
}

.functionList__heading {
  padding: 80px 0 80px 0;
  text-align: center;
}

.functionList .dottedLine {
  margin: 0px auto 50px;
}

@media only screen and (max-width: 568px) {
  .functionList .dottedLine {
    width: 100%;
    margin: 0px auto 40px;
  }
}

.functionList-body {
  font-size: 1.9rem;
  font-weight: bold;
  letter-spacing: 0.06rem;
  color: #000;
  line-height: 2;
}

@media only screen and (max-width: 568px) {
  .functionList-body {
    font-size: 1.7rem;
    margin: 0 20px;
  }
}

.functionList__list {
  max-width: 1040px;
  margin: 0 auto;
  padding-top: 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
}

@media screen and (max-width: 1040px) {
  .functionList__list {
    padding: 35px 20px 0;
  }
}

@media only screen and (max-width: 568px) {
  .functionList__list {
    padding: 35px 0 0 0;
  }
}

.functionList__list-box {
  border: solid transparent 3px;
  height: 180px;
  background-color: #fff;
  margin-top: 11px;
  margin-bottom: 24px;
  margin-left: 14px;
  margin-right: 14px;
  -ms-flex-item-align: auto;
      align-self: auto;
  border-radius: 90px;
  cursor: pointer;
  width: 180px;
  -webkit-transition: .5s all;
  -o-transition: .5s all;
  transition: .5s all;
}

@media screen and (max-width: 1040px) {
  .functionList__list-box {
    margin-left: calc((100% - 720px) / 8);
    margin-right: calc((100% - 720px) / 8);
  }
}

@media screen and (max-width: 800px) {
  .functionList__list-box {
    margin-left: calc((100% - 540px) / 6);
    margin-right: calc((100% - 540px) / 6);
  }
}

@media only screen and (max-width: 568px) {
  .functionList__list-box {
    width: 150px;
    height: 150px;
    border-radius: 100%;
    margin: calc((100% - 300px) / 4);
  }
}

@media only screen and (max-width: 320px) {
  .functionList__list-box {
    width: 130px;

    height: 130px;
    border-radius: 100%;
    margin: calc((100% - 260px) / 4);
  }
}

@media only screen and (min-width: 569px) {
  .functionList__list-box:hover {
    border: solid #4679bd 3px;
    color: #4679bd;
  }
}

.functionList__list-box-icon {
  height: 130px;
}

.functionList__list-box--iconimg {
  margin-top: 40px;
  margin-bottom: 10px;
  height: 80px;
}

@media only screen and (max-width: 568px) {
  .functionList__list-box--iconimg {
    margin-top: 15px;
  }
}

@media only screen and (max-width: 320px) {
  .functionList__list-box--iconimg {
    height: 60px;
    margin-top: 20px;
  }
}

.functionList__list-box--title {
  font-size: 1.6rem;
}

@media only screen and (max-width: 568px) {
  .functionList__list-box--title {
    margin-top: 5px;
    margin-bottom: 20px;
  }
}

.functionList__list-notice {
  max-width: 1040px;
  margin: 19px auto 90px;
  text-align: right;
  font-size: 1.7rem;
}

@media only screen and (max-width: 568px) {
  .functionList__list-notice {
    margin: 0px 20px 30px;
    text-align: left;
    line-height: 1.5;
  }
}

.functionList__list-nonedisplay {
  visibility: hidden;
  height: 0;
  margin: 0;
  padding: 0;
}

/* -----  機能一覧　　簡単に連携できるオプション  ----- */
.optionLists {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 1000px;
    margin: 0px auto 30px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #FFF;
    padding: 20px 0;
    border-radius: 10px;
}

@media only screen and (max-width: 568px) {
  .optionLists {
    display: block;
    width: 100%;
  }
}

.optionLists__itme {
  text-align: center;
}

@media only screen and (max-width: 568px) {
  .optionLists__itme {
    width: 90%;
    margin: 0 auto;
  }
}

.optionLists__itme > img {
  max-width: 300px;
  width: 100%;
  padding: 10px;
}

@media only screen and (max-width: 568px) {
  .optionLists__itme > img {
    width: 90%;
  }
}

.optionLists__itme > a > img {
  max-width: 475px;
  width: 90%;
  padding: 10px;
}

@media only screen and (max-width: 568px) {
  .optionLists__itme > a > img {
    width: 90%;
  }
}

.companylist {
  padding: 10px 0 5px;
  background-color: #fff;
  color: #333;
  text-align: center;
  border-top: solid 5px #ddd;
}

.companylist .dottedLine {
  margin: 0px auto 60px;
}

@media only screen and (max-width: 568px) {
  .companylist .dottedLine {
    width: 100%;
  }
}

.companylist__heading {
  padding: 80px 0;
  text-align: center;
}

/* -----  導入実績  ----- */
.companylists {
 /* max-width: 1040px;*/
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.companylists__box {
  /* width: 480px; */
  /* height: 400px;*/
  margin: 0 15px 5px;
  font-weight: bold;
}

.companylists__box--icon {
  width: 500px;
  /*padding: 0 45px;*/
  /*height: 400px;*/
  display: table-cell;
  vertical-align: middle;
}

.companylists__box--icon > img {
  width: 500px;
  height: auto;
    
}
@media only screen and (max-width: 568px) {
    .companylists__box {
  width: 90%;
}

.companylists__box--icon {
  width: 100%;
}


  .companylists__box--icon > img {
      
      width: 100%; }
}
}
.companylists__box--userName {

}

.companylists__box--userName > img {
  
}

.companylists__box--nonedisplay {
  margin: 0 10px 0;
  padding: 0 0 0 0;
}

/* ----- 導入実績　お客様の声 ----- */
.voicelists {
  max-width: 900px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: wrap;
      flex-flow: wrap;
  padding: 0 0 30px;
}

.voicelists__box{
  width: 100%;
  display: flex;
  margin: 30px 0px 30px;

  padding: 5% 0px 2.4% 0px;
  border-top: solid #aaa 1px;
}
.voicelists__box:first-child{
  border-top: none;
  margin: 0px 0px 30px;
  padding: 0px 0px 2.4% 0px;
}
@media only screen and (max-width: 568px) {
  .voicelists__box{
    display: block;
    margin: 0 auto;
  }
  .voicelists__box:first-child{
    margin: 0 auto;
  }
}
@media screen and (max-width: 778px) {
  .voicelists__box{
    display: block;
    margin: 0 auto;
  }
  .voicelists__box:first-child{
    margin: 0 auto;
  }
}

.voicelists__box--img {
  width: 350px;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--img{
    text-align: center;
    margin: 0 auto;
    width: 100%;
  }
}
@media screen and (max-width: 778px) {
  .voicelists__box--img{
    text-align: center;
    margin: 0 auto;
    width: 100%;
  }
}
.voicelists__box--img > a img{
  width: 90%;
  height: auto;
}

.voicelists__box--user{
  width:550px;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user{
    margin: 0 auto;
    width: 90%;
  }
}
@media screen and (max-width: 778px) {
  .voicelists__box--user{
    margin: 0 auto;
    width: 90%;
  }
}

.voicelists__box--user_userName{
  text-align: justify;
  font-size: 2.0rem;
  font-weight: bold;
  letter-spacing: 0.1rem;
  line-height: 2;
  margin-bottom: 5px;
}
.voicelists__box--user_userName:after{
  content:"　様";
}
.voicelists__box--user_userName span {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #d6ecd5));
  background: -webkit-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: -o-linear-gradient(transparent 60%, #d6ecd5 60%);
  background: linear-gradient(transparent 60%, #d6ecd5 60%);
  padding: 0;
}
.voicelists__box--user_userName a{
  text-decoration: none;
  color:#000;

}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_userName {
    text-align: center;
    font-size: 1.7rem;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_userName {
    text-align: center;
    font-size: 1.7rem;
  }
}

.voicelists__box--user_title{
  text-align: justify;
  /*font-size: 2.4rem;*/
/*  font-weight: bold;*/
  letter-spacing: 0.1rem;
  line-height: 1;
  margin-bottom: 10px;color:#000;
}
.voicelists__box--user_title a{
  text-decoration: none;
color:#000;
}
.voicelists__box--user_title a:hover{
  opacity: 0.7;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_title {
    text-align: center;
    font-size: 2.0rem;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_title {
    text-align: center;
    font-size: 2.0rem;
  }
}

.voicelists__box--user_type{
  display:flex;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_type {
    text-align: center;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_type {
    text-align: center;
  }
}
.voicelists__box--user_type:before{
  position: absolute;
  margin: 5px 0;
  padding: 6px 3px;
  color:#4679bd;
  border:1px solid #4679bd;
  border-radius: 6px;
  content: "業種";
}
.voicelists__box--user_type > p {
  display: block;
  text-align: left;
  position: relative;
  margin: 5px;
  padding: 5px 0 0 40px;
  font-size: 1.7rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
}

.voicelists__box--user_id{
  display:flex;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_id {
    text-align: center;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_id {
    text-align: center;
  }
}
.voicelists__box--user_id:before{
  position: absolute;
  margin: 5px 0;
  padding: 6px 3px;
  color:#4679bd;
  border:1px solid #4679bd;
  border-radius: 6px;
  content: "導入規模";
}
.voicelists__box--user_id > p {
  display: block;
  text-align: left;
  position: relative;
  margin: 5px;
  padding: 5px 0 0 75px;
  font-size: 1.7rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
}


.voicelists__box--user_service{
  display:flex;
}
@media only screen and (max-width: 568px) {
  .voicelists__box--user_service {
    text-align: center;
  }
}
@media only screen and (max-width: 778px) {
  .voicelists__box--user_service {
    text-align: center;
  }
}
.voicelists__box--user_service:before{
  position: absolute;
  margin: 5px 0;
  padding: 6px 3px;
  color:#4679bd;
  border:1px solid #4679bd;
  border-radius: 6px;
  content: "ご利用中のサービス";
}
.voicelists__box--user_service > p {
  display: block;
  text-align: left;
  position: relative;
  margin: 5px;
  padding: 5px 0 0 155px;
  font-size: 1.7rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
}


/* -----  ご利用ステップ  ----- */
.ordersteparea {
  /*background-image: url("../images/mori_bg_stripe.jpg");*/
  background-image: url("/wp-content/uploads/2018/06/mori_bg_stripe.jpg");
  background-repeat: repeat;
  padding-top: 5px;
  color: #333;
}

.ordersteparea .dottedLine {
  margin: 0px auto 15px;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .dottedLine {
    width: 100%;
  }
}

@media screen and (max-width: 778px) {
  .ordersteparea .dottedLine::before, .ordersteparea .dottedLine::after {
    /*background-image: url("../images/mori_dot_line_sp_pattern2.png");*/
    background-image: url("/wp-content/uploads/2018/06/mori_dot_line_sp_pattern2.png");
    background-repeat: repeat-x;
  }
}

@media screen and (max-width: 778px) {
  .ordersteparea .dottedLine::before {
    margin-left: 20px;
  }
}

@media screen and (max-width: 778px) {
  .ordersteparea .dottedLine::after {
    margin-right: 20px;
  }
}

.ordersteparea .underLine__topimg {
  margin-top: 65px;
}

.ordersteparea .underLine__topimg > img {
  width: 158px;
}

.ordersteparea .orderstep {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding-top: 40px;
  padding-bottom: 30px;
  height: 300px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: inherit;
  margin: 0 auto;
}

@media only screen and (min-width: 569px) {
  .ordersteparea .orderstep {
    max-width: 1080px;
    margin: 0 auto;
  }
}

@media screen and (max-width: 1024px) {
  .ordersteparea .orderstep {
    width: 90%;
  }
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep {
    padding-right: inherit;
    height: inherit;
    width: 100%;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep {
    padding-right: inherit;
    height: inherit;
    width: 100%;
  }
}

.ordersteparea .orderstep__step {
  width: 47%;
  position: relative;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step {
    width: 100%;
    position: inherit;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step {
    width: 100%;
    position: inherit;
  }
}

.ordersteparea .orderstep__step--arrow {
  max-width: 40px;
  margin-top: 90px;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--arrow {
    display: none;
    position: inherit;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--arrow {
    display: none;
    position: inherit;
  }
}

.ordersteparea .orderstep__step--title {
  position: absolute;
  top: 0;
  left: 0;
  font-family: Helvetica, sans-serif;
  font-weight: bold;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--title {
    width: 100%;
    position: inherit;
    margin: 0 auto;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--title {
    width: 100%;
    position: inherit;
    margin: 0 auto;
  }
}

.ordersteparea .orderstep__step--title_step1 {
  color: #34a02c;
  font-size: 2.2rem;
  width: 200px;
  height: 200px;
  background-color: #fff;
  -ms-flex-item-align: auto;
      align-self: auto;
  border-radius: 100px;
  border: solid #34a02c 5px;
  padding-top: 48px;
}

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


  .ordersteparea .orderstep__step--title_step1 {
    margin: 0 auto;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--title_step1 {
    margin: 0 auto;
  }
}

.ordersteparea .orderstep__step--title_step2 {
  font-size: 2.2rem;
  color: #ff9900;
  width: 200px;
  height: 200px;
  background-color: #fff;
  -ms-flex-item-align: auto;
      align-self: auto;
  border-radius: 100px;
  border: solid #ff9900 5px;
  padding-top: 48px;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--title_step2 {
    margin: 0 auto;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--title_step2 {
    margin: 0 auto;
  }
}

.ordersteparea .orderstep__step--title_string1 {
  font-size: 3.2rem;
}

.ordersteparea .orderstep__step--title_string2 {
  margin-top: 16px;
  font-size: 2.8rem;
  font-weight: 300;
}

.ordersteparea .orderstep__step--body {
  position: absolute;
  top: 30px;
  left: 240px;
  text-align: justify;
  text-justify: inter-ideograph;
  max-width: 270px;
  line-height: 1.9em;
}

@media only screen and (max-width: 568px) {
  .ordersteparea .orderstep__step--body {
    max-width: inherit;
    width: 100%;
    position: inherit;
    padding: 20px;
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .ordersteparea .orderstep__step--body {
    max-width: inherit;
    width: 600px;
    position: inherit;
    padding: 20px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}

.ordersteparea .orderstep__step--body > p {
  width: 100%;
}

.ordersteparea .orderstep__arrow {
  display: inline;
  vertical-align: middle;
}

/* -----  価格  ----- */
.pricesarea {
  padding-top: 75px;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  color: #333;
  padding: 100px 0 60px;
}

.pricesarea__trialText {
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.8rem;
  width: 100%;
  text-align: center;
  margin: 50px auto 20px;
  padding: 0 20px;
}

.pricesarea__trialbody {
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.8rem;
  width: 100%;
  text-align: center;
  margin: 50px auto 20px;
  padding: 0 20px;
}

@media only screen and (max-width: 568px) {
  .pricesarea__trialbody {
    padding: 0px;
  }
}

.pricesarea .dottedLine {
  margin: 0px auto 0px;
}

@media only screen and (max-width: 568px) {
  .pricesarea .dottedLine {
    width: 100%;
  }
}

.pricesarea .underLine {
  margin: 105px auto 20px;
}

@media only screen and (max-width: 568px) {
  .pricesarea .underLine {
    font-size: 2rem;
  }
}

.pricesareaWrapper {
  padding-top: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  width: 100%;
  margin: 0 auto;
  color: #333;
}

.pricesList {
  border-collapse: collapse;
  font-size: 1.4rem;
  max-width: 555px;
  width: 100%;
}

@media only screen and (max-width: 568px) {
  .pricesList {
    max-width: inherit;
    margin-left: inherit;
    width: 100%;
    margin: 10px 20px;
  }
}

@media screen and (max-width: 1100px) {
  .pricesList {
    max-width: 450px;
    width: 100%;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .pricesList {
    max-width: 550px;
    width: 100%;
    margin: 10px auto;
  }
}

.pricesList table {
  position: relative;
  max-width: 555px;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

@media screen and (max-width: 1100px) {
  .pricesList table {
    width: 100%;
  }
}

.pricesList table::before {
  content: '';
  border: 1px solid #4679bd;
  width: 100%;
  display: block;
  position: absolute;
  height: 100%;
}

.pricesList tr {
  height: 45px;
}

.pricesList th {
  text-align: center;
  background-color: #4679bd;
  border-left: 1px solid #e8e8e8;
  color: #fff;
  font-size: 1.6rem;
  vertical-align: middle;
}

@media only screen and (max-width: 568px) {
  .pricesList th {
    padding: 10px 0;
  }
}

.pricesList td {
  vertical-align: middle;
  border-bottom: 1px solid #e8e8e8;
  border-left: 1px solid #e8e8e8;
  font-size: 1.5rem;
}

@media only screen and (max-width: 568px) {
  .pricesList td {
    padding: 10px 0;
  }
}

.pricesList td:first-child {
  font-size: 1.6rem;
}

@media only screen and (max-width: 568px) {
  .pricesList td:first-child {
    width: 30%;
  }
}

.pricesClac {
  margin-left: 75px;
  color: #fff;
  /*background-image: url("../images/mori_clac_easy_bg.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_clac_easy_bg.png");
  background-size: 100%;
  background-repeat: no-repeat;
  background-color: #003366;
  max-width: 450px;
  width: 100%;
}

@media screen and (max-width: 1100px) {
  .pricesClac {
    margin-left: 0px;
  }
}

@media only screen and (max-width: 568px) {
  .pricesClac {
    max-width: inherit;
    width: 100%;
    margin: 20px 20px 20px 20px;
  }
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .pricesClac {
    margin-top: 30px;
    margin-left: 0px;
    max-width: 550px;
  }
}

.pricesClac__itme {
  width: 100%;
}

.pricesClac__title {
  font-size: 2.4rem;
  width: 87%;
  margin: 20px auto 25px;
  border-bottom: 1px solid #fff;
  padding: 0 0 15px 0;
  text-align: center;
}

@media only screen and (max-width: 568px) {
  .pricesClac__title {
    margin: 20px auto 10px;
  }
}

.pricesClac__title {
  font-size: 2.4rem;
  text-align: center;
}

.pricesClac__body {
  font-size: 1.4rem;
}

@media only screen and (max-width: 568px) {
  .pricesClac__body {
    text-align: left;
    line-height: 2;
    margin: 0 20px;
  }
}

.pricesClac__table--box {
  background-color: #fff;
  width: 200px;
  height: 95px;
  position: relative;
  border-radius: 5px;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table--box {
    width: 100%;
  }
}

.pricesClac__table--box01 {
  color: #333;
  font-size: 1.2rem;
  position: absolute;
  top: 12px;
  left: 12px;
}

.pricesClac__table--box02 {
  color: #4679bd;
  position: absolute;
  bottom: 28px;
  right: 32px;
}

.pricesClac__table ul {
  margin: 23px 10px;
  display: table;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul {
    display: inherit;
  }
}

.pricesClac__table ul li {
  display: table-cell;
  text-align: center;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li {
    display: inline-block;
    width: 100%;
  }
}

.pricesClac__table ul li:nth-child(2) {
  width: 45%;
  text-align: left;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li:nth-child(2) {
    width: 80%;
  }
}

.pricesClac__table ul li:nth-child(2) input {
  background-color: #fff;
  width: 200px;
  height: 40px;
  border-radius: 5px;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li:nth-child(2) input {
    width: 100%;
  }
}

.pricesClac__table ul li:nth-child(3) {
  width: 10%;
  vertical-align: bottom;
}

.pricesClac__table ul li:nth-child(1) {
  width: 36%;
  vertical-align: middle;
  font-weight: bold;
  font-size: 1.8rem;
}

@media only screen and (max-width: 568px) {
  .pricesClac__table ul li:nth-child(1) {
    width: 90%;
    margin: 0 0 20px 0;
    text-align: left;
  }
}

.pricesClac__table ul:nth-child(1) {
  margin-bottom: 25px;
}

.pricesClac__table--ordermember {
  color: #333;
  padding-left: 15px;
  -moz-appearance: textfield;
}

.pricesClac__table--ordermember::-webkit-input-placeholder {
  color: #ccc;
}

.pricesClac__table--ordermember:-ms-input-placeholder {

  color: #ccc;
}

.pricesClac__table--ordermember::-ms-input-placeholder {
  color: #ccc;
}

.pricesClac__table--ordermember::placeholder {
  color: #ccc;

}

.pricesClac__table--ordermember::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.pricesClac__table--orderpriceNum {
  font-size: 3rem;
  font-weight: bold;
  font-family: Helvetica, Arial, sans-serif;
}

/* -----  動作環境  ----- */
.operatingArea {
  width: 100%;
  margin: 0 auto;
  color: #333;
  background-color: #f8f8f8;
  text-align: center;
  padding: 70px 0 0;
}

.operatingArea__body {
  font-size: 2rem;
  width: 100%;
  text-align: center;
  margin: 20px auto;
}

.operatingArea .dottedLine {
  margin: 0px auto 0px;
}

@media only screen and (max-width: 568px) {
  .operatingArea .dottedLine {
    width: 100%;
  }
}

.operatingList {
  border-collapse: collapse;
  font-size: 1.6rem;
  max-width: 880px;
  width: 90%;
  margin: 15px auto 0;
  padding-bottom: 40px;
}

@media only screen and (max-width: 568px) {
  .operatingList {
    width: 100%;
  }
}

.operatingList table {
  position: relative;
  max-width: 870px;
  width: 100%;
  margin: 0 auto;
  border-collapse: separate;
  border-spacing: 0;
}

@media only screen and (max-width: 568px) {
  .operatingList table {
    width: 94%;
    margin: 30px auto;
  }
}

.operatingList table::before {
  content: '';
  border-top: 1px solid #999999;
  border-bottom: 1px solid #999999;
  width: 100%;
  display: block;
  position: absolute;
  height: 100%;
}

.operatingList tr {
   height: 100px;
}

.operatingList th {
  text-align: center;
  vertical-align: middle;
        font-weight: bold;
   
}

.operatingList th:first-child {
  width: 28%;
}

@media only screen and (max-width: 568px) {
  .operatingList th:first-child {
    padding: 15px 0;
    width: 45%;
  }
     
}
  .operatingList td li{display: block; margin: 3px 0;}
}

 .operatingList td ul{/*text-align: left;*/}

.operatingList th:last-child {
  width: 72%;
}

@media only screen and (max-width: 568px) {
  .operatingList th:last-child {
    width: 55%;
  }
}

.operatingList td {
  line-height: 1.6;

  padding: 12px 30px;
  vertical-align: middle;
}

@media only screen and (max-width: 568px) {
  .operatingList td {
    padding: 5px;
  }
}

.operatingList td:first-child {
  vertical-align: middle;
}

.operatingList td:last-child {
  text-align: left;
}

/* -----  感染対策  ----- */
/*#area04 ol {
    counter-reset: cnt;
    list-style: none;
	text-align: left;
}

#area04 ol li::before {
    counter-increment: cnt;
    content: counters(cnt, ".") ". ";
	line-height: 1.5em;
}
*/

#area04 ol{
  counter-reset: item;
  list-style-type: none;
  padding: 10px 20px 20px;
  text-align: left;
  max-width: 1000px;
  background: #FFF;
  margin: 0 auto;
  border-radius: 20px;
}




@media only screen and (max-width: 1040px) {
  #area04 ol{
  width: 95%;
  } }
#area04 ol ol{
  padding-left: 1em;
}
#area04 li{
  text-indent: -1.3em;
  padding-left: 1.7em;
  padding-bottom: 0.5em;
  padding-top: 0.5em;
  line-height: 1.2em;
  color: #246bc0;
  border-bottom: 1px dotted #d7d7d7;
}
#area04 li:before {
  counter-increment: item;
  content: counter(item)'.';
  /* 以下は自由に装飾... */
  padding-right: .4em;
  font-weight: bold;
  color: #246bc0;
  }

/* -----  来場登録のお申込み  ----- */
.botanlink-bg{
  counter-reset: item;
  list-style-type: none;
  padding: 5px 20px;
  max-width:470px;
  width: 40%;
  background: #F2F2F2;
  margin: 20px 20px;
  border-radius: 20px;
  display: inline-block;
}

.botanlink-bg h4 {
    font-size: 1.9rem;
    font-weight: bold;
    letter-spacing: 0.06rem;
    color: #000;
    line-height: 1.3;
}


@media only screen and (max-width: 952px) {
.botanlink-bg{
  width: 95%;
  margin: 20px auto;
  display: block;
}

  .botanlink-bg h4 {
  margin: 20px 20px;
}

}
/* -----  よくある質問  ----- */
.faq {
  width: 100%;
  background-color: #fff;
  color: #333;
  padding: 70px 0 90px;
}

@media only screen and (max-width: 568px) {
  .faq {
    padding: 70px 0 0px;
  }
}

.faq .dottedLine {
  margin: 0 auto 33px;
}

@media only screen and (max-width: 568px) {
  .faq .dottedLine {
    width: 100%;
  }
}

.faqList {
  color: #4664af;
  font-weight: bold;
  font-size: 2rem;
  width: 100%;
  max-width: 890px;
  margin: 0 auto;
  border-bottom: solid #aaa 1px;
}

@media screen and (max-width: 1100px) {
  .faqList {
    width: 100%;
  }
}

@media only screen and (max-width: 568px) {
  .faqList {
    width: 100%;
    padding: inherit;
    margin-bottom: 50px;
  }
}

.faqList__title:first-child {
  border-top: none;
}

.faqList__title {
  border-top: solid #aaa 1px;
  color: #333;
  cursor: pointer;
  margin-bottom: 20px;
  padding: 5% 20px 2.4% 113px;
  position: relative;
  font-size: 2.4rem;
  font-weight: bold;
  text-align: left;
  line-height: 1.6;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .faqList__title {
    font-size: 2rem;
    padding: 5% 30px 2.4% 113px;
  }
}

@media only screen and (max-width: 568px) {
  .faqList__title {
    font-size: 2rem;
    padding: 20px 40px 20px 74px;
  }
}

.faqList__title::before {
  /*background: url("../images/mori_faq_question_icon.png") center no-repeat;*/
  background: url("/wp-content/uploads/2018/06/mori_faq_question_icon.png") center no-repeat;
  background-size: contain;
  content: '';
  display: block;
  height: 60px;
  left: 10px;
  position: absolute;
  top: 20px;
  width: 60px;
}

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

  .faqList__title::before {
    width: 50px;
    height: 50px;
  }
}

.faqList__title > span {
  width: 20px;
  height: 15px;
  /*background-image: url("../images/mori_arrow_faq_down.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_arrow_faq_down.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 70%;
  right: 11px;
  margin-top: -12px;
  margin-left: 20px;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
}

.faqList__title > span.active {
  width: 20px;
  height: 15px;
  /*background-image: url("../images/mori_arrow_faq_down.png");*/
  background-image: url("/wp-content/uploads/2018/06/mori_arrow_faq_down.png");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 70%;
  right: 11px;
  margin-top: -12px;
  margin-left: 20px;
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.faqList__answer {
  color: #333;
  display: none;
  font-size: 1.7rem;
  font-weight: normal;
  line-height: 3rem;
  padding: 0 20px 7.8% 113px;
  position: relative;
  text-align: justify;
  text-justify: inter-ideograph;
}

@media only screen and (max-width: 568px) {
  .faqList__answer {
    padding: 20px 40px 20px 74px;
  }
}

.faqList__answer::before {
  /*background: url("../images/mori_faq_answer_icon.png") center no-repeat;*/
  background: url("/wp-content/uploads/2018/06/mori_faq_answer_icon.png") center no-repeat;
  background-size: contain;
  content: '';
  display: block;
  height: 60px;
  left: 10px;
  position: absolute;
  top: 0;
  width: 60px;
}

@media only screen and (max-width: 568px) {
  .faqList__answer::before {
    width: 50px;
    height: 50px;
  }
}

/* -----  お申し込み  ----- */
.contactForm {
  padding: 50px 0;
  background-color: #d9eeff;
}

.contactForm .dottedLine {
  margin: 0px auto 50px;
}

@media screen and (max-width: 750px) {
  .contactForm .dottedLine {
    width: 100%;
    margin: 0px auto 10px;
  }
}

@media only screen and (max-width: 568px) {
  .contactForm .dottedLine {
    width: 100%;
    margin: 0px auto 10px;
  }
}
.contactArea {
  width: 80%; 
  margin: 0 auto;
}

@media only screen and (max-width: 568px) {
  .contactArea {
    width: 100%; 
  }
}

/* -----  お問合せ完了  ----- */
.thanksarea {
 padding-top: 75px;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  color: #333;
  padding: 20px 0 0px;
}

.thanksarea__Text {
  font-size: 2rem;
  font-weight: bold;
  line-height: 2.8rem;
  width: 100%;
  text-align: center;
  margin: 20px auto 20px;
  padding: 0 20px;
}

/* -----  footer  ----- */
.footer {
  background-color: #fff;
  width: 100%;
  border-top: 1px solid #e7e7e7;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .footer {
    height: inherit;
  }
}

@media only screen and (max-width: 568px) {
  .footer {
    height: inherit;
  }
}

.footerArea {
  max-width: 1240px;
  margin: 0 auto;
  position: relative;
  color: #333;
  text-align: left;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media only screen and (min-width: 662px) and (max-width: 980px) {
  .footerArea {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

@media only screen and (max-width: 662px) {
  .footerArea {
    width: 100%;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

.footerArea__icon {
  margin: 20px 26px;
  width: 75px;
  display: inline-block;
  position: relative;
}

@media only screen and (min-width: 662px) and (max-width: 980px) {
  .footerArea__icon {
    margin: 20px 20px 20px 10px;
  }
}


@media only screen and (max-width: 662px) {
.footerArea__icon {
    margin: 20px auto 0;
    display: block;
    text-align: center;
}
}

.footerArea__icon img {
  width: 75px;
}

.footerArea__text {
  position: relative;
  line-height: 2rem;
  padding: 15px 0;
  font-size: 1.5rem;
  letter-spacing: 1px;
  width: 40%;
  display: inline-block;
}

@media only screen and (min-width: 662px) and (max-width: 980px) {
  .footerArea__text {
    font-size: 1.3rem;
    width: calc(100% - 105px);
  }
}

@media only screen and (max-width: 662px) {
  .footerArea__text {
    width: 100%;
    display: block;
      text-align: center;
        padding: 0;
  }
}

.footerArea__text--url {
  text-decoration: none;
  color: #333;
}

.footerArea__copy {
  display: inline-block;
  text-align: center;
  position: relative;
  margin: 5px 26px;
  padding: 5px 0 0 0;
  width: calc(100% - 0px);
  line-height: 2rem;
  letter-spacing: 1px;
  font-size: 1.5rem;
}

@media only screen and (min-width: 569px) and (max-width: 980px) {
  .footerArea__copy {
    width: 100%;
    right: inherit;
    font-size: 1.3rem;
    text-align: center;
    padding: 20px 0;
  }
}

@media only screen and (max-width: 568px) {
  .footerArea__copy {
    width: 100%;
    right: inherit;
    font-size: 1.3rem;
    text-align: center;
    padding: 20px 0;
  }
}

/* -----  概要  ----- */
.topcontent-top{
  position:relative;
    width:100%;
    margin: 0 auto;


  }
@media only screen and (max-width: 568px) {
    .topcontent-top{
    width:100%;
  }
}

/* -----  特徴  ----- */
.topcontent{
    position:relative;
    max-width: 1000px;
    width:100%;
    margin: 0 auto 50px;
    padding: 20px 15px;
    background:#FFFFFF;

    border-radius:10px;
    box-shadow:0 0 8px #aaa;
  }
@media only screen and (max-width: 568px) {
    .topcontent{
    width:100%;
  }
}
/* -----  詳細  ----- */

dl.area03 {
    text-align: left;
    margin: 0 auto 42px;
    max-width: 1000px;
    padding: 0 20px;
}
dt{font-weight: bold;
margin: 5px 0 ;}
dd{margin-bottom: 20px;}
/* -----  バリエーション  ----- */
/* -----  スペック・サイズ  ----- */
.link1{
 /* font-size: 2rem;*/
  font-weight: bold;
  margin:20px 0 0px;
}
.link1 > a{
  text-decoration: none;
}
.link1--item {
display: block;
    margin: 10px auto;
    width: 400px;
    height: 60px;
    line-height: 50px;
    text-align: center;
    color: #004da2;
    background-color: #ffffff;
    border: 4px solid #004da2;
    border-radius: 5px;
    transition: .5s;
}
}

.link1--item:hover {
  background-color: #8ac3ff;
  border: 4px solid #004da2;
}


.link2{
  font-size: 2rem;
  font-weight: bold;
  margin:20px 0 0px;
}
.link2 > a{
  text-decoration: none;
}
.link2--item {
  display: inline-block;
  margin:10px;
  width: 300px;
  height:60px;
  line-height: 60px;
  text-align: center;
  color: #fff;
  background-color: #004da2;
  border-bottom: 6px solid #002853;
  border-radius: 5px;
  transition: .5s;
}

.link2--item:hover {
  background-color: #8ac3ff;
  border-bottom: 6px solid #002853;
}

/* -----  ダウンロード  ----- */
.link{
  font-size: 2rem;
  font-weight: bold;
  margin: 5px 0 30px;
}
.link > a{
  text-decoration: none;
}
.link--item {
  display: inline-block;
  /* margin:10px; */
  width: 260px;
  height:60px;
  line-height: 60px;
  text-align: center;
  color: #fff;
  background-color: #4caf50;
  border-bottom: 6px solid #264c28;
  border-radius: 100px;
  transition: .5s;
}

.link--item:hover {
  background-color: #8BC34A;
  border-bottom: 6px solid #333;
}
/* -----  フォーム  ----- */
input[type="radio"] {text-align: left;}
}

#satori__creative_container *, #satori__creative_container :after, #satori__creative_container :before, #satori__form_container *, #satori__form_container :after, #satori__form_container :before, #satori__html_part_container *, #satori__html_part_container :after, #satori__html_part_container :before {

    text-align: left;
}

/* 表示 ----------------------- */
.pc {

}

@media screen and (min-width: 768px) {
.sp {
	display: none;
}
}
@media screen and (max-width: 767px) {
.pc {
	display: none;
}
	
/*------------------------------------------------------------
微調整
------------------------------------------------------------*/

/* margin ----------------------- */
.mg0{ margin:0 !important;}
.mg5{ margin:5px !important;}
.mg10{ margin:10px !important;}
.mg15{ margin:15px !important;}
.mg20{ margin:20px !important;}
.mg25{ margin:25px !important;}
.mg30{ margin:30px !important;}
.mg35{ margin:35px !important;}
.mg40{ margin:40px !important;}
.mg45{ margin:45px !important;}
.mg50{ margin:50px !important;}
.mt0{ margin-top:0 !important;}
.mt5{ margin-top:5px !important;}
.mt10{ margin-top:10px !important;}
.mt15{ margin-top:15px !important;}
.mt20{ margin-top:20px !important;}
.mt25{ margin-top:25px !important;}
.mt30{ margin-top:30px !important;}
.mt35{ margin-top:35px !important;}
.mt40{ margin-top:40px !important;}
.mt45{ margin-top:45px !important;}
.mt50{ margin-top:50px !important;}
.mr0{ margin-right:0 !important;}
.mr5{ margin-right:5px !important;}
.mr10{ margin-right:10px !important;}
.mr15{ margin-right:15px !important;}
.mr20{ margin-right:20px !important;}
.mr25{ margin-right:25px !important;}
.mr30{ margin-right:30px !important;}
.mr35{ margin-right:35px !important;}
.mr40{ margin-right:40px !important;}
.mr45{ margin-right:45px !important;}
.mr50{ margin-right:50px !important;}
.mb0{ margin-bottom:0 !important;}
.mb5{ margin-bottom:5px !important;}
.mb10{ margin-bottom:10px !important;}
.mb15{ margin-bottom:15px !important;}
.mb20{ margin-bottom:20px !important;}
.mb25{ margin-bottom:25px !important;}
.mb30{ margin-bottom:30px !important;}
.mb35{ margin-bottom:35px !important;}
.mb40{ margin-bottom:40px !important;}
.mb45{ margin-bottom:45px !important;}
.mb50{ margin-bottom:50px !important;}
.ml0{ margin-left:0 !important;}
.ml5{ margin-left:5px !important;}
.ml10{ margin-left:10px !important;}
.ml15{ margin-left:15px !important;}
.ml20{ margin-left:20px !important;}
.ml25{ margin-left:25px !important;}
.ml30{ margin-left:30px !important;}
.ml35{ margin-left:35px !important;}
.ml40{ margin-left:40px !important;}
.ml45{ margin-left:45px !important;}
.ml50{ margin-left:50px !important;}

/* padding ----------------------- */
.pd0{ padding:0 !important;}
.pd5{ padding:5px !important;}
.pd10{ padding:10px !important;}
.pd15{ padding:15px !important;}
.pd20{ padding:20px !important;}
.pd25{ padding:25px !important;}
.pd30{ padding:30px !important;}
.pd35{ padding:35px !important;}
.pd40{ padding:40px !important;}
.pd45{ padding:45px !important;}
.pd50{ padding:50px !important;}
.pt0{ padding-top:0 !important;}
.pt5{ padding-top:5px !important;}
.pt10{ padding-top:10px !important;}
.pt15{ padding-top:15px !important;}
.pt20{ padding-top:20px !important;}
.pt25{ padding-top:25px !important;}
.pt30{ padding-top:30px !important;}
.pt35{ padding-top:35px !important;}
.pt40{ padding-top:40px !important;}
.pt45{ padding-top:45px !important;}
.pt50{ padding-top:50px !important;}
.pr0{ padding-right:0 !important;}
.pr5{ padding-right:5px !important;}
.pr10{ padding-right:10px !important;}
.pr15{ padding-right:15px !important;}
.pr20{ padding-right:20px !important;}
.pr25{ padding-right:25px !important;}
.pr30{ padding-right:30px !important;}
.pr35{ padding-right:35px !important;}
.pr40{ padding-right:40px !important;}
.pr45{ padding-right:45px !important;}
.pr50{ padding-right:50px !important;}
.pb0{ padding-bottom:0 !important;}
.pb5{ padding-bottom:5px !important;}
.pb10{ padding-bottom:10px !important;}
.pb15{ padding-bottom:15px !important;}
.pb20{ padding-bottom:20px !important;}
.pb25{ padding-bottom:25px !important;}
.pb30{ padding-bottom:30px !important;}
.pb35{ padding-bottom:35px !important;}
.pb40{ padding-bottom:40px !important;}
.pb45{ padding-bottom:45px !important;}
.pb50{ padding-bottom:50px !important;}
.pl0{ padding-left:0 !important;}
.pl5{ padding-left:5px !important;}
.pl10{ padding-left:10px !important;}
.pl15{ padding-left:15px !important;}
.pl20{ padding-left:20px !important;}
.pl25{ padding-left:25px !important;}
.pl30{ padding-left:30px !important;}
.pl35{ padding-left:35px !important;}
.pl40{ padding-left:40px !important;}
.pl45{ padding-left:45px !important;}
.pl50{ padding-left:50px !important;}