@charset "UTF-8";
/* CSS Document */
/* CSS Document */
html {
  font: 10px/1.875 "Noto Sans JP", "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  /* 基本文字設定 */
  *font-size: small;
  /* Win IE7およびWin IE6標準準拠モード向け */
  *font: x-small;
  /* Win IE 5-5.5､6(後方互換モード)向け */
  letter-spacing: 0;
  background-color: #fff;
  color: #000;
  font-weight: normal; }

* {
  outline: none; }

a {
  color: #098BDE;
  outline: none;
  text-decoration: none;
  transition: all 300ms ease-in-out; }
  a:after {
    text-decoration: none; }
  a:hover, a:focus {
    color: #098BDE;
    opacity: 0.8; }
    a:hover img, a:focus img {
      opacity: 0.8; }
  a img {
    background: url(image/share/transparent.png);
    transition: opacity 300ms ease-in-out; }
  .main-wpcontent a {
    color: #098BDE;
    text-decoration: underline; }

.btn--link {
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
  line-height: 1; }
  @media screen and (max-width: 1160px) {
    .btn--link {
      margin: 10px 0 0;
      display: block; } }
  @media screen and (max-width: 600px) {
    .btn--link {
      margin-top: 2.667vw;
      font-size: 3.733vw; } }
  .btn--link a {
    display: flex;
    color: #000;
    justify-content: center;
    align-items: center;
    align-content: center;
    margin: 0 0 0 10px;
    padding: 5px 30px;
    border: 1px solid #BEA574;
    border-radius: 99999px; }
    @media screen and (max-width: 1160px) {
      .btn--link a {
        max-width: 300px;
        margin: 0 auto; } }
    @media screen and (max-width: 600px) {
      .btn--link a {
        padding: 2.133vw 8vw; } }
    .btn--link a::after {
      content: "";
      display: inline-block;
      background: url("../image/dtp/icon-link.svg") center center no-repeat;
      background-size: contain;
      width: 18px;
      height: 18px;
      margin: 0 0 0 5px; }
      @media screen and (max-width: 600px) {
        .btn--link a::after {
          margin-left: 1.333vw;
          width: 4.8vw;
          height: 4.8vw; } }

.voice--list {
  margin: 30px 0 0;
  padding: 40px;
  background: #FFF4F6;
  border-radius: 30px;
  box-sizing: border-box; }
  @media screen and (max-width: 600px) {
    .voice--list {
      margin-top: 5.333vw;
      padding: 8vw;
      border-radius: 8vw; } }
  .voice--list > dt {
    position: relative;
    font-size: 20px;
    font-weight: bold;
    color: #F03D61;
    text-align: left;
    line-height: 1.75;
    letter-spacing: 0.05em;
    margin: 0 0 25px;
    padding: 0 0 0 45px;
    background: url("../image/dtp/icon-voice.svg") left top no-repeat;
    background-size: 35px auto; }
    @media screen and (max-width: 600px) {
      .voice--list > dt {
        font-size: 4.267vw;
        margin-bottom: 5.333vw;
        padding-left: 10.4vw;
        background-size: 8vw auto; } }
    .voice--list > dt span {
      display: inline-block;
      font-size: 14px;
      font-weight: bold;
      line-height: 1;
      letter-spacing: 0.05em;
      color: #000;
      border: 1px solid #F03D61;
      border-radius: 5px;
      background: #fff;
      box-sizing: border-box;
      margin: 0 0 0 10px;
      padding: 5px 15px; }
      @media screen and (max-width: 600px) {
        .voice--list > dt span {
          font-size: 3.2vw;
          border-radius: 1.333vw;
          margin: 0;
          padding: 1.6vw 3.2vw; } }
  .voice--list > dd {
    font-size: 16px;
    text-align: justify;
    text-justify: inter-ideograph;
    line-height: 1.875;
    margin: 0;
    padding: 0; }
    @media screen and (max-width: 600px) {
      .voice--list > dd {
        font-size: 3.733vw; } }

.btn--contact {
  margin: 70px 0 0;
  text-align: center; }
  @media screen and (max-width: 600px) {
    .btn--contact {
      margin-top: 13.333vw; } }
  .btn--contact a {
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    line-height: 1;
    letter-spacing: 0.05em;
    max-width: 564px;
    height: 85px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    background: #BEA574;
    border-radius: 99999px;
    box-shadow: 0px 5px 0px rgba(0, 0, 0, 0.16);
    margin: 0 auto;
    padding: 0; }
    @media screen and (max-width: 600px) {
      .btn--contact a {
        font-size: 5.333vw;
        max-width: inherit;
        height: 21.067vw;
        box-shadow: 0px 1.333vw 0px rgba(0, 0, 0, 0.16); } }

#mainScroll {
  position: relative;
  margin: 0 auto;
  padding: 0;
  z-index: 300;
  overflow-x: hidden;
  overflow-y: visible; }

#header {
  position: fixed;
  width: 100%;
  height: 80px;
  top: 20px;
  left: 0;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  z-index: 400; }
  @media screen and (max-width: 1160px) {
    #header {
      padding: 0 40px; } }
  @media screen and (max-width: 600px) {
    #header {
      height: 21.333vw;
      top: 5.333vw;
      padding: 0 8vw; } }
  #header__inner {
    width: 1080px;
    height: 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    margin: 0 auto;
    padding: 0 50px;
    border-radius: 99999px;
    box-sizing: border-box;
    background-color: #fff;
    box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.16); }
    @media screen and (max-width: 1160px) {
      #header__inner {
        width: auto; } }
    @media screen and (max-width: 600px) {
      #header__inner {
        height: 21.333vw;
        padding: 0 8vw;
        box-shadow: 0px 1.6vw 1.6vw rgba(0, 0, 0, 0.16); } }
    #header__inner #identity-area {
      flex: 0 0 165px;
      width: 165px;
      line-height: 1; }
      @media screen and (max-width: 600px) {
        #header__inner #identity-area {
          flex: 0 0 44vw;
          width: 44vw; } }
      #header__inner #identity-area h1 {
        font-size: 0;
        line-height: 0;
        letter-spacing: 0;
        margin: 0;
        padding: 0;
        display: inline; }
      #header__inner #identity-area img {
        width: 100%;
        height: auto; }

#header-contact {
  flex: 0 0 165px;
  width: 165px; }
  @media screen and (max-width: 1160px) {
    #header-contact {
      display: none; } }
  #header-contact a {
    display: block;
    width: 100%;
    background: #098BDE;
    font-size: 15px;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    line-height: 42px;
    color: #fff;
    border-radius: 99999px; }

#menu-button {
  display: none;
  position: relative;
  width: 30px;
  height: 24px;
  background-color: transparent;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  border-radius: 10px;
  transition: all 300ms ease-in-out;
  font-size: 12px;
  line-height: 1;
  color: #098BDE;
  font-weight: bold; }
  #menu-button:hover {
    cursor: pointer; }
  @media screen and (max-width: 1160px) {
    #menu-button {
      display: block; } }
  @media screen and (max-width: 600px) {
    #menu-button {
      width: 8vw;
      height: 6.4vw;
      font-size: 3.2vw;
      border-radius: 2.667vw; } }
  #menu-button .menu--line {
    position: absolute;
    display: block;
    width: 30px;
    height: 3px;
    background-color: #098BDE;
    left: 50%;
    top: 12px;
    border-radius: 99999px;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    transition: all 300ms ease-in-out;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0); }
    @media screen and (max-width: 600px) {
      #menu-button .menu--line {
        top: 3.2vw;
        width: 8vw; } }
  #menu-button .menu--line--top {
    -webkit-transform: translate(-50%, -12px);
    transform: translate(-50%, -12px); }
    @media screen and (max-width: 600px) {
      #menu-button .menu--line--top {
        -webkit-transform: translate(-50%, -3.2vw);
        transform: translate(-50%, -3.2vw); } }
  #menu-button .menu--line--bottom {
    -webkit-transform: translate(-50%, 12px);
    transform: translate(-50%, 12px); }
    @media screen and (max-width: 600px) {
      #menu-button .menu--line--bottom {
        -webkit-transform: translate(-50%, 3.2vw);
        transform: translate(-50%, 3.2vw); } }
  #menu-button.active .menu--line--top {
    -webkit-transform: translate(-50%, 0) rotate(40deg);
    transform: translate(-50%, 0) rotate(40deg); }
  #menu-button.active .menu--line--middle {
    opacity: 0; }
  #menu-button.active .menu--line--bottom {
    -webkit-transform: translate(-50%, 0) rotate(-40deg);
    transform: translate(-50%, 0) rotate(-40deg); }

#global-area {
  height: 24px; }
  @media screen and (max-width: 1160px) {
    #global-area {
      display: none; } }
  #global-area__inner {
    margin: 0;
    padding: 0; }

