@charset "UTF-8";
/* --------------------------------------------------
Contants
-------------------------------------------------- */
body #wrapper #contents { padding: 0 24px; }
body #wrapper #contents #article-wrap article .card-elm .label { font-weight: 500; font-size: 1.6rem; line-height: 1.5; letter-spacing: 1px; margin: 0 0 16px; }
body #wrapper #contents #article-wrap article .card-elm .card { background: #FFFFFF; padding: 32px 24px; border: 1px solid #E3E3F3; border-radius: 8px; box-sizing: border-box; }
body #wrapper #contents #article-wrap article .article-main { margin: 0 0 64px; }
body #wrapper #contents #article-wrap article .article-main .mainimage { margin: 0 0 12px; }
body #wrapper #contents #article-wrap article .article-main .textarea { margin: 0 0 32px; }
body #wrapper #contents #article-wrap article .article-main .textarea p { font-size: 1.4rem; line-height: 1.71; letter-spacing: 1px; }
body #wrapper #contents #article-wrap article .article-main .textarea p b { font-weight: 500; }
body #wrapper #contents #article-wrap article .article-main .textarea p + p { margin: 12px 0 0; }
body #wrapper #contents #article-wrap article .article-main .table-of-contents { padding: 32px 24px; background: #F3F4F7; border-radius: 8px; margin: 0 0 32px; }
body #wrapper #contents #article-wrap article .article-main .table-of-contents .label { font-weight: 700; font-size: 2rem; line-height: 1.6; letter-spacing: 1px; margin: 0 0 24px; }
body #wrapper #contents #article-wrap article .article-main .table-of-contents ul { counter-reset: num; }
body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li { counter-increment: num; font-weight: 500; font-size: 1.6rem; line-height: 1.5; letter-spacing: 1px; padding: 0 0 0 37px; position: relative; }
body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li a { color: #4A4CEE; font-size: 1.4rem; line-height: 1.71; letter-spacing: 1px; }
body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li::before { display: block; content: counter(num,decimal-leading-zero) "."; position: absolute; top: 0; left: 0; font-family: "Inter", sans-serif; font-weight: 700; }
body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li + li { margin: 16px 0 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea h5 { font-weight: 500; font-size: 1.6rem; line-height: 1.5; letter-spacing: 1px; margin: 0 0 16px; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p { font-size: 1.4rem; line-height: 1.71; letter-spacing: 1px; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p .name { font-weight: 500; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p .name.aqua { color: #67A2FD; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p .name.blue { color: #4A4CEE; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p b { font-weight: 700; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p strong { font-weight: 700; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p .textlink i { width: 14px; display: inline-block; margin: 0 3px; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p + p { margin: 12px 0 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea figure { margin: 32px 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea figure img { width: auto; max-width: 100%; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea figure figcaption { color: #777777; font-size: 1.2rem; line-height: 1.57; letter-spacing: 1px; margin: 8px 0 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea .comment p:first-child { margin-left: 2em; text-indent: -2em; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea .comment p:not(body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea .comment p:first-child) { margin-left: 2em; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea .comment + .comment { margin: 12px 0 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm { margin: 24px 0 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card .icon { width: 48px; background: #FFFFFF; border-radius: 50%; box-shadow: 0px 8px 16px rgba(83, 74, 238, 0.16); margin: 0 0 24px; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card p, body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card ul li { font-weight: 500; font-size: 1.6rem; line-height: 1.5; letter-spacing: 1px; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card ul li { position: relative; padding: 0 0 0 1em; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card ul li::before { display: block; content: "・"; position: absolute; top: 0; left: 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card ul li + li { margin: 16px 0 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm.point .card { background: #F1F6FE; border: none; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm.effect .card { background: #D1E2FB; border: none; }
body #wrapper #contents #article-wrap article .article-main .section-wrap .section + .section { margin: 32px 0 0; }
body #wrapper #contents #article-wrap article .article-main .section-wrap + .section-wrap { margin: 48px 0 0; }
body #wrapper #contents #article-wrap article .article-foot .card-elm .card { box-shadow: 0px 10px 30px rgba(83, 74, 238, 0.04); border-color: #ECEFF6; }
body #wrapper #contents #article-wrap article .article-foot .card-elm + .card-elm { margin: 32px 0 0; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex { display: flex; align-items: center; margin: 0 0 16px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .imagearea { width: 100px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea { flex: 1; margin: 0 0 0 16px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea .company { font-weight: 500; font-size: 1.4rem; line-height: 1.71; letter-spacing: 1px; margin: 0 0 4px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea .department { color: #777777; font-size: 1.2rem; line-height: 1.67; letter-spacing: 1px; margin: 0 0 12px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea .name { font-weight: 500; font-size: 1.6rem; line-height: 1.5; letter-spacing: 1px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .text { font-size: 1.4rem; line-height: 1.71; letter-spacing: 1px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card .logo { margin: 0 0 16px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dt { color: #777777; font-weight: 500; font-size: 1.2rem; line-height: 1.67; letter-spacing: 1px; margin: 0 0 8px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd { font-size: 1.4rem; line-height: 1.71; letter-spacing: 1px; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd a { color: #4A4CEE; word-break: break-all; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd i { width: 14px; display: inline-block; margin: 0 0 0 1em; vertical-align: middle; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd.client { font-size: 1.6rem; line-height: 1.5; }
body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd + dt { margin-top: 16px; }
body #wrapper #contents #interview { padding: 64px 0; }

body #wrapper #contents .descbox {
  border: 1px solid #E3E3F3;
  border-radius: 8px;
  margin: 30px 0;
  padding: 24px 24px;
}
body #wrapper #contents .descbox .descbox-list {
  font-size: 1.3rem;
  line-height: 1.6;
}
body #wrapper #contents .descbox .descbox-list + .descbox-list {
  margin-top: 1.2em;
}
body #wrapper #contents .descbox .descbox-list dt {
  font-weight: bold;
  margin-bottom: 0.2em;
}

@media screen and (min-width: 768px) { body #wrapper #contents { width: 1120px; max-width: 96%; margin: 0 auto; padding: 0; }
  body #wrapper #contents #article-wrap article .card-elm .label { font-weight: 700; font-size: 2rem; line-height: 1.6; }
  body #wrapper #contents #article-wrap article .card-elm .card { padding: 32px; }
  body #wrapper #contents #article-wrap article .article-main .mainimage { margin: 0 0 16px; }
  body #wrapper #contents #article-wrap article .article-main .textarea { margin: 0 0 64px; }
  body #wrapper #contents #article-wrap article .article-main .textarea p { font-size: 1.6rem; line-height: 1.75; }
  body #wrapper #contents #article-wrap article .article-main .textarea p + p { margin: 12px 0 0; }
  body #wrapper #contents #article-wrap article .article-main .table-of-contents { padding: 48px; margin: 0 0 64px; }
  body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li { display: flex; align-items: flex-start; }
  body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li .section-title { line-height: 1.75; width: 183px; box-sizing: border-box; margin: 0 29px 0 0; }
  body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li .section-sub { flex: 1; }
  body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li .section-sub .sub-title { font-size: 1.6rem; line-height: 1.75; }
  body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li .section-sub .sub-title a { text-decoration: underline; }
  body #wrapper #contents #article-wrap article .article-main .table-of-contents ul li .section-sub .sub-title + .sub-title { margin: 16px 0 0; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea h5 { font-weight: 700; font-size: 2rem; line-height: 1.6; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea p { font-size: 1.6rem; line-height: 1.75; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .textarea figure figcaption { font-size: 1.4rem; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm { margin: 32px 0 0; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card { display: flex; align-items: flex-start; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card .icon { width: 64px; margin: 0 32px 0 0; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card p, body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card ul { flex: 1; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card p, body #wrapper #contents #article-wrap article .article-main .section-wrap .section .card-elm .card ul li { font-weight: 700; font-size: 2rem; line-height: 1.6; }
  body #wrapper #contents #article-wrap article .article-main .section-wrap + .section-wrap { margin: 64px 0 0; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm + .card-elm { margin: 48px 0 0; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .imagearea { width: 120px; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea { margin: 0 0 0 45px; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea .company { font-size: 1.6rem; line-height: 1.75; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea .department { font-size: 1.4rem; line-height: 1.57; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .flex .textarea .name { font-weight: 400; font-size: 2rem; line-height: 1.6; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.planer .card .text { font-size: 1.6rem; line-height: 1.75; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl { display: flex; flex-wrap: wrap; margin: 0 0 -12px; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dt { font-size: 1.4rem; line-height: 1.57; margin: 0; width: 95px; margin: 0 0 12px; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd { font-size: 1.6rem; line-height: 1.75; width: calc(100% - 95px); margin: 0 0 12px; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd.client { font-size: 2rem; line-height: 1.6; }
  body #wrapper #contents #article-wrap article .article-foot .card-elm.client .card dl dd + dt { margin-top: 0; }
  body #wrapper #contents #interview { padding: 100px 0; }
  body #wrapper #contents .descbox .descbox-list {
    font-size: 1.6rem;
  }
}

  body #wrapper #contents .movie-frame {
    position: relative;
    overflow: hidden;
    height: 0;
    margin: 32px 0;
    padding: 0 0 56.25%;
  }
  body #wrapper #contents .movie-frame iframe {
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
  }

  body #wrapper #contents .article-foot .card-elm .card + .card {
    margin-top: 12px;
  }
