@charset "UTF-8";
/* =======================================
 reset
======================================= */
/***
    The new CSS reset - version 1.5.1 (last updated 1.3.2022)
    GitHub page: https://github.com/elad2412/the-new-css-reset
***/
*:where(:not(iframe, canvas, img, svg, video):not(svg *, symbol *)) {
  all: unset;
  display: revert;
}

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

a, button {
  cursor: revert;
}

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

img {
  vertical-align: bottom;
}

table {
  border-collapse: collapse;
}

textarea {
  white-space: revert;
}

meter {
  appearance: revert;
}

::placeholder {
  color: unset;
}

:where([hidden]) {
  display: none;
}

:where([contenteditable]) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
}

:where([draggable="true"]) {
  -webkit-user-drag: element;
}

/*chromeの補完機能OFF*/
input:-webkit-autofill {
  transition: background-color 5000s ease-in-out 0s !important;
}

:focus {
  outline: 0;
}

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

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

/* =======================================
 base style
======================================= */
html {
  -webkit-text-size-adjust: 100% !important;
}

body {
  background: #fff;
  line-height: 1;
  margin: auto;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  body {
    font-size: 1.333vw;
  }
}

@media only screen and (min-width: 1200px) {
  body {
    font-size: 16px;
    min-width: 1200px;
  }
}

img {
  width: 100%;
}

a {
  text-decoration: none;
}

@media only screen and (min-width: 768px) {
  a:hover img {
    opacity: 0.8;
  }
}

strong {
  font-weight: bold;
}

@media only screen and (min-width: 768px) {
  .none-pc {
    display: none !important;
  }
}

@media only screen and (max-width: 767px) {
  .none-sp {
    display: none !important;
  }
}

.wrapper {
  overflow: hidden;
}

.inner {
  position: relative;
}

@media only screen and (min-width: 768px) {
  .inner {
    margin: auto;
    max-width: 1000px;
    width: 83.333%;
  }
}

@media only screen and (min-width: 768px) {
  .fv {
    background: url(../img/fv_bg_pc.jpg) 50% 0/auto 100% no-repeat;
  }
}

@media only screen and (min-width: 768px) {
  .fv-main {
    width: 57%;
  }
}

@media only screen and (min-width: 768px) {
  .fv-list {
    width: 53%;
  }
}

@media only screen and (min-width: 768px) {
  .intro {
    background: url(../img/intro_bg_pc.jpg) 50% 0/auto 100% no-repeat;
  }
}

.cv {
  background: 50% 0 no-repeat #a9ddf3;
}

@media only screen and (max-width: 767px) {
  .cv {
    background-size: 100% auto;
  }
}

@media only screen and (min-width: 768px) {
  .cv {
    background-size: auto 100%;
  }
}

@media only screen and (max-width: 767px) {
  .cv-inner {
    padding: 9.6vw 0 9.333vw;
  }
}

@media only screen and (min-width: 768px) {
  .cv-inner {
    padding: 4.875em 0 2.875em;
  }
}

@media only screen and (max-width: 767px) {
  .cv-lead {
    margin: 0 auto 2.4vw 21.6vw;
    width: 68.267vw;
  }
}

@media only screen and (min-width: 768px) {
  .cv-lead {
    margin: 0 auto 1em 27.5%;
    width: 44.8%;
  }
}

.cv-icon {
  position: absolute;
  z-index: 5;
}

@media only screen and (max-width: 767px) {
  .cv-icon {
    left: 6.4vw;
    top: 4.533vw;
    width: 13.867vw;
  }
}

@media only screen and (min-width: 768px) {
  .cv-icon {
    left: 5.4%;
    top: 3.25em;
    width: 12%;
  }
}

@media only screen and (max-width: 767px) {
  .cv-btn {
    margin: 0 auto 6vw;
    width: 93.067vw;
  }
}

@media only screen and (min-width: 768px) {
  .cv-btn {
    margin: 0 auto 2.625em;
    width: 72%;
  }
}

@media only screen and (max-width: 767px) {
  .cv-btn img {
    box-shadow: 0.667vw 0.667vw 0.667vw rgba(0, 0, 0, 0.2);
    border-radius: 1.333vw;
  }
}

@media only screen and (min-width: 768px) {
  .cv-btn img {
    box-shadow: 0.313em 0.313em 0.313em rgba(0, 0, 0, 0.2);
    border-radius: 0.625em;
  }
}

@media only screen and (min-width: 768px) {
  .cv-present {
    margin: auto;
    width: 90%;
  }
}

@media only screen and (max-width: 767px) {
  .cv01 {
    background-image: url(../img/cv01_bg_sp.jpg);
  }
}

@media only screen and (min-width: 768px) {
  .cv01 {
    background-image: url(../img/cv01_bg_pc.jpg);
  }
}

@media only screen and (max-width: 767px) {
  .cv02 {
    background-image: url(../img/cv02_bg_sp.jpg);
  }
}

@media only screen and (min-width: 768px) {
  .cv02 {
    background-image: url(../img/cv02_bg_pc.jpg);
  }
}