#nav-global {
  margin: 0;
  padding: 0;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center; }
  #nav-global > li {
    flex: 0 0 auto;
    height: 24px;
    position: relative;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    line-height: 1.5;
    margin: 0;
    padding: 0;
    box-sizing: border-box; }
    #nav-global > li::after {
      content: "";
      display: block;
      position: absolute;
      height: 100%;
      width: 2px;
      background: #CCC;
      top: 50%;
      right: 0;
      -webkit-transform: translate(0, -50%);
      transform: translate(0, -50%); }
    #nav-global > li:last-child::after {
      display: none; }
    #nav-global > li a {
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      align-content: center;
      text-decoration: none;
      color: #000;
      height: 24px;
      padding: 0 20px;
      transition: all 300ms ease-in-out; }
      #nav-global > li a:hover {
        opacity: 0.8; }

#global-area-sp {
  display: none; }
  @media screen and (max-width: 1160px) {
    #global-area-sp {
      position: fixed;
      top: 0;
      right: 0;
      display: block;
      max-width: 600px;
      width: 100%;
      height: 0;
      min-height: 0;
      padding: 0;
      background-color: #ECF4FA;
      z-index: 390;
      box-sizing: border-box;
      transition: all 300ms ease-in-out;
      overflow: hidden;
      text-align: center;
      overflow-y: scroll;
      overflow-x: hidden; }
      #global-area-sp::-webkit-scrollbar {
        width: 4px; }
      #global-area-sp::-webkit-scrollbar-track {
        background: #fff;
        border-radius: 2px; }
      #global-area-sp::-webkit-scrollbar-thumb {
        background: #000;
        border-radius: 2px; } }
  #global-area-sp.active {
    min-height: 100vh; }
  #global-area-sp__inner {
    position: relative;
    padding: 110px 40px 30px;
    min-height: 100%;
    box-sizing: border-box; }
    @media screen and (max-width: 600px) {
      #global-area-sp__inner {
        padding: 29.333vw 8vw 8vw; } }

#nav-global-sp {
  width: 100%;
  margin: 0;
  padding: 0; }
  #nav-global-sp > li {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 4.2857;
    border-bottom: 1px solid #CCC;
    box-sizing: border-box;
    padding: 0; }
    @media screen and (max-width: 600px) {
      #nav-global-sp > li {
        font-size: 3.773vw;
        text-align: left; } }
    #nav-global-sp > li a {
      display: block;
      color: #000;
      margin: 0;
      padding: 0 30px;
      transition: all 300ms ease-in-out; }
      @media screen and (max-width: 600px) {
        #nav-global-sp > li a {
          padding: 0 8vw; } }
      #nav-global-sp > li a:hover {
        background-color: #098BDE;
        color: #fff; }

#nav-help-sp--contact {
  width: 100%;
  max-width: 315px;
  margin: 85px auto 0;
  padding: 0; }
  @media screen and (max-width: 600px) {
    #nav-help-sp--contact {
      margin-top: 13.333vw;
      max-width: inherit; } }
  #nav-help-sp--contact a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border-radius: 99999px;
    background: #BEA574;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 4;
    color: #fff; }
    @media screen and (max-width: 600px) {
      #nav-help-sp--contact a {
        font-size: 4vw; } }

#contents-area {
  text-align: center;
  width: 100%;
  margin: 0 auto; }
  #contents-area__inner {
    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box; }

#main-h1 {
  background: #ECF4FA; }
  #main-h1__inner {
    position: relative;
    width: 1080px;
    height: 630px;
    margin: 0 auto;
    padding: 110px 0 0;
    box-sizing: border-box;
    background: url("../image/dtp/bg-main-pc.svg") center top no-repeat;
    background-size: cover; }
    @media screen and (max-width: 1160px) {
      #main-h1__inner {
        width: auto;
        height: 800px;
        padding: 100px 40px 0; } }
    @media screen and (max-width: 600px) {
      #main-h1__inner {
        height: 133.333vw;
        padding-top: 26.667vw;
        background: url("../image/dtp/bg-main-sp.svg") center top no-repeat;
        background-size: cover; } }
  #main-h1--copy {
    display: block;
    margin: 64px auto 25px;
    width: 515px; }
    @media screen and (max-width: 1160px) {
      #main-h1--copy {
        margin: 180px auto 10px;
        width: 435px; } }
    @media screen and (max-width: 600px) {
      #main-h1--copy {
        margin: 31.333vw auto 1.6vw;
        width: 72.667vw; } }
    #main-h1--copy img {
      width: 100%;
      height: auto; }
    #main-h1--copy .main-h1--copy--pc {
      display: block; }
      @media screen and (max-width: 1160px) {
        #main-h1--copy .main-h1--copy--pc {
          display: none; } }
    #main-h1--copy .main-h1--copy--tb {
      display: none; }
      @media screen and (max-width: 1160px) {
        #main-h1--copy .main-h1--copy--tb {
          display: block; } }
      @media screen and (max-width: 600px) {
        #main-h1--copy .main-h1--copy--tb {
          display: none; } }
    #main-h1--copy .main-h1--copy--sp {
      display: none; }
      @media screen and (max-width: 600px) {
        #main-h1--copy .main-h1--copy--sp {
          display: block; } }
  #main-h1--title {
    margin: 0 auto;
    width: 439px; }
    @media screen and (max-width: 1160px) {
      #main-h1--title {
        width: 455px; } }
    @media screen and (max-width: 600px) {
      #main-h1--title {
        width: 75.867vw; } }
    #main-h1--title img {
      width: 100%;
      height: auto; }
    #main-h1--title .main-h1--title--pc {
      display: block; }
      @media screen and (max-width: 1160px) {
        #main-h1--title .main-h1--title--pc {
          display: none; } }
    #main-h1--title .main-h1--title--tb {
      display: none; }
      @media screen and (max-width: 1160px) {
        #main-h1--title .main-h1--title--tb {
          display: block; } }
      @media screen and (max-width: 600px) {
        #main-h1--title .main-h1--title--tb {
          display: none; } }
    #main-h1--title .main-h1--title--sp {
      display: none; }
      @media screen and (max-width: 600px) {
        #main-h1--title .main-h1--title--sp {
          display: block; } }
  #main-h1--img01 {
    position: absolute;
    width: 332px;
    height: 396px;
    background: url("../image/dtp/main-img01-pc.png") center center no-repeat;
    background-size: contain;
    top: 213px;
    left: 16px; }
    @media screen and (max-width: 1160px) {
      #main-h1--img01 {
        width: 33.5vw;
        height: 27.125vw;
        background: url("../image/dtp/main-img01-tb.png") center center no-repeat;
        background-size: contain;
        top: 490px;
        left: auto;
        right: 50%;
        -webkit-transform: translate(-132px, 0);
        transform: translate(-132px, 0); } }
    @media screen and (max-width: 800px) {
      #main-h1--img01 {
        width: 268px;
        height: 217px;
        background: url("../image/dtp/main-img01-tb.png") center center no-repeat;
        background-size: contain;
        top: 505px;
        left: auto;
        right: 50%;
        -webkit-transform: translate(-14px, 0);
        transform: translate(-14px, 0); } }
    @media screen and (max-width: 600px) {
      #main-h1--img01 {
        width: 44.667vw;
        height: 36vw;
        background: url("../image/dtp/main-img01-sp.png") center center no-repeat;
        background-size: contain;
        top: 95.333vw;
        left: 3.067vw;
        right: auto;
        -webkit-transform: none;
        transform: none; } }
  #main-h1--img02 {
    position: absolute;
    width: 290px;
    height: 246px;
    background: url("../image/dtp/main-img02-pc.png") center center no-repeat;
    background-size: contain;
    top: 121px;
    left: 778px; }
    @media screen and (max-width: 1160px) {
      #main-h1--img02 {
        width: 31vw;
        height: 25vw;
        background: url("../image/dtp/main-img02-tb.png") center center no-repeat;
        background-size: contain;
        top: 490px;
        left: 50%;
        -webkit-transform: translate(150px, 0);
        transform: translate(150px, 0); } }
    @media screen and (max-width: 800px) {
      #main-h1--img02 {
        width: 248px;
        height: 200px;
        background: url("../image/dtp/main-img02-tb.png") center center no-repeat;
        background-size: contain;
        top: 511px;
        left: 50%;
        -webkit-transform: translate(32px, 0);
        transform: translate(32px, 0); } }
    @media screen and (max-width: 600px) {
      #main-h1--img02 {
        width: 41.333vw;
        height: 33.467vw;
        background: url("../image/dtp/main-img02-sp.png") center center no-repeat;
        background-size: contain;
        top: 96.267vw;
        left: 55.333vw;
        -webkit-transform: none;
        transform: none; } }
  #main-h1--img03 {
    position: absolute;
    width: 309px;
    height: 237px;
    background: url("../image/dtp/main-img03-pc.png") center center no-repeat;
    background-size: contain;
    top: 383px;
    left: 752px; }
    @media screen and (max-width: 1160px) {
      #main-h1--img03 {
        width: 30.875vw;
        height: 21.875vw;
        background: url("../image/dtp/main-img03-tb.png") center center no-repeat;
        background-size: contain;
        top: 98px;
        left: 50%;
        -webkit-transform: translate(132px, 0);
        transform: translate(132px, 0); } }
    @media screen and (max-width: 800px) {
      #main-h1--img03 {
        width: 247px;
        height: 175px;
        background: url("../image/dtp/main-img03-tb.png") center center no-repeat;
        background-size: contain;
        top: 98px;
        left: 50%;
        -webkit-transform: translate(32px, 0);
        transform: translate(32px, 0); } }
    @media screen and (max-width: 600px) {
      #main-h1--img03 {
        width: 41.2vw;
        height: 28.933vw;
        background: url("../image/dtp/main-img03-sp.png") center center no-repeat;
        background-size: contain;
        top: 27.6vw;
        left: 55.333vw;
        -webkit-transform: none;
        transform: none; } }
  @media screen and (max-width: 1160px) {
    #main-h1--img04 {
      position: absolute;
      width: 28.5vw;
      height: 21.75vw;
      background: url("../image/dtp/main-img04-tb.png") center center no-repeat;
      background-size: contain;
      top: 103px;
      left: auto;
      right: 50%;
      -webkit-transform: translate(-159px, 0);
      transform: translate(-159px, 0); } }
  @media screen and (max-width: 800px) {
    #main-h1--img04 {
      position: absolute;
      width: 228px;
      height: 174px;
      background: url("../image/dtp/main-img04-tb.png") center center no-repeat;
      background-size: contain;
      top: 103px;
      left: auto;
      right: 50%;
      -webkit-transform: translate(-59px, 0);
      transform: translate(-59px, 0); } }
  @media screen and (max-width: 600px) {
    #main-h1--img04 {
      position: absolute;
      width: 37.867vw;
      height: 28.8vw;
      background: url("../image/dtp/main-img04-sp.png") center center no-repeat;
      background-size: contain;
      top: 28.4vw;
      left: 2.133vw;
      right: auto;
      -webkit-transform: none;
      transform: none; } }

