* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, main, section, summary {
  display: block;
}

audio, canvas, video {
  display: inline-block;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden] {
  display: none;
}

html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-line-break: strict;
  -webkit-word-break: break-strict;
  font-family: sans-serif;
  line-break: strict;
  word-break: break-strict;
}

a:focus {
  outline: thin dotted;
}

a:active, a:hover {
  outline-width: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b {
  font-weight: 700;
}

strong {
  font-weight: 400;
}

dfn {
  font-style: italic;
}

mark {
  background: #ff0;
  color: #000;
}

a {
  text-decoration: none;
}

ol, ul {
  list-style: none;
}

code, kbd, pre, samp {
  font-family: monospace,serif;
  font-size: 1em;
}

pre {
  word-wrap: break-word;
  white-space: pre;
  white-space: pre-wrap;
}

q {
  quotes: "\201C" "\201D" "\2018" "\2019";
}

small {
  font-size: 80%;
}

sub, sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sup {
  top: -.5em;
}

sub {
  bottom: -.25em;
}

img {
  max-width: 100%;
  height: auto;
  border: 0;
  vertical-align: middle;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 0;
}

fieldset {
  margin: 0 2px;
  padding: .35em .625em .75em;
  border: 1px solid silver;
}

legend {
  padding: 0;
  border: 0;
}

button, input, select, textarea {
  margin: 0;
  font-family: inherit;
  font-size: 100%;
}

button, input {
  line-height: normal;
}

button, html input[type=button], input[type=reset], input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled], input[disabled] {
  cursor: default;
}

input[type=checkbox], input[type=radio] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 0;
}

input[type=search] {
  -webkit-appearance: textfield;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

button::-moz-focus-inner, input::-moz-focus-inner {
  padding: 0;
  border: 0;
}

textarea {
  overflow: auto;
  vertical-align: top;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

*:focus {
  outline: none;
}

/* Common */
html {
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: unset;
  position: relative;
  width: 100%;
  height: 100%;
  font-size: 62.5%;
}

body {
  position: relative;
  width: 100%;
  height: 100%;
  color: #333;
  font-size: 1.4rem;
  line-height: 1;
  text-align: center;
}

a,
a:link,
a:hover,
a:visited,
a:focus {
  outline: none;
}

@-webkit-keyframes shine {
  50% {
    opacity: 1;
  }
  100% {
    left: 55%;
  }
}

@keyframes shine {
  50% {
    opacity: 1;
  }
  100% {
    left: 55%;
  }
}

.header .inner {
  padding: 0 1rem;
}

.mainvisual {
  max-width: 148rem;
  margin-right: auto;
  margin-left: auto;
  background: url(../img/mainv_bg.jpg) no-repeat center top;
  background-size: auto 100%;
}

.mainvisual__inner {
  max-width: 148rem;
  max-width: 100rem;
  margin-right: auto;
  margin-left: auto;
  padding: 0 1rem;
  text-align: left;
}

.mainvisual__inner p {
  -webkit-transform: translateY(-1rem);
          transform: translateY(-1rem);
}

.mainvisual .conversiton__button {
  max-width: 62rem;
}

.lead {
  max-width: 148rem;
  margin-right: auto;
  margin-left: auto;
  background: url(../img/worry_bg.jpg) no-repeat center top;
  background-size: auto 100%;
}

.feature {
  max-width: 148rem;
  margin-right: auto;
  margin-left: auto;
  padding: 1.6rem 1rem;
  background: url(../img/cometrue_bg.jpg) repeat left top;
}

.feature div + div {
  margin-top: 1rem;
}

.conversiton {
  max-width: 148rem;
  margin-right: auto;
  margin-left: auto;
  background: #0074bf;
}

.conversiton__button {
  display: block;
  max-width: 91.3rem;
  margin: 1rem 0;
}

.case__title {
  padding: 0 1rem;
  background: url(../img/case_bg.jpg) no-repeat center top;
  background-size: auto 100%;
}

.case div + div {
  padding: 0 1rem;
}

.voice {
  max-width: 148rem;
  margin-right: auto;
  margin-left: auto;
  background: #007bc1;
}

.voice div:first-of-type {
  padding: 0 .7rem;
}

.cando div:first-of-type {
  padding: 0 1rem;
}

.footer {
  padding: 1rem;
}

.footer__logo {
  max-width: 16rem;
  margin-bottom: 1rem;
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}

@media screen and (min-width: 768px) {
  .header .inner {
    padding: 0 2rem;
  }
  .mainvisual__inner {
    padding: 0 0;
  }
  .mainvisual__inner p {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  .feature {
    padding: 3.5rem 2rem 7rem;
  }
  .feature div + div {
    margin-top: 2rem;
  }
  .case div + div {
    padding: 0 2rem;
  }
  .voice div:first-of-type {
    padding: 0 1.24rem;
  }
  .cando div:first-of-type {
    padding: 0 2rem;
  }
  .footer {
    padding: 2rem;
  }
}

@media screen and (min-width: 1160px) {
  .header .inner {
    padding: 0 0;
  }
  .conversiton__button {
    -webkit-transform: perspective(1px) translateZ(0);
    -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.5s;
    display: inline-block;
    position: relative;
    margin: 1rem 0;
    overflow: hidden;
            transform: perspective(1px) translateZ(0);
            box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    vertical-align: middle;
            transition-duration: 0.5s;
  }
  .conversiton__button:hover, .conversiton__button:focus, .conversiton__button:active {
    -webkit-transform: scale(1.16);
    -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
            transform: scale(1.16);
            transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  }
  .conversiton__button:before {
    -webkit-transform: skewX(-25deg);
    display: block;
    z-index: 2;
    position: absolute;
    top: 0;
    left: -12%;
    width: 40%;
    height: 100%;
            transform: skewX(-25deg);
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.4)));
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 100%);
    content: '';
    opacity: 0;
  }
  .conversiton__button:hover::before {
    -webkit-animation: shine .34s;
            animation: shine .34s;
  }
  .feature {
    padding-right: 0;
    padding-left: 0;
  }
  .case div + div {
    padding: 0 0;
  }
  .voice div:first-of-type {
    padding: 0 0;
  }
  .cando div:first-of-type {
    padding: 0 0;
  }
  .footer {
    padding: 3rem 0 2rem;
  }
  .footer__logo {
    max-width: 22rem;
    margin-bottom: 2rem;
  }
}