.trouble {
  background: no-repeat #f2f2f2;
}

@media only screen and (max-width: 767px) {
  .trouble {
    background-image: url(../img/trouble_bg_sp.png);
    background-position: 0 100%;
    background-size: 100% auto;
  }
}

@media only screen and (min-width: 768px) {
  .trouble {
    background-image: url(../img/trouble_bg_pc.jpg);
    background-position: 50% 0;
    background-size: 125em auto;
  }
}

@media only screen and (max-width: 767px) {
  .trouble-inner {
    padding: 0 0 16.533vw;
  }
}

@media only screen and (min-width: 768px) {
  .trouble-inner {
    padding: 6.25em 0 4.875em;
  }
}

@media only screen and (min-width: 768px) {
  .trouble-title {
    margin-bottom: 3.125em;
  }
}

.trouble-list {
  display: flex;
  flex-wrap: wrap;
}

@media only screen and (max-width: 767px) {
  .trouble-list {
    margin: 0 3.2vw;
  }
}

@media only screen and (min-width: 768px) {
  .trouble-list {
    justify-content: center;
  }
}

@media only screen and (max-width: 767px) {
  .trouble-list li {
    margin: 0 1.733vw 3.467vw;
    width: 43.2vw;
  }
}

@media only screen and (min-width: 768px) {
  .trouble-list li {
    margin: 0 1em 2.375em;
    width: 16.375em;
  }
}

.assure {
  background: #29abe2;
}

@media only screen and (min-width: 768px) {
  .assure-main {
    background: url(../img/assure_bg_pc.jpg) 50% 0/auto 100% no-repeat #fff;
  }
}

@media only screen and (min-width: 768px) {
  .service {
    background: url(../img/service_bg_pc.jpg) 50% 0/auto 100% no-repeat;
  }
}

.movie {
  background: url(../img/movie_bg.jpg) 50% 100% no-repeat;
}

@media only screen and (max-width: 767px) {
  .movie {
    background-size: auto 25vw;
    padding: 8.8vw 0 36vw;
  }
}

@media only screen and (min-width: 768px) {
  .movie {
    background-size: auto 15.625em;
    padding: 5.625em 0 21.25em;
  }
}

.movie-wrap {
  display: block;
  margin: auto;
  position: relative;
}

@media only screen and (max-width: 767px) {
  .movie-wrap {
    height: 52.667vw;
    width: 93.333vw;
  }
}

@media only screen and (min-width: 768px) {
  .movie-wrap {
    height: 29.375em;
    width: 52.125em;
  }
}

.movie-wrap iframe {
  display: block;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.works {
  background-position: 50% 0, 50% 100%;
  background-repeat: no-repeat;
}

@media only screen and (max-width: 767px) {
  .works {
    background-image: url(../img/works_bg_01_sp.png), url(../img/works_bg_02_sp.png);
    background-size: 100% auto;
    padding: 15.2vw 0 13.333vw;
  }
}

@media only screen and (min-width: 768px) {
  .works {
    background-image: url(../img/works_bg_01_pc.png), url(../img/works_bg_02_pc.png);
    background-size: 125em auto;
    padding: 7em 0 3.125em;
  }
}

@media only screen and (max-width: 767px) {
  .works-title {
    margin-bottom: 6.133vw;
  }
}

@media only screen and (min-width: 768px) {
  .works-title {
    margin-bottom: 1.875em;
  }
}

@media only screen and (min-width: 768px) {
  .works-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 1%;
  }
}

@media only screen and (max-width: 767px) {
  .works-list li {
    margin: 0 auto 6.667vw;
    width: 93.2vw;
  }
}

@media only screen and (min-width: 768px) {
  .works-list li {
    margin: 0 1.25em 2.5em;
    width: 28.125em;
  }
}

.voice {
  background-color: #bfe6f6;
  background-position: 50% 0, 50% 100%;
  background-repeat: no-repeat;
}

@media only screen and (max-width: 767px) {
  .voice {
    background-image: url(../img/voice_bg_01_sp.jpg), url(../img/voice_bg_02_sp.png);
    background-size: 100% auto;
    padding: 0 0 10.933vw;
  }
}

@media only screen and (min-width: 768px) {
  .voice {
    background-image: url(../img/voice_bg_01_pc.jpg), url(../img/voice_bg_02_pc.png);
    background-size: 125em auto;
    padding: 6.25em 0 3.438em;
  }
}

.voice-title {
  position: relative;
  z-index: 5;
}

@media only screen and (max-width: 767px) {
  .voice-title {
    margin-bottom: -4.667vw;
  }
}

@media only screen and (min-width: 768px) {
  .voice-title {
    margin-bottom: -5.625em;
  }
}

@media only screen and (max-width: 767px) {
  .voice-card-area {
    margin-bottom: 16.267vw;
  }
}

.voice-card {
  position: relative;
}