#trouble {
  margin: 0;
  padding: 100px 0; }
  @media screen and (max-width: 600px) {
    #trouble {
      padding: 8vw 0 13.333vw; } }
  #trouble__inner {
    width: 900px;
    margin: 0 auto; }
    @media screen and (max-width: 1160px) {
      #trouble__inner {
        width: auto;
        padding: 0 40px; } }
    @media screen and (max-width: 600px) {
      #trouble__inner {
        padding: 0 8vw; } }
    #trouble__inner .trouble--copy {
      font-size: 20px;
      font-weight: bold;
      text-align: center;
      line-height: 1.75;
      margin: 0 0 10px; }
      @media screen and (max-width: 600px) {
        #trouble__inner .trouble--copy {
          font-size: 4.267vw;
          margin-bottom: 2.667vw; } }
    #trouble__inner .trouble--title {
      font-size: 30px;
      font-weight: bold;
      text-align: center;
      color: #098BDE;
      line-height: 1;
      letter-spacing: 0.05em;
      margin: 0 0 25px; }
      @media screen and (max-width: 600px) {
        #trouble__inner .trouble--title {
          font-size: 5.333vw;
          margin-bottom: 4.8vw; } }
    #trouble__inner .trouble--img01 {
      margin: 0 0 50px; }
      #trouble__inner .trouble--img01 img {
        max-width: 100%;
        height: auto; }
      @media screen and (max-width: 600px) {
        #trouble__inner .trouble--img01 {
          width: 68.267vw;
          margin: 0 auto 16vw; } }
    #trouble__inner .trouble--list {
      position: relative;
      margin: 0 0 105px;
      padding: 0;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      counter-reset: trouble-counter; }
      @media screen and (max-width: 1160px) {
        #trouble__inner .trouble--list {
          justify-content: space-around;
          margin-bottom: 65px; } }
      @media screen and (max-width: 600px) {
        #trouble__inner .trouble--list {
          display: block;
          margin-bottom: 22.667vw;
          padding: 0 8vw; } }
      #trouble__inner .trouble--list::after {
        content: "";
        position: absolute;
        bottom: -65px;
        left: 50%;
        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
        border-top: 25px solid #BEA574;
        border-left: 28px solid transparent;
        border-right: 28px solid transparent;
        border-bottom: 0px solid transparent; }
        @media screen and (max-width: 1160px) {
          #trouble__inner .trouble--list::after {
            bottom: -25px; } }
        @media screen and (max-width: 600px) {
          #trouble__inner .trouble--list::after {
            bottom: -25px;
            border-top-width: 6.667vw;
            border-left-width: 7.467vw;
            border-right-width: 7.467vw;
            bottom: -14.933vw; } }
      #trouble__inner .trouble--list li {
        position: relative;
        flex: 0 0 280px;
        width: 280px;
        box-sizing: border-box;
        margin: 0;
        padding: 40px 40px 25px;
        border-radius: 99999px;
        background: #fff;
        border: 2px solid #CCC;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
        font-size: 14px;
        line-height: 1.786;
        text-align: justify;
        text-justify: inter-ideograph; }
        @media screen and (max-width: 1160px) {
          #trouble__inner .trouble--list li {
            margin: 0 0 40px; } }
        @media screen and (max-width: 600px) {
          #trouble__inner .trouble--list li {
            font-size: 3.733vw;
            flex: none;
            width: auto;
            padding: 11.2vw 7.2vw 7.2vw;
            margin-bottom: 12vw;
            min-height: 37.067vw;
            border-radius: 18.533vw;
            box-shadow: 0px 0.8vw 1.6vw rgba(0, 0, 0, 0.16); } }
        #trouble__inner .trouble--list li::before {
          position: absolute;
          counter-increment: trouble-counter;
          content: "0" counter(trouble-counter);
          font-size: 18px;
          font-weight: bold;
          text-align: center;
          color: #fff;
          line-height: 50px;
          top: 0;
          left: 50%;
          width: 50px;
          height: 50px;
          border-radius: 50%;
          background: #098BDE;
          -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
          @media screen and (max-width: 600px) {
            #trouble__inner .trouble--list li::before {
              font-size: 4.8vw;
              width: 13.333vw;
              height: 13.333vw;
              line-height: 13.333vw; } }
    #trouble__inner .trouble--resolution {
      border: 5px solid #F03D61;
      border-radius: 50px;
      margin: 0;
      padding: 50px 40px;
      box-sizing: border-box; }
      @media screen and (max-width: 600px) {
        #trouble__inner .trouble--resolution {
          border-width: 1.333vw;
          border-radius: 13.333vw;
          padding: 9.333vw 8vw; } }
      #trouble__inner .trouble--resolution dt {
        position: relative;
        font-size: 25px;
        font-weight: bold;
        line-height: 1.4;
        letter-spacing: 0.05em;
        text-align: center;
        color: #F03D61;
        margin: 0 0 25px;
        padding: 0; }
        @media screen and (max-width: 800px) {
          #trouble__inner .trouble--resolution dt {
            font-size: 23px; } }
        @media screen and (max-width: 600px) {
          #trouble__inner .trouble--resolution dt {
            font-size: 5.333vw;
            line-height: 1.5;
            margin: 0 auto 5.333vw;
            width: 43.733vw; } }
        #trouble__inner .trouble--resolution dt::before, #trouble__inner .trouble--resolution dt::after {
          display: inline-block;
          content: "";
          width: 3px;
          height: 45px;
          background: #F03D61;
          vertical-align: middle; }
          @media screen and (max-width: 600px) {
            #trouble__inner .trouble--resolution dt::before, #trouble__inner .trouble--resolution dt::after {
              display: block;
              position: absolute;
              width: 0.8vw;
              height: 21.333vw; } }
        #trouble__inner .trouble--resolution dt::before {
          margin-right: 1em;
          -webkit-transform: rotate(-30deg);
          transform: rotate(-30deg); }
          @media screen and (max-width: 600px) {
            #trouble__inner .trouble--resolution dt::before {
              margin: 0;
              top: 1.6vw;
              left: -5.6vw; } }
        #trouble__inner .trouble--resolution dt::after {
          margin-left: 1em;
          -webkit-transform: rotate(30deg);
          transform: rotate(30deg); }
          @media screen and (max-width: 600px) {
            #trouble__inner .trouble--resolution dt::after {
              margin: 0;
              top: 1.6vw;
              right: -5.6vw; } }
      #trouble__inner .trouble--resolution dd {
        font-size: 16px;
        line-height: 1.875;
        text-align: justify;
        text-justify: inter-ideograph;
        margin: 0;
        padding: 0 240px 0 0;
        background: url("../image/dtp/trouble-img02@2x.png") right top no-repeat;
        background-size: 200px auto; }
        @media screen and (max-width: 600px) {
          #trouble__inner .trouble--resolution dd {
            font-size: 3.733vw;
            line-height: 1.714;
            padding: 0 0 48vw;
            background: url("../image/dtp/trouble-img02@2x.png") center bottom no-repeat;
            background-size: 53.333vw auto; } }