/* --------------------------------------------------
Each
-------------------------------------------------- */
body #wrapper #contents #article-wrap article#interview-01 .article-foot .card-elm.client .card .logo { width: 160px; }

body #wrapper #contents #article-wrap article#interview-02 .article-foot .card-elm.client .card .logo { width: 160px; }

body #wrapper #contents #article-wrap article#interview-03 .article-foot .card-elm.client .card .logo { width: 160px; }

body #wrapper #contents #article-wrap article#interview-04 .article-foot .card-elm.client .card .logo { width: 160px; }

body #wrapper #contents #article-wrap article#interview-06 .article-foot .card-elm.client .card .logo { width: 180px;max-width: 100%; }

body #wrapper #contents #article-wrap article#interview-06 .article-foot .card-elm.client .card .logo.sub { width: 260px;max-width: 100%; }

body #wrapper #contents #article-wrap article#interview-08 .article-foot .card-elm.client .card .logo { width: 180px;max-width: 100%; }
body #wrapper #contents #article-wrap article#interview-09 .article-foot .card-elm.client .card .logo { width: 200px;max-width: 100%; }
body #wrapper #contents #article-wrap article#interview-10 .article-foot .card-elm.client .card .logo { width: 320px;max-width: 100%; }
body #wrapper #contents #article-wrap article#interview-11 .article-foot .card-elm.client .card .logo { width: 230px;max-width: 100%; }
body #wrapper #contents #article-wrap article#interview-12 .article-foot .card-elm.client .card .logo { width: 80px;max-width: 100%; }
body #wrapper #contents #article-wrap article#interview-13 .article-foot .card-elm.client .card .logo { width: 110px;max-width: 100%; }