@media only screen and (max-width: 767px) {
  .voice-card {
    margin: auto;
    width: 93.2vw;
  }
  .voice-card:not(:last-child) {
    margin-bottom: 17.6vw;
  }
}

@media only screen and (min-width: 768px) {
  .voice-card {
    margin: 0 auto 5.25em;
    width: 94%;
  }
}

@media only screen and (max-width: 767px) {
  .voice-card dt {
    box-shadow: 2.613vw 2.613vw 1.96vw rgba(33, 139, 163, 0.3);
  }
}

@media only screen and (min-width: 768px) {
  .voice-card dt {
    box-shadow: 1.625em 1.625em 1.225em rgba(33, 139, 163, 0.3);
  }
}

.voice-card dd {
  position: absolute;
}

@media only screen and (max-width: 767px) {
  .voice-card dd {
    bottom: -6.933vw;
  }
}

@media only screen and (min-width: 768px) {
  .voice-card dd {
    bottom: -1.438em;
  }
}

.voice-card dd img {
  width: auto;
}

@media only screen and (max-width: 767px) {
  .voice-card dd img {
    height: 14.933vw;
  }
}

@media only screen and (min-width: 768px) {
  .voice-card dd img {
    height: 3.75em;
  }
}

.voice-card:nth-child(2n+1) dd {
  right: 0;
}

.voice-card:nth-child(2n) dd {
  left: 0;
}

@media only screen and (max-width: 767px) {
  .voice-text {
    margin: auto;
    width: 84.667vw;
  }
}

@media only screen and (min-width: 768px) {
  .voice-text {
    margin: 0.375em auto 0;
    width: 74%;
  }
}

.flow {
  background-color: #f0f0f0;
  background-image: radial-gradient(#fff 30%, transparent 20%), radial-gradient(#fff 30%, transparent 20%);
  background-position: 0 0, 3px 3px;
  background-repeat: repeat;
  background-size: 6px 6px;
}

@media only screen and (max-width: 767px) {
  .flow-wrap {
    background: url(../img/flow_bg_01_sp.png) 0 0/100% auto no-repeat;
  }
}

@media only screen and (min-width: 768px) {
  .flow-wrap {
    background-image: url(../img/flow_bg_01_pc.png), url(../img/flow_bg_02_pc.png);
    background-position: 50% 0, 50% 100%;
    background-repeat: no-repeat;
    background-size: 125em auto;
  }
}

@media only screen and (max-width: 767px) {
  .flow-cv {
    margin-bottom: 6.667vw;
  }
}

@media only screen and (min-width: 768px) {
  .flow-cv {
    margin-bottom: 1.625em;
  }
}

@media only screen and (max-width: 767px) {
  .flow-cv .cv-icon {
    top: 34.667vw;
  }
}

@media only screen and (min-width: 768px) {
  .flow-cv .cv-icon {
    left: 6.6%;
    top: 14.063em;
  }
}

@media only screen and (min-width: 768px) {
  .cv04 {
    background: url(../img/cv04_bg_pc.jpg) 50% 0/auto 100% no-repeat;
    height: 36.25em;
  }
}

@media only screen and (min-width: 768px) {
  .cv04-text {
    width: 70%;
  }
}

@media only screen and (min-width: 768px) {
  .cv04-btn {
    margin-left: 0.8%;
    width: 72.4%;
  }
}

.cv04-p {
  background: no-repeat #a9ddf3;
}

@media only screen and (max-width: 767px) {
  .cv04-p {
    background-image: url(../img/cv02_bg_sp.jpg);
    background-position: 0 -5vw;
    background-size: 100% auto;
  }
}

@media only screen and (min-width: 768px) {
  .cv04-p {
    background-image: url(../img/cv02_bg_pc.jpg);
    background-position: 50% -2em;
    background-size: 125em auto;
  }
}

@media only screen and (max-width: 767px) {
  .cv04-p-inner {
    padding: 8.8vw 0 7.2vw;
  }
}

@media only screen and (min-width: 768px) {
  .cv04-p-inner {
    padding: 2.375em 0 2em;
  }
}

@media only screen and (min-width: 768px) {
  .message {
    background-image: url(../img/msg_bg_01_pc.png), url(../img/msg_bg_02_pc.png);
    background-position: 50% 0, 50% 100%;
    background-repeat: no-repeat;
    background-size: 125em auto;
  }
}

.footer {
  background: #4d4d4d;
}

.copyright {
  border-top: 1px solid #fff;
}

.pagetop {
  position: fixed;
  z-index: 10;
}

@media only screen and (max-width: 767px) {
  .pagetop {
    bottom: 3.333vw;
    right: 3.333vw;
    width: 14.8vw;
  }
}

@media only screen and (min-width: 768px) {
  .pagetop {
    bottom: 1.25em;
    right: 1.875em;
    width: 7.5em;
  }
}

.pagetop img {
  border-radius: 50%;
}

@media only screen and (max-width: 767px) {
  .pagetop img {
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  }
}

@media only screen and (min-width: 768px) {
  .pagetop img {
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
  }
}
/*# sourceMappingURL=style.css.map */