#feature {
  margin: 0;
  padding: 0; }
  #feature__outer {
    margin: 0;
    padding: 100px 0 100px;
    background: #ECF4FA; }
    @media screen and (max-width: 600px) {
      #feature__outer {
        padding: 13.333vw 0; } }
  #feature__inner {
    width: 1080px;
    margin: 0 auto; }
    @media screen and (max-width: 1160px) {
      #feature__inner {
        width: auto;
        padding: 0 40px; } }
    @media screen and (max-width: 600px) {
      #feature__inner {
        padding: 0 8vw; } }
    #feature__inner .feature--copy {
      font-size: 20px;
      font-weight: bold;
      text-align: center;
      line-height: 1.75;
      margin: 0 0 10px; }
      @media screen and (max-width: 600px) {
        #feature__inner .feature--copy {
          font-size: 3.733vw;
          margin-bottom: 2.4vw; } }
    #feature__inner .feature--title {
      font-size: 40px;
      font-weight: bold;
      text-align: center;
      color: #098BDE;
      line-height: 1;
      letter-spacing: 0.05em;
      margin: 0 0 80px; }
      @media screen and (max-width: 600px) {
        #feature__inner .feature--title {
          font-size: 6.4vw;
          margin-bottom: 16vw; } }
    #feature__inner .feature--list {
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: space-between;
      counter-reset: feature-counter; }
      @media screen and (max-width: 1160px) {
        #feature__inner .feature--list {
          flex-direction: column; } }
      #feature__inner .feature--list li {
        position: relative;
        flex: 0 0 340px;
        width: 340px;
        border-radius: 10px;
        background: #fff;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
        margin: 0;
        padding: 50px 30px;
        box-sizing: border-box; }
        @media screen and (max-width: 1160px) {
          #feature__inner .feature--list li {
            flex: 0 0 auto;
            width: auto;
            margin: 0 0 65px;
            display: flex;
            justify-content: space-between; } }
        @media screen and (max-width: 800px) {
          #feature__inner .feature--list li {
            flex: 0 0 auto;
            display: block; } }
        @media screen and (max-width: 800px) {
          #feature__inner .feature--list li {
            border-radius: 2.667vw;
            box-shadow: 0px 0.8vw 1.6vw rgba(0, 0, 0, 0.16);
            margin-bottom: 17.333vw;
            padding: 13.333vw 8vw; } }
        #feature__inner .feature--list li::before {
          position: absolute;
          counter-increment: feature-counter;
          content: "0" counter(feature-counter);
          font-size: 25px;
          font-weight: bold;
          text-align: center;
          color: #098BDE;
          line-height: 60px;
          top: 0;
          left: 50%;
          width: 64px;
          height: 64px;
          border-radius: 50%;
          border: 2px solid #098BDE;
          background: #fff;
          box-sizing: border-box;
          -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
          @media screen and (max-width: 600px) {
            #feature__inner .feature--list li::before {
              font-size: 4.8vw;
              line-height: 12.267vw;
              width: 13.333vw;
              height: 13.333vw;
              border-width: 0.533vw; } }
      #feature__inner .feature--list--img {
        margin: 0 auto 25px; }
        @media screen and (max-width: 1160px) {
          #feature__inner .feature--list--img {
            flex: 0 0 280px;
            margin: 0 40px 0 0; } }
        @media screen and (max-width: 800px) {
          #feature__inner .feature--list--img {
            flex: none;
            margin: 0 auto 25px; } }
        @media screen and (max-width: 600px) {
          #feature__inner .feature--list--img {
            margin-bottom: 6.667vw; } }
        #feature__inner .feature--list--img img {
          max-width: 100%;
          height: auto; }
          @media screen and (max-width: 600px) {
            #feature__inner .feature--list--img img {
              width: 100%; } }
      #feature__inner .feature--list--title {
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        color: #098BDE;
        line-height: 1;
        letter-spacing: 0.05em;
        margin: 0 0 15px; }
        @media screen and (max-width: 600px) {
          #feature__inner .feature--list--title {
            font-size: 4.8vw;
            margin-bottom: 4vw; } }
      #feature__inner .feature--list--text {
        font-size: 16px;
        text-align: justify;
        text-justify: inter-ideograph;
        line-height: 1.875;
        margin: 0 0 20px; }
        @media screen and (max-width: 600px) {
          #feature__inner .feature--list--text {
            font-size: 3.733vw;
            margin-bottom: 5.333vw; } }
      #feature__inner .feature--list--for {
        font-size: 14px;
        font-weight: bold;
        line-height: 2.143;
        margin: 0 0 10px; }
        @media screen and (max-width: 600px) {
          #feature__inner .feature--list--for {
            font-size: 3.2vw;
            margin-bottom: 2.667vw; } }
      #feature__inner .feature--list--link a {
        font-size: 20px;
        font-weight: bold;
        line-height: 1;
        color: #fff;
        max-width: 271px;
        height: 50px;
        border-radius: 99999px;
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        background: #098BDE;
        box-shadow: 0px 5px 0px rgba(0, 0, 0, 0.16);
        margin: 0 auto; }
        @media screen and (max-width: 600px) {
          #feature__inner .feature--list--link a {
            font-size: 4.267vw;
            max-width: inherit;
            height: 10.667vw;
            box-shadow: 0px 1.333vw 0px rgba(0, 0, 0, 0.16); } }
        #feature__inner .feature--list--link a::after {
          display: inline-block;
          content: "";
          width: 30px;
          height: 30px;
          background: url("../image/dtp/icon-arrow-b.svg") center center no-repeat;
          background-size: contain;
          margin-left: 5px; }
          @media screen and (max-width: 600px) {
            #feature__inner .feature--list--link a::after {
              width: 6.667vw;
              height: 6.667vw;
              margin-left: 2.667vw; } }
  #feature .feature--in--title {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    font-size: 40px;
    font-weight: bold;
    color: #098BDE;
    line-height: 1.45;
    letter-spacing: 0.05em;
    margin: 0 0 70px; }
    @media screen and (max-width: 600px) {
      #feature .feature--in--title {
        display: block;
        font-size: 6.933vw;
        margin-bottom: 5.333vw; } }
    #feature .feature--in--title::before {
      flex: 0 0 58px;
      display: inline-block;
      content: "01";
      border: 2px solid #098BDE;
      border-radius: 50%;
      width: 58px;
      height: 58px;
      font-size: 25px;
      font-weight: bold;
      color: #098BDE;
      line-height: 54px;
      margin-right: 0.5em;
      box-sizing: border-box; }
      @media screen and (max-width: 600px) {
        #feature .feature--in--title::before {
          display: block;
          border-width: 0.533vw;
          width: 13.333vw;
          height: 13.333vw;
          font-size: 4.8vw;
          line-height: 12.267vw;
          margin: 0 auto 2.667vw; } }
  #feature .feature--in--main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    margin: 0 0 50px; }
    @media screen and (max-width: 1160px) {
      #feature .feature--in--main {
        display: block; } }
    @media screen and (max-width: 600px) {
      #feature .feature--in--main {
        margin-bottom: 10.667vw; } }
  #feature .feature--in--img {
    flex: 0 0 550px; }
    @media screen and (max-width: 1160px) {
      #feature .feature--in--img {
        flex: none;
        text-align: center;
        margin: 0 0 30px; } }
    @media screen and (max-width: 600px) {
      #feature .feature--in--img {
        margin-bottom: 8vw; } }
    #feature .feature--in--img img {
      border-radius: 10px;
      max-width: 100%;
      height: auto; }
      @media screen and (max-width: 1160px) {
        #feature .feature--in--img img {
          margin: 0 auto; } }
      @media screen and (max-width: 600px) {
        #feature .feature--in--img img {
          border-radius: 2.667vw; } }
  #feature .feature--in--text {
    flex: 0 0 380px; }
    @media screen and (max-width: 1160px) {
      #feature .feature--in--text {
        flex: none;
        max-width: 600px;
        margin: 0 auto; } }
    #feature .feature--in--text dl {
      margin: 0;
      padding: 0; }
      #feature .feature--in--text dl dt {
        font-size: 25px;
        font-weight: bold;
        line-height: 1.8;
        text-align: justify;
        text-justify: inter-ideograph;
        margin: 0 0 25px;
        padding: 0; }
        @media screen and (max-width: 600px) {
          #feature .feature--in--text dl dt {
            font-size: 5.333vw;
            line-height: 1.6;
            margin-bottom: 6.667vw; } }
      #feature .feature--in--text dl dd {
        font-size: 16px;
        line-height: 1.875;
        letter-spacing: 0.05em;
        text-align: justify;
        text-justify: inter-ideograph;
        margin: 0;
        padding: 0; }
        @media screen and (max-width: 600px) {
          #feature .feature--in--text dl dd {
            font-size: 3.733vw;
            line-height: 2;
            letter-spacing: 0; } }

#support {
  padding: 100px 0; }
  @media screen and (max-width: 600px) {
    #support {
      padding: 13.333vw 0 5.333vw; } }
  #support__inner {
    width: 1080px;
    margin: 0 auto;
    padding: 0 50px;
    box-sizing: border-box; }
    @media screen and (max-width: 1160px) {
      #support__inner {
        width: auto; } }
    @media screen and (max-width: 600px) {
      #support__inner {
        padding: 0 8vw; } }
    #support__inner .support--img--flow {
      margin: 0 auto 60px; }
      @media screen and (max-width: 600px) {
        #support__inner .support--img--flow {
          margin-bottom: 13.333vw; } }
      #support__inner .support--img--flow img {
        max-width: 100%;
        height: auto; }

#support--flow .support--flow--title {
  font-size: 25px;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #fff;
  background: #098BDE;
  margin: 0 0 60px;
  padding: 15px;
  box-sizing: border-box; }
  @media screen and (max-width: 600px) {
    #support--flow .support--flow--title {
      font-size: 4.8vw;
      margin-bottom: 8vw;
      padding: 4vw; } }
#support--flow .support--flow--list {
  position: relative;
  margin: 0 0 100px;
  padding: 0 40px;
  counter-reset: flow-counter; }
  @media screen and (max-width: 1160px) {
    #support--flow .support--flow--list {
      padding: 0; } }
  @media screen and (max-width: 600px) {
    #support--flow .support--flow--list {
      margin-bottom: 16vw; } }
  #support--flow .support--flow--list::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 66px;
    width: 5px;
    height: 100%;
    z-index: -1;
    background: #CCC; }
    @media screen and (max-width: 1160px) {
      #support--flow .support--flow--list::before {
        left: 26px; } }
    @media screen and (max-width: 600px) {
      #support--flow .support--flow--list::before {
        left: 4.533vw;
        width: 1.333vw; } }
  #support--flow .support--flow--list > li {
    position: relative;
    margin: 0 0 70px;
    padding: 0; }
    @media screen and (max-width: 600px) {
      #support--flow .support--flow--list > li {
        margin-bottom: 10.667vw; } }
    #support--flow .support--flow--list > li:last-child {
      margin-bottom: 0; }
      #support--flow .support--flow--list > li:last-child dd {
        background: #fff; }
    #support--flow .support--flow--list > li::before {
      position: absolute;
      counter-increment: flow-counter;
      content: counter(flow-counter);
      font-size: 25px;
      font-weight: bold;
      text-align: center;
      color: #fff;
      line-height: 57px;
      top: 0;
      left: 0;
      width: 57px;
      height: 57px;
      border-radius: 50%;
      background: #098BDE;
      box-sizing: border-box; }
      @media screen and (max-width: 600px) {
        #support--flow .support--flow--list > li::before {
          font-size: 5.333vw;
          line-height: 10.667vw;
          width: 10.667vw;
          height: 10.667vw; } }
    #support--flow .support--flow--list > li > dl {
      margin: 0;
      padding: 0; }
      #support--flow .support--flow--list > li > dl > dt {
        font-size: 25px;
        font-weight: bold;
        text-align: justify;
        text-justify: inter-ideograph;
        color: #098BDE;
        line-height: 57px;
        margin: 0;
        padding: 0 0 0 70px; }
        @media screen and (max-width: 600px) {
          #support--flow .support--flow--list > li > dl > dt {
            font-size: 4.8vw;
            line-height: 2;
            padding: 0.533vw 0 0 13.333vw; } }
      #support--flow .support--flow--list > li > dl > dd {
        font-size: 16px;
        text-align: justify;
        text-justify: inter-ideograph;
        line-height: 1.875;
        margin: 0;
        padding: 15px 0 0 70px; }
        @media screen and (max-width: 600px) {
          #support--flow .support--flow--list > li > dl > dd {
            font-size: #main_font_size_sp;
            line-height: 2;
            padding: 5.333vw 0 0 13.333vw; } }
        #support--flow .support--flow--list > li > dl > dd .note {
          font-size: 14px;
          line-height: 1.786;
          margin: 10px 0 0; }
          @media screen and (max-width: 600px) {
            #support--flow .support--flow--list > li > dl > dd .note {
              font-size: 3.2vw;
              line-height: 1.667;
              margin-top: 2.667vw; } }
        #support--flow .support--flow--list > li > dl > dd .support--flow--qa {
          display: block; }
          #support--flow .support--flow--list > li > dl > dd .support--flow--qa + .support--flow--qa {
            margin-top: 20px; }
            @media screen and (max-width: 600px) {
              #support--flow .support--flow--list > li > dl > dd .support--flow--qa + .support--flow--qa {
                margin-top: 5.333vw; } }
          #support--flow .support--flow--list > li > dl > dd .support--flow--qa > dl {
            margin: 0;
            padding: 0; }
            #support--flow .support--flow--list > li > dl > dd .support--flow--qa > dl > dt {
              font-size: 18px;
              line-height: 1.889;
              letter-spacing: 0.05em;
              color: #fff;
              background: #BEA574;
              padding: 10px 20px;
              box-sizing: border-box; }
              @media screen and (max-width: 600px) {
                #support--flow .support--flow--list > li > dl > dd .support--flow--qa > dl > dt {
                  font-size: 4.267vw;
                  line-height: 1.75;
                  letter-spacing: 0;
                  padding: 5.333vw; } }
            #support--flow .support--flow--list > li > dl > dd .support--flow--qa > dl > dd {
              font-size: 16px;
              line-height: 1.875;
              margin: 0;
              padding: 15px 20px;
              border: 1px solid #BEA574;
              box-sizing: border-box; }
              @media screen and (max-width: 600px) {
                #support--flow .support--flow--list > li > dl > dd .support--flow--qa > dl > dd {
                  font-size: 3.733vw;
                  line-height: 2;
                  padding: 5.333vw; } }
              #support--flow .support--flow--list > li > dl > dd .support--flow--qa > dl > dd .support--flow--qa--link {
                font-size: 14px;
                font-weight: bold;
                line-height: 2.143;
                color: #F03D61;
                margin: 10px 0 0;
                padding: 0; }
                @media screen and (max-width: 600px) {
                  #support--flow .support--flow--list > li > dl > dd .support--flow--qa > dl > dd .support--flow--qa--link {
                    font-size: 3.2vw;
                    line-height: 1.667;
                    text-align: center;
                    margin-top: 4vw; } }
        #support--flow .support--flow--list > li > dl > dd.support--flow--img {
          float: right;
          margin: 0 0 20px 30px;
          padding: 0; }
          @media screen and (max-width: 1160px) {
            #support--flow .support--flow--list > li > dl > dd.support--flow--img {
              max-width: 50%; } }
          @media screen and (max-width: 800px) {
            #support--flow .support--flow--list > li > dl > dd.support--flow--img {
              float: none;
              max-width: inherit;
              margin: 0 0 20px;
              padding: 15px 0 0 70px; } }
          @media screen and (max-width: 600px) {
            #support--flow .support--flow--list > li > dl > dd.support--flow--img {
              margin-bottom: 5.333vw;
              padding: 5.333vw 0 0 13.333vw; } }
          #support--flow .support--flow--list > li > dl > dd.support--flow--img img {
            max-width: 100%;
            height: auto; }
            @media screen and (max-width: 800px) {
              #support--flow .support--flow--list > li > dl > dd.support--flow--img img {
                margin: 0 auto;
                display: block; } }

#support--voice .support--voice--title {
  margin: 0 auto 30px; }
  @media screen and (max-width: 600px) {
    #support--voice .support--voice--title {
      margin-bottom: 10.667vw; } }
  #support--voice .support--voice--title img {
    max-width: 100%;
    height: auto; }

#technique {
  padding: 100px 0; }
  @media screen and (max-width: 600px) {
    #technique {
      padding: 13.333vw 0 5.333vw; } }
  #technique__inner {
    width: 1080px;
    margin: 0 auto;
    padding: 0 50px;
    box-sizing: border-box; }
    @media screen and (max-width: 1160px) {
      #technique__inner {
        width: auto;
        padding: 0 40px; } }
    @media screen and (max-width: 600px) {
      #technique__inner {
        padding: 0 8vw; } }
    @media screen and (max-width: 600px) {
      #technique__inner .technique--title {
        width: 9em;
        margin-left: auto;
        margin-right: auto; } }
    #technique__inner .technique--title::before {
      content: "02"; }
    #technique__inner .technique--img--profile {
      margin: 0 auto 60px; }
      @media screen and (max-width: 600px) {
        #technique__inner .technique--img--profile {
          margin-bottom: 10.667vw; } }
      #technique__inner .technique--img--profile img {
        max-width: 100%;
        height: auto; }

#technique--dtp {
  margin: 0 0 70px;
  padding: 46px 36px;
  border: 4px solid #098BDE;
  border-radius: 20px;
  box-sizing: border-box; }
  @media screen and (max-width: 600px) {
    #technique--dtp {
      margin-bottom: 18.667vw;
      padding: 8vw;
      border-width: 1.067vw;
      border-radius: 5.333vw; } }
  #technique--dtp .technique--dtp--title {
    font-size: 28px;
    font-weight: bold;
    line-height: 1.25;
    letter-spacing: 0.05em;
    text-align: justify;
    text-justify: inter-ideograph;
    margin: 0 0 30px;
    padding: 0 0 15px 60px;
    border-bottom: 4px solid #CCC;
    background: url("../image/dtp/icon-check.svg") left top no-repeat;
    background-size: 41px auto; }
    @media screen and (max-width: 600px) {
      #technique--dtp .technique--dtp--title {
        font-size: 5.333vw;
        margin-bottom: 5.333vw;
        padding: 0.533vw 0 5.333vw 13.333vw;
        border-bottom-width: 1.067vw;
        background-size: 9.6vw auto; } }
  #technique--dtp .technique--dtp--text {
    font-size: 16px;
    line-height: 1.875;
    text-align: justify;
    text-justify: inter-ideograph; }
    @media screen and (max-width: 600px) {
      #technique--dtp .technique--dtp--text {
        font-size: 3.733vw;
        line-height: 2; } }
  #technique--dtp .technique--dtp--box {
    display: flex;
    justify-content: space-between;
    margin: 0 0 30px; }
    @media screen and (max-width: 800px) {
      #technique--dtp .technique--dtp--box {
        display: block; } }
    @media screen and (max-width: 600px) {
      #technique--dtp .technique--dtp--box {
        font-size: 3.733vw;
        line-height: 2; } }
    #technique--dtp .technique--dtp--box--text {
      font-size: 16px;
      line-height: 1.875;
      text-align: justify;
      text-justify: inter-ideograph; }
      @media screen and (max-width: 800px) {
        #technique--dtp .technique--dtp--box--text {
          flex: none; } }
      @media screen and (max-width: 600px) {
        #technique--dtp .technique--dtp--box--text {
          margin-bottom: 4vw; } }
      #technique--dtp .technique--dtp--box--text--note {
        font-size: 14px;
        line-height: 1.786;
        margin: 15px 0 0; }
        @media screen and (max-width: 600px) {
          #technique--dtp .technique--dtp--box--text--note {
            font-size: 3.2vw;
            line-height: 1.667;
            margin-top: 5.333vw; } }
    #technique--dtp .technique--dtp--box--img {
      flex: 0 0 290px;
      margin: 0 0 0 25px; }
      @media screen and (max-width: 800px) {
        #technique--dtp .technique--dtp--box--img {
          flex: none;
          width: 290px;
          margin: 10px auto 0; } }
      @media screen and (max-width: 600px) {
        #technique--dtp .technique--dtp--box--img {
          display: none; } }
      #technique--dtp .technique--dtp--box--img img {
        max-width: 100%;
        height: auto; }
  #technique--dtp .technique--dtp--flow {
    background: #ECF4FA;
    margin: 0 0 20px;
    padding: 30px;
    box-sizing: border-box; }
    @media screen and (max-width: 600px) {
      #technique--dtp .technique--dtp--flow {
        margin-bottom: 5.333vw;
        padding: 5.333vw; } }
    #technique--dtp .technique--dtp--flow > dt {
      font-size: 18px;
      font-weight: bold;
      line-height: 1.667;
      text-align: justify;
      text-justify: inter-ideograph;
      margin: 0;
      padding: 0; }
      @media screen and (max-width: 600px) {
        #technique--dtp .technique--dtp--flow > dt {
          font-size: 4.267vw;
          line-height: 1.75; } }
    #technique--dtp .technique--dtp--flow > dd {
      margin: 0;
      padding: 0; }
      #technique--dtp .technique--dtp--flow > dd > ol {
        margin: 0;
        padding: 0;
        list-style: decimal; }
        #technique--dtp .technique--dtp--flow > dd > ol > li {
          margin: 0 0 0 1.25em;
          padding: 0 0 0 0.25em;
          font-size: 16px;
          line-height: 1.875;
          text-align: justify;
          text-justify: inter-ideograph; }
          @media screen and (max-width: 600px) {
            #technique--dtp .technique--dtp--flow > dd > ol > li {
              font-size: 3.733vw;
              line-height: 2; } }
          #technique--dtp .technique--dtp--flow > dd > ol > li .technique--dtp--flow--note {
            font-size: 14px;
            line-height: 1.786;
            margin: 0 0 0 -24px; }
            @media screen and (max-width: 600px) {
              #technique--dtp .technique--dtp--flow > dd > ol > li .technique--dtp--flow--note {
                font-size: 3.2vw;
                margin-left: -4.8vw; } }

#technique--quality {
  margin: 0 0 100px;
  padding: 46px 36px;
  border: 4px solid #098BDE;
  border-radius: 20px;
  box-sizing: border-box; }
  @media screen and (max-width: 600px) {
    #technique--quality {
      margin-bottom: 16vw;
      padding: 2.667vw 8vw 8vw;
      border-width: 1.067vw;
      border-radius: 5.333vw; } }
  #technique--quality .technique--quality--title {
    font-size: 28px;
    font-weight: bold;
    line-height: 1.25;
    letter-spacing: 0.05em;
    text-align: justify;
    text-justify: inter-ideograph;
    margin: 0 0 30px;
    padding: 0 0 15px 60px;
    border-bottom: 4px solid #CCC;
    background: url("../image/dtp/icon-check.svg") left top no-repeat;
    background-size: 41px auto; }
    @media screen and (max-width: 600px) {
      #technique--quality .technique--quality--title {
        font-size: 5.333vw;
        margin-bottom: 5.333vw;
        padding: 5.333vw 0 5.333vw 13.333vw;
        border-bottom-width: 1.067vw;
        background-size: 9.6vw auto;
        background-position: left center; } }
  #technique--quality .technique--quality--text {
    font-size: 16px;
    line-height: 1.875;
    text-align: justify;
    text-justify: inter-ideograph;
    margin: 0 0 40px; }
    @media screen and (max-width: 600px) {
      #technique--quality .technique--quality--text {
        font-size: 3.733vw;
        line-height: 2;
        margin-bottom: 9.6vw; } }
  #technique--quality .technique--quality--list {
    display: flex;
    justify-content: space-between;
    margin: 0 0 20px; }
    @media screen and (max-width: 1160px) {
      #technique--quality .technique--quality--list {
        flex-direction: column; } }
    @media screen and (max-width: 600px) {
      #technique--quality .technique--quality--list {
        margin-bottom: 0; } }
    #technique--quality .technique--quality--list > li {
      flex: 0 0 420px;
      background: #ECF4FA;
      margin: 0;
      padding: 0; }
      @media screen and (max-width: 1160px) {
        #technique--quality .technique--quality--list > li {
          margin-bottom: 30px; } }
      @media screen and (max-width: 600px) {
        #technique--quality .technique--quality--list > li {
          flex: 0 0 auto;
          margin-bottom: 5.333vw; } }
      #technique--quality .technique--quality--list > li > dl {
        margin: 0;
        padding: 0; }
        #technique--quality .technique--quality--list > li > dl .technique--quality--list--title {
          font-size: 20px;
          font-weight: bold;
          text-align: center;
          line-height: 1.45;
          color: #fff;
          margin: 0;
          padding: 13px 30px;
          background: #098BDE; }
          @media screen and (max-width: 600px) {
            #technique--quality .technique--quality--list > li > dl .technique--quality--list--title {
              font-size: 4.8vw;
              padding: 3.733vw 5.333vw; } }
        #technique--quality .technique--quality--list > li > dl .technique--quality--list--text {
          font-size: 16px;
          text-align: justify;
          text-justify: inter-ideograph;
          line-height: 1.875;
          margin: 0;
          padding: 30px; }
          @media screen and (max-width: 1160px) {
            #technique--quality .technique--quality--list > li > dl .technique--quality--list--text {
              max-width: 600px;
              margin: 0 auto; } }
          @media screen and (max-width: 600px) {
            #technique--quality .technique--quality--list > li > dl .technique--quality--list--text {
              font-size: 3.733vw;
              line-height: 2;
              padding: 5.333vw; } }
        #technique--quality .technique--quality--list > li > dl .technique--quality--list--img {
          margin: 0;
          padding: 0 0 30px; }
          @media screen and (max-width: 600px) {
            #technique--quality .technique--quality--list > li > dl .technique--quality--list--img {
              padding: 0 5.333vw 5.333vw; } }
          #technique--quality .technique--quality--list > li > dl .technique--quality--list--img img {
            max-width: 100%;
            height: auto; }
  #technique--quality .technique--quality--img {
    margin: 30px auto 0; }
    @media screen and (max-width: 600px) {
      #technique--quality .technique--quality--img {
        margin-top: 5.333vw; } }
    #technique--quality .technique--quality--img img {
      max-width: 100%;
      height: auto; }

#technique--voice .technique--voice--title {
  margin: 0 auto 30px; }
  @media screen and (max-width: 600px) {
    #technique--voice .technique--voice--title {
      margin-bottom: 10.667vw; } }
  #technique--voice .technique--voice--title img {
    max-width: 100%;
    height: auto; }

#works {
  padding: 100px 0 0; }
  @media screen and (max-width: 600px) {
    #works {
      padding: 13.333vw 0 0; } }
  #works__inner {
    width: 1080px;
    margin: 0 auto;
    padding: 0 50px;
    box-sizing: border-box; }
    @media screen and (max-width: 1160px) {
      #works__inner {
        width: auto;
        padding: 0 40px; } }
    @media screen and (max-width: 600px) {
      #works__inner {
        padding: 0 8vw; } }
    @media screen and (max-width: 600px) {
      #works__inner .works--title {
        width: 7em;
        margin-left: auto;
        margin-right: auto; } }
    #works__inner .works--title::before {
      content: "03"; }
    #works__inner .works--img--pro {
      margin: 0 auto 60px; }
      @media screen and (max-width: 600px) {
        #works__inner .works--img--pro {
          margin-bottom: 13.333vw; } }
      #works__inner .works--img--pro img {
        max-width: 100%;
        height: auto; }

#works--content .works--content--title {
  font-size: 25px;
  line-height: 1;
  letter-spacing: 0.05em;
  color: #fff;
  background: #098BDE;
  margin: 0 0 50px;
  padding: 15px;
  box-sizing: border-box; }
  @media screen and (max-width: 600px) {
    #works--content .works--content--title {
      font-size: 4.8vw;
      margin-bottom: 5.333vw;
      padding: 4vw 8vw; } }
#works--content .works--content--text {
  font-size: 16px;
  line-height: 1.875;
  text-align: justify;
  text-justify: inter-ideograph; }
  @media screen and (max-width: 600px) {
    #works--content .works--content--text {
      font-size: 3.733vw;
      line-height: 2; } }
#works--content .works--content--list {
  margin: 0 0 40px;
  padding: 0 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  @media screen and (max-width: 600px) {
    #works--content .works--content--list {
      margin-bottom: 8vw;
      padding: 0; } }
  #works--content .works--content--list::before, #works--content .works--content--list::after {
    content: "";
    display: block;
    flex: 0 0 160px;
    order: 1; }
    @media screen and (max-width: 600px) {
      #works--content .works--content--list::before, #works--content .works--content--list::after {
        display: none; } }
  #works--content .works--content--list > li {
    flex: 0 0 160px;
    margin: 0 10px 30px;
    box-sizing: border-box; }
    @media screen and (max-width: 600px) {
      #works--content .works--content--list > li {
        flex: 0 0 38.933vw;
        margin: 0 0 8vw; } }
    #works--content .works--content--list > li .works--content--list--img {
      width: 160px;
      height: 160px;
      background: #FDFAF2;
      display: flex;
      justify-content: center;
      align-items: center;
      align-content: center; }
      @media screen and (max-width: 600px) {
        #works--content .works--content--list > li .works--content--list--img {
          width: 38.993vw;
          height: 38.993vw; } }
      #works--content .works--content--list > li .works--content--list--img img {
        max-width: 100%;
        height: auto; }
    #works--content .works--content--list > li .works--content--list--text {
      font-size: 14px;
      font-weight: bold;
      line-height: 1.786;
      margin: 10px 0 0; }
      @media screen and (max-width: 600px) {
        #works--content .works--content--list > li .works--content--list--text {
          font-size: 3.2vw;
          line-height: 2.083;
          margin-top: 5.333vw; } }
    #works--content .works--content--list > li .works--content--list--link {
      background: #ECF4FA; }
      #works--content .works--content--list > li .works--content--list--link a {
        display: block;
        width: 160px;
        height: 160px;
        display: flex;
        justify-content: center;
        align-items: center;
        align-content: center;
        font-size: 14px;
        font-weight: bold;
        line-height: 1.4289; }
        @media screen and (max-width: 600px) {
          #works--content .works--content--list > li .works--content--list--link a {
            width: 38.993vw;
            height: 38.993vw;
            font-size: 3.733vw;
            line-height: 1.429; } }
        #works--content .works--content--list > li .works--content--list--link a span {
          display: inline-block;
          padding: 0 23px 0 0;
          background: url("../image/dtp/icon-link-blue.svg") right center no-repeat;
          background-size: 18px auto; }
          @media screen and (max-width: 600px) {
            #works--content .works--content--list > li .works--content--list--link a span {
              padding-right: 6.4vw;
              background-size: 4.267vw auto; } }
#works--content .works--content--img--other {
  margin: 0 0 60px; }
  @media screen and (max-width: 600px) {
    #works--content .works--content--img--other {
      margin-bottom: 16vw; } }
  #works--content .works--content--img--other img {
    max-width: 100%;
    height: auto; }
#works--content .works--content--qa {
  margin: 0 0 40px;
  padding: 0; }
  @media screen and (max-width: 600px) {
    #works--content .works--content--qa {
      margin-bottom: 8vw; } }
  #works--content .works--content--qa:last-child {
    margin-bottom: 0; }
  #works--content .works--content--qa > dl {
    margin: 0;
    padding: 0;
    background: #ECF4FA; }
    #works--content .works--content--qa > dl > dt {
      font-size: 16px;
      font-weight: bold;
      line-height: 2.125;
      letter-spacing: 0.05em;
      text-align: justify;
      text-justify: inter-ideograph;
      color: #fff;
      background: #098BDE;
      margin: 0;
      padding: 10px 20px;
      box-sizing: border-box; }
      @media screen and (max-width: 600px) {
        #works--content .works--content--qa > dl > dt {
          font-size: 3.733vw;
          line-height: 1.857;
          letter-spacing: 0;
          padding: 4vw 8vw; } }
    #works--content .works--content--qa > dl > dd {
      font-size: 16px;
      line-height: 1.875;
      text-align: justify;
      text-justify: inter-ideograph;
      margin: 0;
      padding: 20px;
      box-sizing: border-box; }
      @media screen and (max-width: 600px) {
        #works--content .works--content--qa > dl > dd {
          font-size: 3.733vw;
          line-height: 2;
          padding: 4vw 8vw; } }

#works--voice {
  margin: 100px 0 0; }
  @media screen and (max-width: 600px) {
    #works--voice {
      margin-top: 16vw; } }
  #works--voice .works--voice--title {
    margin: 0 auto 30px; }
    @media screen and (max-width: 600px) {
      #works--voice .works--voice--title {
        margin-bottom: 10.667vw; } }
    #works--voice .works--voice--title img {
      max-width: 100%;
      height: auto; }

.popularity {
  width: 900px;
  margin: 0 auto;
  padding: 120px 0 60px; }
  @media screen and (max-width: 1160px) {
    .popularity {
      width: auto;
      padding: 120px 40px 60px; } }
  @media screen and (max-width: 600px) {
    .popularity {
      padding: 24vw 8vw 0; } }
  .popularity--text {
    margin: 0 0 40px; }
    @media screen and (max-width: 600px) {
      .popularity--text {
        margin-bottom: 10.667vw; } }
    .popularity--text--pc {
      display: block;
      margin: 0 auto; }
      @media screen and (max-width: 600px) {
        .popularity--text--pc {
          display: none; } }
    .popularity--text--sp {
      display: none;
      margin: 0 auto; }
      @media screen and (max-width: 600px) {
        .popularity--text--sp {
          display: block; } }
    .popularity--text img {
      max-width: 100%;
      height: auto; }
      @media screen and (max-width: 600px) {
        .popularity--text img {
          width: 100%;
          height: auto; } }
  .popularity--img img {
    max-width: 100%;
    height: auto; }

#contact {
  margin: 0;
  padding: 150px 0 160px; }
  @media screen and (max-width: 600px) {
    #contact {
      padding: 26.667vw 0 37.333vw; } }
  #contact__inner {
    width: 1080px;
    margin: 0 auto;
    padding: 0 50px;
    box-sizing: border-box; }
    @media screen and (max-width: 1160px) {
      #contact__inner {
        width: auto;
        padding: 0 40px; } }
    @media screen and (max-width: 600px) {
      #contact__inner {
        padding: 0 8vw; } }
    #contact__inner .contact--title {
      font-size: 40px;
      font-weight: bold;
      line-height: 1;
      letter-spacing: 0.05em;
      color: #098BDE;
      margin: 0 0 70px; }
      @media screen and (max-width: 600px) {
        #contact__inner .contact--title {
          font-size: 6.933vw;
          margin-bottom: 16vw; } }
    #contact__inner .contact--text {
      font-size: 16px;
      line-height: 1.875;
      text-align: justify;
      text-justify: inter-ideograph;
      margin: 0 0 40px; }
      @media screen and (max-width: 600px) {
        #contact__inner .contact--text {
          font-size: 3.733vw;
          margin-bottom: 26.667vw; } }

#contact--content .contact--content--title {
  font-size: 25px;
  font-weight: bold;
  line-height: 1.4;
  letter-spacing: 0.05em;
  color: #fff;
  background: #BEA574;
  margin: 0 0 40px;
  padding: 15px;
  box-sizing: border-box; }
  @media screen and (max-width: 600px) {
    #contact--content .contact--content--title {
      font-size: 4.8vw;
      padding: 4vw 8vw;
      margin-bottom: 10.667vw; } }

#contact--form {
  padding: 0 40px; }
  @media screen and (max-width: 600px) {
    #contact--form {
      padding: 0; } }
  #contact--form dl {
    margin: 0 0 50px;
    padding: 0; }
    @media screen and (max-width: 600px) {
      #contact--form dl {
        margin-bottom: 8vw; } }
    #contact--form dl > dt {
      font-size: 16px;
      font-weight: normal;
      line-height: 1.875;
      text-align: justify;
      text-justify: inter-ideograph;
      margin: 0 0 15px;
      padding: 0; }
      @media screen and (max-width: 600px) {
        #contact--form dl > dt {
          font-size: 3.733vw;
          margin-bottom: 4vw; } }
      #contact--form dl > dt span {
        color: #F03D61; }
    #contact--form dl > dd {
      font-size: 16px;
      font-weight: normal;
      line-height: 1.875;
      text-align: justify;
      text-justify: inter-ideograph;
      margin: 0;
      padding: 0; }
      @media screen and (max-width: 600px) {
        #contact--form dl > dd {
          font-size: 3.733vw;
          padding: 0 !important; } }
      #contact--form dl > dd.contact--type {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start; }
        @media screen and (max-width: 600px) {
          #contact--form dl > dd.contact--type {
            display: block; } }
        #contact--form dl > dd.contact--type label {
          flex: 0 0 45%;
          margin: 0 5% 0 0; }
          @media screen and (max-width: 600px) {
            #contact--form dl > dd.contact--type label {
              display: block;
              flex: none;
              margin: 0 0 4vw; } }
  #contact--form input[type="text"],
  #contact--form input[type="email"],
  #contact--form input[type="tel"] {
    font-size: 16px;
    height: 40px;
    width: 100%;
    box-sizing: border-box;
    border: 2px solid #CCC;
    padding: 5px; }
    @media screen and (max-width: 600px) {
      #contact--form input[type="text"],
      #contact--form input[type="email"],
      #contact--form input[type="tel"] {
        height: 10.667vw;
        font-size: 3.733vw; } }
  #contact--form input[type="checkbox"] {
    margin: 0 0.5em 0 0; }
  #contact--form textarea {
    font-size: 16px;
    width: 100%;
    height: 200px;
    box-sizing: border-box;
    border: 2px solid #CCC;
    padding: 5px; }
    @media screen and (max-width: 600px) {
      #contact--form textarea {
        height: 53.333vw;
        font-size: 3.733vw;
        padding: 1.6vw; } }
  #contact--form .contact--privacy {
    font-size: 16px;
    font-weight: normal;
    line-height: 1.875;
    margin: 0 0 60px;
    padding: 0; }
    @media screen and (max-width: 600px) {
      #contact--form .contact--privacy {
        font-size: 3.733vw;
        margin-bottom: 10.667vw;
        text-align: center; } }
    #contact--form .contact--privacy a {
      text-decoration: underline; }
  #contact--form .contact--form--submit #contact--submit {
    font-size: 25px;
    font-weight: bold;
    line-height: 1;
    letter-spacing: 0.05em;
    color: #fff;
    max-width: 564px;
    width: 100%;
    height: 85px;
    background: #BEA574;
    border: none;
    border-radius: 99999px;
    box-shadow: 0px 5px 0px rgba(0, 0, 0, 0.16);
    text-shadow: none;
    transition: opacity 300ms ease-in-out; }
    @media screen and (max-width: 600px) {
      #contact--form .contact--form--submit #contact--submit {
        font-size: 5.333vw;
        max-width: inherit;
        height: 21.333vw;
        box-shadow: 0px 1.333vw 0px rgba(0, 0, 0, 0.16); } }
    #contact--form .contact--form--submit #contact--submit:hover {
      cursor: pointer;
      opacity: 0.8; }

#thanks {
  margin: 0;
  padding: 120px 0; }
  @media screen and (max-width: 600px) {
    #thanks {
      padding: 32vw 0; } }
  #thanks__inner {
    width: 900px;
    margin: 0 auto;
    min-height: 60vh; }
    @media screen and (max-width: 600px) {
      #thanks__inner {
        width: auto;
        padding: 0 8vw; } }
    #thanks__inner .thanks--title {
      font-size: 25px;
      line-height: 1;
      letter-spacing: 0.05em;
      color: #fff;
      background: #098BDE;
      margin: 0 0 50px;
      padding: 15px;
      box-sizing: border-box; }
      @media screen and (max-width: 600px) {
        #thanks__inner .thanks--title {
          font-size: 5.333vw;
          margin-bottom: 10.667vw;
          padding: 4vw 8vw; } }
    #thanks__inner .thanks--text {
      font-size: 16px;
      line-height: 1.875;
      text-align: justify;
      text-justify: inter-ideograph; }
      @media screen and (max-width: 600px) {
        #thanks__inner .thanks--text {
          font-size: 3.733vw; } }

#footer {
  margin: 0;
  padding: 0;
  background: #098BDE; }
  #footer__inner {
    width: 900px;
    margin: 0 auto;
    padding: 0; }
    @media screen and (max-width: 600px) {
      #footer__inner {
        width: auto;
        padding: 0 8vw; } }
    #footer__inner #copyright__inner {
      font-size: 13px;
      line-height: 1.462;
      color: #fff;
      margin: 0;
      padding: 13px 0; }
      @media screen and (max-width: 600px) {
        #footer__inner #copyright__inner {
          font-size: 3.2vw;
          padding: 3.2vw 0; } }

#pagetop {
  z-index: 8000;
  position: fixed;
  right: 50px;
  bottom: 100px;
  width: 81px;
  height: 81px;
  background: #098BDE;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.25;
  color: #fff;
  padding: 15px 0 0;
  box-sizing: border-box;
  transition: opacity 300ms ease-in-out; }
  @media screen and (max-width: 600px) {
    #pagetop {
      right: 6.933vw;
      bottom: 13.333vw;
      width: 17.6vw;
      height: 17.6vw;
      font-size: 3.733vw;
      line-height: 1.286;
      padding-top: 3.2vw; } }
  #pagetop:hover {
    opacity: 0.8;
    cursor: pointer; }
  #pagetop::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    border-top: 0 solid transparent;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 13px solid #fff; }
    @media screen and (max-width: 600px) {
      #pagetop::before {
        border-left-width: 2.133vw;
        border-right-width: 2.133vw;
        border-bottom-width: 3.467vw; } }

.sp-br {
  display: none; }
  @media screen and (max-width: 600px) {
    .sp-br {
      display: inline-block; } }

em {
  color: #F03D61;
  font-style: normal; }

/* clearfix */
.clearfix:after {
  content: " ";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0; }

/*# sourceMappingURL=dtp.css.map */