/* ====================
 # CASTER BIZ
 ===================== */

/* Reset -------------- */
/*!
 * Bootstrap Reboot v4.5.0 (https://getbootstrap.com/)
 * Copyright 2011-2020 The Bootstrap Authors
 * Copyright 2011-2020 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
 */
 *,*::before,*::after{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus:not(:focus-visible){outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0}p{margin-top:0;margin-bottom:1rem}abbr[title],abbr[data-original-title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul,dl{margin:0;padding:0;list-style:none}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}pre,code,kbd,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto;-ms-overflow-style:scrollbar}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[role="button"]{cursor:pointer}select{word-wrap:normal}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button:not(:disabled),[type="button"]:not(:disabled),[type="reset"]:not(:disabled),[type="submit"]:not(:disabled){cursor:pointer}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{padding:0;border-style:none}input[type="radio"],input[type="checkbox"]{box-sizing:border-box;padding:0}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{outline-offset:-2px;-webkit-appearance:none}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item;cursor:pointer}template{display:none}[hidden]{display:none!important}

/* Base -------------- */

html, body {
  scroll-padding-top: 86px; /* ページ内スクロールの着地点をずらす */
}

html {
  background-color: #FFFFFF;
}

body {
  font-family: a-otf-futo-go-b101-pr6n, sans-serif;
  font-style: normal;
  font-weight: 500;
  color: #120F08;
}

/* display -------------- */
@media screen and (min-width:768px){
  .spOnly {
    display: none;
  }
}
@media screen and (max-width:767px){
  .pcOnly {
    display: none;
  }
}

/* Button -------------- */
.button {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 2px solid #FFFFFF;
  padding: 0 24px;
  height: 74px;
  font-size: 13px;
  color: #FFFFFF;
  text-decoration: none;
}

.button-white {
  border-color: currentColor;
  background-color: transparent;
  color: #FFFFFF;
}

.button-red {
  border-color: #E73D1B;
  background-color: #E73D1B;
  color: #FFFFFF;
}

.button-red:hover {
  color: #FFFFFF;
}

.button-hover-red:hover {
  border-color: #E73D1B !important;
  background-color: #E73D1B !important;
  color: #FFFFFF !important;
}

.button-blue {
  border-color: #09499D;
  background-color: #09499D;
  color: #FFFFFF;
}

.button-blue:hover {
  color: #FFFFFF;
}

.button-hover-blue:hover {
  border-color: #09499D !important;
  background-color: #09499D !important;
  color: #FFFFFF !important;
}

.button-palegreen {
  border-color: #81B3BA;
  background-color: #81B3BA;
  color: #FFFFFF;
}

.button-palegreen:hover {
  color: #FFFFFF;
}

.button-hover-palegreen:hover {
  border-color: #81B3BA !important;
  background-color: #81B3BA !important;
  color: #FFFFFF !important;
}

.button-green {
  border-color: #15946B;
  background-color: #15946B;
  color: #FFFFFF;
}

.button-green:hover {
  color: #FFFFFF;
}

.button-green-red:hover {
  border-color: #15946B !important;
  background-color: #15946B !important;
  color: #FFFFFF !important;
}


.button-yellow {
  border-color: #FFC200;
  background-color: #FFC200;
  color: #FFFFFF;
}

.button-yellow:hover {
  color: #FFFFFF;
}

.button-hover-yellow:hover {
  border-color: #FFC200 !important;
  background-color: #FFC200 !important;
  color: #FFFFFF !important;
}

.button-purple {
  border-color: #584C9C;
  background-color: #584C9C;
  color: #FFFFFF;
}

.button-purple:hover {
  color: #FFFFFF;
}

.button-hover-purple:hover {
  border-color: #584C9C !important;
  background-color: #584C9C !important;
  color: #FFFFFF !important;
}

/* Arrow -------------- */
.arrow {
  display: inline-block;
  border-top: 15px solid currentColor;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
}

.arrow-red {
  color: #E73D1B;
}

.arrow-white {
  color: #FFFFFF;
}

.arrow-gray {
  color: #F3F5F7;
}

.arrow-blue {
  color: #09499D;
}

.arrow-palegreen {
  color: #81B3BA;
}

.arrow-green {
  color: #15946B;
}

.arrow-yellow {
  color: #FFC200;
}

.arrow-purple {
  color: #584C9C;
}

/* SiteHeader -------------- */
.siteHeader {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 76px;
  transition: 200ms background-color ease-out;
}

.siteHeader-name {
  line-height: 1;
}

.siteHeader-logo {
  width: 208px;
  height: 43px;
}

.siteHeader-logo[id="headerLogo"],
.siteHeader-logo[id="headerLogoSwap"] {
  display: none;
}

.siteHeader-logo[id="headerLogo"].is-logo-show,
.siteHeader-logo[id="headerLogoSwap"].is-logo-show {
  display: block;
}

.siteHeader-dummy {
  padding: 16px 14px;
}

.siteHeader-dummyLogo {
  width: 100%;
  max-height: 112px;
  height: auto;
}

.siteHeader-contact {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  color: #FFFFFF;
}

.siteHeader-contactTel {
  display: none;
}

.siteHeader-contactTel * {
  margin: 0;
}

.siteHeader-contactMailIcon {
  display: flex;
  align-items: center;
  padding: 0 18px;
  height: 53px;
  line-height: 1;
}

.siteHeader-contactMailButton {
  display: none;
  height: 61px;
}

.siteHeader-nav {
  position: absolute;
  top: 0;
  left: 0;
}

.siteHeader-navButton {
  border: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  height: 53px;
  padding: 0 12px;
}

.siteHeader-navButton:focus {
  outline: none;
}

.siteHeader-navButton *:nth-child(1) {
  display: block;
  width: 40px;
  height: 3px;
  background-color: #000000;
}

.siteHeader-navButton *:nth-child(2) {
  display: block;
  margin-top: 6px;
  width: 40px;
  height: 3px;
  background-color: #000000;
}

.siteHeader-navList {
  display: none;
}

.siteHeader.is-sticky {
  opacity: 1;
  pointer-events: auto;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background-color: #FFFFFF;
}

.siteHeader.is-sticky .siteHeader-navButton *:nth-child(1) {
  background-color: #000000;
}

.siteHeader.is-sticky .siteHeader-navButton *:nth-child(2) {
  background-color: #000000;
}

.siteHeader.is-sticky .siteHeader-contact {
  color: #000000;
}

.siteHeader.is-sticky .siteHeader-contactMailButton {
  color: #000000;
  border-color: currentColor;
}

.siteHeader-nav.is-nav-open {
  position: fixed;
  z-index: 100;
  width: 100%;
  height: 100vh;
}

.siteHeader-nav.is-nav-open .siteHeader-navList {
  overflow: auto;
  position: absolute;
  top: 53px;
  left: 0;
  bottom: 0;
  display: block;
  padding-top: 43px;
  width: 100%;
}

@media (min-width: 1360px) {
  .siteHeader {
    opacity: 1;
    pointer-events: auto;
    height: 110px;
  }

  .siteHeader-logo {
    width: 561px;
    height: 87px;
  }

  .siteHeader-dummy {
    display: none;
  }

  .siteHeader-contact {
    position: absolute;
    top: 25px;
    right: 20px;
    color: #FFFFFF;
    display: flex;
    align-items: center;
  }

  .siteHeader-contactTel {
    display: block;
    margin: 0 16px 0 0;
    text-align: center;
    line-height: 1.5;
    font-family: futura-pt, sans-serif;
  }

  .siteHeader-contactTel * {
    margin: 0;
  }

  .siteHeader-contactMailIcon {
    display: none;
  }

  .siteHeader-contactMailButton {
    display: flex;
    height: 61px;
  }

  .siteHeader-navButton {
    border: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: transparent;
    height: 110px;
    padding: 0 20px;
  }

  .siteHeader-navButton *:nth-child(1) {
    display: block;
    width: 70px;
    height: 3px;
    background-color: #FFFFFF;
  }

  .siteHeader-navButton *:nth-child(2) {
    display: block;
    margin-top: 15px;
    width: 70px;
    height: 3px;
    background-color: #FFFFFF;
  }

  .siteHeader.is-sticky {
    height: 86px;
  }

  .siteHeader.is-sticky .siteHeader-logo {
    width: auto;
    height: 61px;
  }

  .siteHeader.is-sticky .siteHeader-navButton {
    height: 86px;
  }

  .siteHeader.is-sticky .siteHeader-navButton *:nth-child(1) {
    background-color: #000000;
  }

  .siteHeader.is-sticky .siteHeader-navButton *:nth-child(2) {
    background-color: #000000;
  }

  .siteHeader.is-sticky .siteHeader-contact {
    color: #000000;
  }


  .siteHeader.is-sticky .siteHeader-contact {
    top: 14px;
  }

  .siteHeader.is-sticky .siteHeader-contactMailButton {
    color: #000000;
    border-color: currentColor;
  }

  .siteHeader-nav.is-nav-open {
    position: fixed;
    z-index: 100;
    width: 364px;
    height: 100vh;
    background-color: #000;
  }

  .siteHeader-nav.is-nav-open .siteHeader-navList {
    display: block;
    width: 364px;
    background-color: #000;
  }

  .siteHeader-nav.is-nav-open .siteHeader-navButton *:nth-child(1) {
    background-color: #FFFFFF !important;
  }

  .siteHeader-nav.is-nav-open .siteHeader-navButton *:nth-child(2) {
    background-color: #FFFFFF !important;
  }

  .siteHeader-nav.is-nav-open .siteHeader-navList {
    top: 86px;
  }

  .siteHeader-nav.is-nav-open .siteHeader-navButton *:nth-child(1) {
    background-color: #FFFFFF !important;
  }

  .siteHeader-nav.is-nav-open .siteHeader-navButton *:nth-child(2) {
    background-color: #FFFFFF !important;
  }
}

/* SiteNav -------------- */
.siteNav {
  background-color: #000;
}

.siteNav-list a {
  display: block;
  padding: 12px 40px;
  text-align: center;
  color: #FFFFFF;
  text-decoration: none;
  font-size: 13px;
}

.siteNav-list a:hover {
  text-decoration: underline;
}

@media (min-width: 1360px) {
  .siteNav-list a {
    padding: 12px 40px;
    text-align: left;
    font-size: 18px;
  }
}

/* SiteLead -------------- */
.siteLead {
  color: #FFFFFF;
}

.siteLead * {
  margin-bottom: 0;
}

.siteLead-text {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 20px;
  line-height: 1.6;
  font-size: 26px;
  text-align: center;
}

.siteLead-text.siteLead-text-recruiting {
  font-size: 24px;
}

.siteLead-text.siteLead-text-accounting {
  font-size: 22px;
}

.siteLead-text.siteLead-text-insideSales {
  font-size: 22px;
  text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
}

.siteLead-text.siteLead-text-hr {
  /*font-size: 22px;*/
  text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
}

@media (min-width: 1360px) {
  .siteLead {
    position: relative;
    margin: 0 auto;
    width: 1360px;
    height: 905px;
    color: #FFFFFF;
  }

  .siteLead-text {
    position: absolute;
    line-height: 1.6;
    font-size: 28px;
    text-align: left;
  }

  .siteLead-text.siteLead-text-casterbiz {
    top: 297px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
    left: 143px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
  }

  .siteLead-text.siteLead-text-recruiting {
    top: 297px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
    left: 143px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
  }

  .siteLead-text.siteLead-text-accounting {
    top: 297px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
    left: 143px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
  }

  .siteLead-text.siteLead-text-hr {
    top: 297px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
    left: 143px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
  }

  .siteLead-text.siteLead-text-insideSales {
    top: 297px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
    left: 143px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
  }

  .siteLead-text.siteLead-text-executive {
    top: 297px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
    left: 143px;  /* サービスごとのキービジュアルにあわせたコピーのポジション */
  }
}

@media (max-width: 374px) {

  .siteLead-text.siteLead-text-insideSales {
    font-size: 5.866666666666666vw;
  }
}

/* Billboard, Key visual -------------- */

.billboard {
  position: relative;
  min-height: 100vh;
  /* display: none; */
}

.billboard-casterviz {
  background-image: url(../img/keyvisual-casterbiz.jpg); /* サービスごとのキービジュアル */
  background-position: center;
  background-size: cover;
}

.billboard-recruiting {
  background-image: url(../img/keyvisual-recruiting.jpg); /* サービスごとのキービジュアル */
  background-position: center;
  background-size: cover;
}

.billboard-accounting {
  background-image: url(../img/keyvisual-accounting.jpg); /* サービスごとのキービジュアル */
  background-position: center;
  background-size: cover;
}

.billboard-hr {
  background-image: url(../img/keyvisual-hr.jpg); /* サービスごとのキービジュアル */
  background-position: center;
  background-size: cover;
}

.billboard-insideSales {
  background-image: url(../img/keyvisual-sales.jpg); /* サービスごとのキービジュアル */
  background-position: center;
  background-size: cover;
}

.billboard-executive {
  background-image: url(../img/keyvisual-executive.jpg); /* サービスごとのキービジュアル */
  background-position: center;
  background-size: cover;
}

@media (min-width: 1360px) {
  .billboard {
    min-height: 905px;
    /* display: none; */
  }
}

/* Section -------------- */
.section {
  padding-top: 74px;
  padding-bottom: 74px;
}

.section-header {
  margin-bottom: 18px;
  text-align: center;
  font-family: futura-pt, sans-serif;
  font-weight: normal;
  letter-spacing: 4px;
  line-height: 1.2;
  font-size: 36px;
}

.section-lead {
  padding: 0 12px;
  text-align: center;
  line-height: 1.5;
  font-size: 13px;
}

@media (min-width: 768px) {
  .section {
    padding-top: 120px;
    padding-bottom: 120px;
  }

  .section-header {
    margin-bottom: 24px;
    font-size: 48px;
  }

  .section-lead {
    font-size: 14px;
  }
}

/* Promo -------------- */
.promoA {
  padding-top: 74px;
  padding-bottom: 74px;
}

.promoB {
  padding-top: 84px;
  padding-bottom: 98px;
  background-color: #000000;
  background-image: url(../img/bg-promoB.jpg);
  background-size: cover;
}

.promoC {
  padding-top: 84px;
  padding-bottom: 98px;
  background-image: url(../img/bg-promoC.jpg);
  background-size: cover;
}

.promoC.recruiting {
  background-image: url(../img/bg-promoC_recruiting.jpg);
  background-position: center;
  background-size: cover;
}

.promoC.accounting {
  background-image: url(../img/bg-promoC_accounting.jpg);
  background-position: center;
  background-size: cover;
}

.promoC.hr {
  background-image: url(../img/bg-promoC_hr.jpg);
  background-position: center;
  background-size: cover;
}

.promoC.insideSales {
  background-image: url(../img/bg-promoC_insidesales.jpg);
  background-position: center;
  background-size: cover;
}

.promoC.executive {
  background-image: url(../img/bg-promoC_executive.jpg);
  background-position: center;
  background-size: cover;
}

.promo-text {
  margin-bottom: 24px;
  text-align: center;
  line-height: 1.5;
  font-size: 19px;
}

.promo-subtext {
  margin-bottom: 16px;
  text-align: center;
  line-height: 1.7;
  font-size: 12px;
}

.promo-action {
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
  width: 304px;
}

@media (min-width: 1360px) {
  .promoA-body {
    margin: 0px auto;
    padding: 0;
    max-width: 1130px;
  }
  .promoA-block {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
}

.promoA-left{
      position: relative;
      display: flex;
      flex-direction: column;
  }

  .promoA-left .promo-text {
    text-align: left;
  }

  .promoA-left .promo-subtext {
    text-align: left;
  }

  .promoA .promo-action {
    margin-top: 40px;
    margin-left: 80px;
    margin-right: 0px;
    width: 304px;
}
}

@media (min-width: 768px) {
  .promo-text {
    margin-bottom: 16px;
    font-size: 26px;
  }

  .promo-subtext {
    font-size: 14px;
  }
}

/* Features -------------- */
.feature-body {
  margin: 60px auto 0;
  padding: 0 24px;
  text-align: center;
}

.feature-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
}

.feature-list > *:not(:first-child) {
  margin-top: 60px;
}

.featureItem {
  text-align: center;
  max-width: 560px;
}

.featureItem-image {
  margin-bottom: 36px;
}

.featureItem-text {
  margin-bottom: 25px;
  line-height: 1.5;
  font-size: 18px;
}

.featureItem-subtext {
  text-align:left;
  line-height: 1.7;
  font-size: 12px;
  word-break: break-all;
}

@media (min-width: 768px) {

  .featureItem-text {
    font-size: 18.5px;
  }

  .featureItem-subtext {
    text-align:left;
    font-size: 13px;
  }
}

@media (min-width: 1360px) {
  .feature-body {
    margin: 80px auto 0;
    padding: 0;
    max-width: 1130px;
  }

  .feature-list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: normal;
    margin-left: -29px;
    margin-right: -29px;
  }

  .feature-list > * {
    margin-left: 29px;
    margin-right: 29px;
  }

  .feature-list > *:not(:first-child) {
    margin-top: 0;
  }

  .featureItem {
    text-align: center;
    width: 338px;
  }

  .featureItem-image {
    margin-bottom: 52px;
  }
}

/* Use case -------------- */
.usecase-body {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  margin: 52px 24px 0;
}

.usecase-section:not(:last-child) {
  margin-bottom: 80px;
}

.usecase-title {
  border-bottom: 1px solid;
  margin-bottom: 25px;
  padding-bottom: 25px;
  text-align: center;
  line-height: 1.2;
  font-size: 18px;
}

.usecase-list > *:not(:last-child) {
  margin-bottom: 70px;
}

.usecase-section {
  max-width: 560px;
  text-align: center;
}

.usecase-heading {
  margin-bottom: 18px;
  line-height: 1.5;
  font-size: 13px;
}

.usecase-arrow {
  margin-bottom: 12px;
  fill: currentColor;
}

.usecase-text {
  line-height: 1.7;
  font-size: 15px;
  text-align: left;
}

@media (min-width: 768px) {
  .usecase-section {
    margin: 0 auto;
    max-width: 560px;
  }
}

@media (min-width: 1360px) {
  .usecase-body {
    margin: 80px auto 0;
    max-width: 1130px;
    flex-direction: row;
    align-items: flex-start;
  }

  .usecase-section {
    margin: 0 auto;
    max-width: 100%;
  }

  .usecase-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: -41px;
    margin-right: -41px;
    margin-top: -71px;
  }

  .usecase-list > * {
    margin-left: 41px;
    margin-right: 41px;
    margin-top: 71px;
  }

  .usecase-list > *:not(:last-child) {
    margin-bottom: 0;
  }

  .usecase-item {
    width: 322px;
    text-align: center;
  }
}

/* Service */
.service-body {
  margin: 64px auto 0;
}

.service-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  margin-top: -51px;
}

.service-list > * {
  margin-top: 51px;
}

.service-item {
  width: 274px;
  text-align: center;
}

.service-title {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 15px;
  min-height: 49px;
  line-height: 1.5;
  font-size: 14px;
  color: #FFFFFF;
}

.service-menu {
  line-height: 1.7;
  font-size: 12px;
}

.service-menu.taL {
  text-align: left;
}

@media (min-width: 768px) {
  .service-body {
    max-width: 560px;
  }

  .service-list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    margin-left: -6px;
    margin-right: -6px;
    margin-top: -51px;
  }

  .service-list > * {
    margin-left: 6px;
    margin-right: 6px;
    margin-top: 51px;
  }
}

@media (min-width: 1360px) {
  .service-body {
    margin: 80px auto 0;
    max-width: 1132px;
  }

  .service-body.-column4 {
    max-width: 1132px;
  }

  .service-body.-column3 {
    max-width: 846px;
  }
}

/* Voice */
.voice-body {
  margin: 64px auto 0;
}

.voice-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
}

.voice-list > *:not(:last-child) {
  margin-bottom: 57px;
}

.voice-item {
  max-width: 560px;
  width: 280px;
  text-align: center;
}

.voice-logo {
  width: 71.428571428571429%;
  margin: 0 auto 20px;
}

.voice-logo img {
  max-width: 100%;
}

.voice-name {
  margin-bottom: 25px;
  line-height: 1.2;
  font-size: 27px;
  font-family: futura-pt, sans-serif;
  font-weight: normal;
  letter-spacing: 2px;
}

.voice-text {
  text-align: left;
  line-height: 1.7;
  font-size: 14px;
  text-align: center;
}

@media (min-width: 768px) {
  .voice-body {
    max-width: 602px;
  }

  .voice-list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: -40px;
  }

  .voice-list > * {
    margin-top: 40px;
  }

  .voice-list > *:not(:last-child) {
    margin-bottom: 0;
  }

  .voice-item {
    width: 280px;
    text-align: center;
  }
}

@media (min-width: 1360px) {
  .voice-body {
    margin: 80px auto 0;
    max-width: 1246px;
  }

  .voice-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: -21px;
    margin-right: -21px;
  }

  .voice-list > * {
    margin-left: 21px;
    margin-right: 21px;
  }

  .voice-list > *:not(:last-child) {
    margin-bottom: 0;
  }
}

/* Case study */
.casestudy-body {
  margin: 64px auto 0;
}

.casestudy-list {
  display: block;
}

.casestudy-list > *:not(:last-child) {
  margin-bottom: 40px;
}

.casestudy-item {
  width: 300px;
  text-align: center;
  margin:0 auto;
}

.casestudy-image {
  width: 300px;
  height: auto;
}

.casestudy-name {
  line-height: 1.5;
  font-size: 14px;
  font-family: futura-pt, sans-serif;
  letter-spacing: 2px;
  text-align: left;
  padding:20px 10px;
  background: #82b4bb;
  color: #ffffff;
}

.casestudy-item a{
 text-decoration: none;
}

.casestudy-item a:hover{
opacity: 0.5 ;
}

/* 矢印 */
.prev{
    position: absolute;
    /*display: none;*/
    top: 50%;
    left: 2%;
    width: 30px;
    height: 30px;
    border-bottom: 2px solid black;
    border-left: 2px solid black;
    cursor: pointer;
    transform: translateY(-50%) rotate(45deg);
}

.next{
    position: absolute;
    top: 50%;
    right: 2%;
    width: 30px;
    height: 30px;
    border-bottom: 2px solid black;
    border-right: 2px solid black;
    cursor: pointer;
    transform: translateY(-50%) rotate(-45deg);
}

.casestudy-text {
  margin-bottom: 15px;
  text-align: left;
  line-height: 1.7;
  font-size: 14px;
}

.casestudy-action {
  text-align: center;
  line-height: 1.7;
  font-size: 14px;
}

.casestudy-action a {
  text-decoration: underline;
  color: inherit;
}


@media (min-width: 768px) {
  .casestudy-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 560px;
  }
}

@media (min-width: 1360px) {
  .casestudy-body {
    margin: 80px auto 0;
    max-width: 1200px;
    width:100%;
    position: relative;
    overflow: hidden;
  }

  .casestudy-list {
    padding:0 5%;
    height: 270px;
  }

  .casestudy-list > * {
    margin-left: 20px;
  }

  .casestudy-list > *:not(:last-child) {
    margin-bottom: 0;
  }

  .casestudy-item {
    width: 350px;
    text-align: center;
  }

  .casestudy-image {
    width: 350px;
    height: auto;
  }

  .item{
    width: 330px;
    display: inline-block;
}

}

/*case下層*/
.case-body {margin: 60px 20px;}
#case .box {margin: 80px auto;}
#case article {width: 100%;height: 100%;position: relative;box-shadow: 0 0 5px rgba(0,0,0,.1);border-radius: 5px;}
#case article a {display: block;width: 100%;height: 100%;color:#000000;text-decoration: none;}
#case article img {width: 100%;border-radius: 5px 5px 0 0 / 5px 5px 0 0;-webkit-border-radius: 5px 5px 0 0 / 5px 5px 0 0;-moz-border-radius: 5px 5px 0 0 / 5px 5px 0 0;}
#case article article {width: 100%;padding:20px;box-shadow: 0 0 0 rgb(0 0 0 / 0%);border-radius: 0px;}
#case article article h4 {font-size: 0.85em;line-height: 1.5em;}
#case article article p {font-size: 0.8em;}
#case .details { width: 100%;}
#case .details .introduction dl dt {width: 100%;margin: 0 auto;text-align: center;}
#case .details .introduction dl dt img{width:150px;height:150px;border-radius: 50%;background-position: center;}
#case .details .introduction dl dd {width: 100%;margin: 0 10px 0 3px;}
#case .details .introduction dl dd div.tl {margin-top: 10px;font-size: 1.2em;}
#case .details .introduction dl dd p {font-size: 1rem;}
#case .details .introduction dl{margin:50px 0px;border-bottom: solid 3px #e83d1b;position: relative;}
#case .details .introduction dl:after {position: absolute;content: " ";display: block;border-bottom: solid 3px #82b4bc;bottom: -3px;width: 50%;}
#case .details h4{font-size:1.2rem;line-height: 2em;border-bottom: 2px solid #82b4bb;margin:50px 0px;}
#case .details figure img{max-width:100%;margin:30px 0px 0px 0px;}
#case .details p{font-size:1rem;line-height:1.8rem;}
#case .details span{font-size:0.9rem;line-height:1.8rem;color:#898686;}
#case .details p.interview{color:#0b499e;font-weight:bold;}
#case .details p.interview:before{content:"ー";color:#0b499e;}
#case .details span.speraker{color:#0b499e;font-weight:bold;}
#case .details span.speraker:after{content:":";margin-right:10px;}
#case .details ul.sns{margin:30px auto;padding: 0px;text-align: center;display: block;}
#case .details ul.sns li {display: inline-block;}
#case .details ul.sns li.fb {background: #3b5998;margin-right: 2%;}
#case .details ul.sns li a {text-decoration: none;padding: 5px 25px;color: #FFF;}
#case .details ul.sns li.tw {background: #55acee;}
#case .details .center {margin:50px auto;text-align:center;width: 320px;}
#case .details .box_link {border:solid 1px #333333;padding:10px;margin:50px 0px;}

@media (min-width: 1360px) {
.case-body {margin: 80px auto 0;max-width: 1130px;}
#case .box{margin:80px auto;}
#case article{margin:30px auto;width:80%;padding:0px;height:153px;}
#case article:hover{opacity: 0.8;}
#case article a {width: 100%;height:153px;text-decoration: none;padding:0px;margin:0px;color:#000000;}
#case article img{width:30%;height:153px;display:inline-block;object-fit: cover;border-radius: 5px 0 0 5px / 5px 0 0 5px;-webkit-border-radius: 5px 0 0 5px / 5px 0 0 5px;-moz-border-radius: 5px 0 0 5px / 5px 0 0 5px;}
#case article article{width:62%;vertical-align:top;display:inline-block;padding-top:20px;margin:0px 0px 0px 20px;}
#case article article h4{font-size:1.1em;}
#case article article p{margin:0px;padding:0px;}
#case .details{margin:80px auto;width:800px;}
#case .details .introduction dl dt{display:inline-block;width:20%;vertical-align:top;}
#case .details .introduction dl dd{display:inline-block;width:74%;margin:0 0 0 40px;padding:0;}
#case .details .introduction dl dd div.tl{font-size:1.8em;font-weight:bold;line-height:1.5em;}
#case .details .introduction dl dd p{font-size:1rem;}

}


/* Price */
.price-body {
  margin: 60px auto 0;
}

.price-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
}

.price-list > *:not(:last-child) {
  margin-bottom: 40px;
}

.price-item {
  width: 256px;
  text-align: center;
}

.price-sub {
  margin: 0 0 1em 0;
  font-size: 12px;
  text-align: center;
}

.price-name {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40px;
  margin-bottom: 25px;
  line-height: 1.2;
  font-size: 15px;
  font-family: futura-pt, sans-serif;
  font-weight: normal;
  letter-spacing: 1px;
  color: #FFFFFF;
}

.price-label {
  margin-bottom: 10px;
  line-height: 1.2;
}

.price-yen {
  margin-right: 10px;
  font-size: 14px;
}

.price-value {
  font-size: 32px;
  font-family: futura-pt, sans-serif;
  font-weight: normal;
}

.price-unit {
  margin-left: 10px;
}

.price-period {
  margin-bottom: 20px;
  line-height: 1.2;
  font-size: 11px;
}

.price-menu {
  line-height: 1.5;
  font-size: 11px;
}

.price-menu > * {
  margin-bottom: 5px;
}

.price-text {
  text-align: left;
  line-height: 1.7;
  font-size: 12px;
}

.price-outro {
  margin: 40px 0 0;
  line-height: 1.7;
  font-size: 12px;
  text-align: center;
}

@media (min-width: 768px) {
  .price-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 542px;
  }

  .price-list {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }
}

@media (min-width: 1360px) {
  .price-body {
    justify-content: center;
    margin: 80px auto 0;
    max-width: 1132px;
    width: 100%;
  }

  .price-list {
    margin-left: -18px;
    margin-right: -18px;
    margin-top: -40px;
  }

  .price-list > * {
    margin-left: 18px;
    margin-right: 18px;
    margin-top: 40px;
  }

  .price-list > *:not(:last-child) {
    margin-bottom: 0;
  }
}

/* Step -------------- */
.step-body {
  margin: 64px auto 0;
}

.step-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
}

.step-list > *:not(:last-child) {
  margin-bottom: 54px;
}

.step-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 324px;
}

.step-label {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 149px;
  height: 29px;
  margin-bottom: 25px;
  line-height: 1.2;
  font-size: 15px;
  font-family: futura-pt, sans-serif;
  font-weight: normal;
  letter-spacing: 1px;
  background-color: #000;
  color: #FFFFFF;
}

.step-name {
  margin-bottom: 25px;
  line-height: 1.5;
  font-size: 16px;
}

.step-text {
  text-align: left;
  line-height: 1.7;
  font-size: 12px;
}

.step-arrow {
  position: absolute;
  top: -42px;
  fill: currentColor;
}

@media (min-width: 1360px) {
  .step-body {
    margin: 80px auto 0;
    max-width: 1130px;
  }

  .step-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: normal;
    flex-direction: row;
    margin-left: -29px;
    margin-right: -29px;
    margin-top: -40px;
  }

  .step-list > * {
    margin-left: 29px;
    margin-right: 29px;
    margin-top: 40px;
  }

  .step-list > *:not(:last-child) {
    margin-bottom: 0;
  }

  .step-arrow {
    position: absolute;
    top: 74px;
    left: -42px;
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }
}

/* Clients -------------- */

.clients-body {
  margin: 60px auto 0;
  max-width: 480px;
}

.clients-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: -20px;
}

.clients-list > * {
  flex: 1 1 50%;
  margin-top: 20px;
  text-align: center;
}

.clients-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.clients-logo {
  max-width: 160px;
  height: auto;
}

@media (min-width: 768px) {
  .clients-body {
    max-width: 768px;
  }
  .clients-list > * {
    flex-basis: 25%;
  }
}

@media (min-width: 1360px) {
  .clients-body {
    margin: 80px auto 0;
    max-width: 1130px;
  }

  .clients-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .clients-list > * {
    flex-basis: 16%;
  }
}

/* FAQ -------------- */
.faq-body {
  margin: 64px auto 0;
}

.faq-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  margin-left: 30px;
  margin-right: 30px;
}

.faq-list > *:not(:last-child) {
  margin-bottom: 30px;
}

.faq-item {
  max-width: 530px;
}

.faq-title {
  position: relative;
  margin-bottom: 12px;
  padding-left: 33px;
  line-height: 1.5;
  font-size: 15px;
}

.faq-cap {
  position: absolute;
  top: -6px;
  left: 0;
  line-height: 1.1;
  font-size: 30px;
  font-family: futura-pt, sans-serif;
  font-weight: normal;
}

.faq-text {
  line-height: 1.7;
  font-size: 13px;
}

@media (min-width: 1360px) {
  .faq-body {
    margin: 80px auto 0;
    max-width: 1130px;
  }

  .faq-list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-start;
    margin-left: -35px;
    margin-right: -35px;
    margin-top: -55px;
  }

  .faq-list > * {
    margin-left: 35px;
    margin-right: 35px;
    margin-top: 55px;
  }

  .faq-list > *:not(:last-child) {
    margin-bottom: 0;
  }

  .faq-item {
    position: relative;
    width: 530px;
  }

  .faq-title {
    position: static;
    padding-left: 0;
  }

  .faq-cap {
    position: static;
    margin-right: 10px;
  }
}

/* Point -------------- */
.point-body {
  margin: 60px auto 0;
}

.point-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
}

.point-list > *:not(:last-child) {
  margin-bottom: 44px;
}

.point-item {
  width: 334px;
}

.point-title {
  border-bottom: 1px solid #E73D1B;
  margin-bottom: 25px;
  padding-bottom: 10px;
  text-align: center;
  line-height: 1.2;
  font-size: 18px;
}

.point-menu > * {
  position: relative;
  margin-bottom: 15px;
  padding-left: 42px;
  font-size: 15px;
}

.point-arrow {
  position: absolute;
  top: 3px;
  left: 12px;
  border-top-width: 13px;
  border-left-width: 10px;
  border-right-width: 10px;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}

.point-item ul {
}

.point-item ul li {
  text-indent: -28px;
  margin-left: 28px;
  margin-bottom: 1em;
  font-size: 15px;
  position: relative;
}

.point-item ul li:last-child {
  margin-bottom: 0;
}

.point-item ul li a {
  padding-left: 28px;
  color: #120F08;
}

.point-item ul li a:hover {
  text-decoration: none;
}

.point-item ul li a:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10.5px 0 10.5px 13px;
  border-color: transparent transparent transparent #e73d1b;
  position: absolute;
  top: 1px;
  left: -28px;
}

@media (min-width: 768px) {
  .point-item {
    width: 530px;
  }
}

@media (min-width: 1360px) {
  .point-body {
    margin: 80px auto 0;
    max-width: 1130px;
  }

  .point-list {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    margin-left: -32px;
    margin-right: -32px;
    /*margin-top: -50px;*/
  }

  .point-list > * {
    margin-left: 32px;
    margin-right: 32px;
  }

  .point-item {
    width: 334px;
  }
}

/* SiteFooter -------------- */

.siteFooter {
  padding: 34px 0 20px;
  background-color: #000000;
  color: #FFFFFF;
}

.siteFooter-body {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  margin: 0 auto;
  max-width: 640px;
}

.siteFooter-signature {
  flex: 1 1 auto;
  text-align: center;
}

.siteFooter-logo {
  margin: 0 auto 40px;
}

.siteFooter-nav {
  margin-bottom: 30px;
  padding: 0 12px;
}

.siteFooter-navList {
  display: flex;
  flex-wrap: wrap;
  padding: 0 12px;
}

.siteFooter-navList > * {
  margin-bottom: 20px;
  flex: 1 1 50%;
  font-size: 12px;
}

.siteFooter-navList a {
  color: #FFFFFF;
  text-decoration: none;
}

.siteFooter-navList a:hover {
  text-decoration: underline;
}

.siteFooter-recruit {
  margin-top: 30px;
}

.siteFooter-recruitButton {
  width: 100%;
  height: 49px;
  font-size: 12px;
}

.siteFooter-social {
  margin-top: 25px;
  text-align: center;
}

.siteFooter-satelite {
  padding: 0 42px;
}

.siteFooter-sateliteNav {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
}

.siteFooter-sateliteNav > *:not(:last-child) {
  margin-bottom: 15px;
}

.siteFooter-brandsite {
  margin-top: 40px;
  text-align: center;
}

.siteFooter-brandsiteLabel {
  margin-bottom: 12px;
  font-size: 12px;
}

.siteFooter-copyright {
  margin-top: 40px;
  width: 100%;
  text-align: center;
}

.siteFooter-copyrightText {
  margin-bottom: 0;
  font-size: 12px;
  font-family: futura-pt, sans-serif;
}

.siteFooter-pmark {
  margin-bottom: 12px;
}

@media (min-width: 768px) {
  .siteFooter-sateliteNav {
    flex-direction: row;
    justify-content: space-between;
    max-width: 400px;
  }
}

@media (min-width: 1360px) {
  .siteFooter-body {
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    max-width: 1360px;
  }

  .siteFooter {
    padding: 46px 0 86px;
    background-color: #000000;
    color: #FFFFFF;
  }

  .siteFooter-signature {
    flex: 1 1 auto;
    padding: 0 42px;
    text-align: left;
  }

  .siteFooter-nav {
    margin-bottom: 0;
    padding: 0 12px;
    width: 480px;
  }

  .siteFooter-recruitButton {
    width: 336px;
    height: 49px;
  }

  .siteFooter-social {
    margin-top: 15px;
    text-align: left;
  }

  .siteFooter-satelite {
    padding: 0 42px;
    width: 480px;
  }

  .siteFooter-sateliteNav {
    justify-content: flex-start;
  }

  .siteFooter-sateliteNav > * {
    margin-bottom: 18px;
  }

  .siteFooter-sateliteNav > *:nth-child(even) {
    margin-left: 39px;
  }

  .siteFooter-brandsite {
    margin-top: 23px;
    text-align: left;
  }

  .siteFooter-copyright {
    position: absolute;
    left: 42px;
    bottom: 0;
    margin-top: 0;
    width: auto;
    text-align: left;
  }
}

/* Cosmetics -------------- */
.type-en {
  font-family: futura-pt, sans-serif;
}

/* Background color */
.bg-red {
  background-color: #E73D1B;
}

.bg-white {
  background-color: #FFFFFF;
}

.bg-gray {
  background-color: #F3F5F7;
}

.bg-blue {
  background-color: #09499D;
}

.bg-palegreen {
  background-color: #81B3BA;
}

.bg-green {
  background-color: #15946B;
}

.bg-yellow {
  background-color: #FFC200;
}

.bg-purple {
  background-color: #584C9C;
}

/* Border color */
.border-red {
  border-color: #E73D1B;
}

.border-white {
  border-color: #FFFFFF;
}

.border-gray {
  border-color: #F3F5F7;
}

.border-blue {
  border-color: #09499D;
}

.border-palegreen {
  border-color: #81B3BA;
}

.border-green {
  border-color: #15946B;
}

.border-yellow {
  border-color: #FFC200;
}

.border-purple {
  border-color: #584C9C;
}

/* Text color */
.text-red {
  color: #E73D1B;
}

.text-white {
  color: #FFFFFF;
}

.text-gray {
  color: #F3F5F7;
}

.text-blue {
  color: #F3F5F7;
}

.text-palegreen {
  color: #81B3BA;
}

.text-green {
  color: #15946B;
}

.text-yellow {
  color: #FFC200;
}

.text-purple {
  color: #584C9C;
}

.text-black {
  color: #120F08;
}

.text-white {
  color: #FFFFFF;
}

/*--inquiry--*/

.inquiry-body {
  margin: 60px 20px;
}

@media (min-width: 1360px) {
  .inquiry-body {
    margin: 80px auto 0;
    max-width: 1130px;
  }
}

/*--freee--*/
.freee-body {
  margin: 60px 20px;
}

.section-header img{
max-width: 100%;
}

.message {
    width: 100%;
    position: relative;
    margin: 0 auto;
    padding: 20px;
    color: #ffffff;
    font-size: 1.1rem;
    letter-spacing: 1.5px;
    line-height: 2rem;
    background-color: rgb(0 0 0 / 50%);
    border: solid 1px #333333;
}

table.first{width: 100%;margin:50px auto;padding:20px;}
table.first th{background:#82b4bb;padding:30px;font-weight: normal;font-size:1.2rem;color:#ffffff;display: block;}
table.first td{display: block;}
table.first ul{list-style: none;margin-left:20px;}
table.first ul li{margin:10px 0px;}
table.first ul li:before{position: relative;margin-right:10px;top: 5px;content: "\f14a";font-family: "Font Awesome 5 Free";font-size: 28px;font-weight: 900;color: #82b4bb;}

table.plan th{background:#82b4bb;padding:30px;font-weight: normal;font-size:1.2rem;line-height:2rem;color:#ffffff;vertical-align: top;text-align: left;display: block;}
table.plan td{padding-top: 0px;padding-top:30px;font-size:1.2rem;display: block;}
table.plan{padding:20px;margin:20px 0px;}
table.plan ul li img{max-width: 100%;}

.main_c{padding:30px 0;text-align: center;}
.main_c .tl {font-size: 1.5rem;line-height: 2rem;margin-bottom: 30px;}
.main_c p {font-size: 1rem;}
.hidden_sp {display:none;}

@media (min-width: 1360px) {
.freee-body {
    margin: 80px auto 0;
    max-width: 1130px;
  }

.section-header img{
max-width: 440px;
  }

table.first{width: 100%;}
table.first th{display: revert;}
table.first td{display: revert;}

table.plan th{width:350px;display: revert;}
table.plan td{padding-left:30px;display: revert;}

table.plan ul{list-style: none;}
table.plan ul li{margin:10px 0px;position: relative;}
table.plan ul li ul li{margin:-5px 0px;}
table.plan ul li img{position: relative;margin:20px 0px 20px 0px;}
table.plan ul li span{position: relative;font-size:0.9rem;}

.main_c .tl{font-size:2rem;margin:30px 0px 50px 0px;line-height:3rem;}
.main_c p{font-size:1.2rem;line-height:2rem;margin:30px 0px;}
.now{padding:70px 0;text-align: center;}
.now p{font-size:1.5rem;line-height:3rem;margin:0px 0px 30px 0px;}
.now span{font-size:1.5rem;margin-top:30px;position: relative;}
.now span:before{content:"＼";position:absolute;left:-25px;}
.now span:after{content:"／";position:absolute;}
.hidden_pc {display: none !important;}
.hidden_sp {display:block;}

}

/*--dl--*/

.dl-body {
    margin: 60px auto 0;
    padding: 0 24px;
}

.dl .inner {
    padding: 50px 0;
  }
  .dl h3 {
    font-size: 22px;
    margin: 0 0 30px;
    text-align: center;
  }
  .dl .ly {
    display: block;
  }
  .dl .b-img img,
  .dl .s-img img {
    width: 100%;
  }
  .dl .s-img {
    padding: 15px 0 40px;
  }
  .dl h4 {
    margin: 40px 0 20px;
    font-size: 18px;
  }
  .dl .txt-box {
    padding: 15px 25px;
    font-size: 14px;
  }
  .dl .ly .ly-sub {
    margin: 40px 0 0;
  }
  .dl .ly .ly-sub .form {
    padding: 25px;
  }

@media (min-width: 1360px) {

  .dl-body {
    margin: 80px auto 0;
    padding: 0;
    max-width: 1130px;
}

.dl .inner {
  max-width: 1024px;
  margin: 0 auto;
  padding: 120px 0;
}

.dl h3 {
  text-align: center;
  font-size: 38px;
  margin: 0 0 60px;
}

.dl .ly {
  display: flex;
}

.dl .ly .ly-main {
  flex: 1;
}

.dl .b-img img,
.dl .s-img img {
  border: 1px solid #707070;
}

.dl .s-img {
  padding: 18px 0 64px;
  display: flex;
  border-bottom: 1px dashed #5C92C7;
}

.dl .s-img li {
  flex: 1;
}

.dl .s-img li:last-child {
  margin: 0 0 0 10px;
}

.dl h4 {
  margin: 55px 0 20px;
  font-size: 20px;
}

.dl .txt-box {
  background: #F5F9FC;
  padding: 25px 35px;
  color: #000;
  font-size: 18px;
}

.dl .txt-box ul {
  padding: 20px 0 0;
  margin: 20px 0 0;
  border-top: 1px dashed #5C92C7;
}

.dl .ly .ly-sub {
  flex: 1;
  background: #F5F9FC;
  margin: 0 0 0 40px;
}

.dl .ly .ly-sub .form {
  padding: 60px 55px 65px;
}
}

/*pop*/
.pop_up {position: fixed;z-index:2;bottom: 0px;right:0px;background: url(../img/pop_bg.jpg) no-repeat;background-size: cover;width:100%;height:420px;box-shadow: 0 0 8px #c0bdbd;border-top: solid 20px #333333;}
.pop_up h4{text-align:center;color:#ffffff;font-size: 18px;line-height: 30px;margin: 0 auto;}
.pop_up .center{margin:0 auto;text-align:center;}
.pop_up .bnr:hover{background:none;}
.pop_up .bnr a {color:#ffffff;background:#82b4bb;font-size: 0.9rem;font-weight: bold;border: none;border-radius: 100px;padding: 16px 70px;margin-top: 20px;display: inline-block;text-decoration: none;box-sizing: border-box;cursor: pointer;font-weight: normal;}
.pop_up button {background: #333333;color:#ffffff;position: relative;top:-20px;border: none;outline: none;background: transparent;font-size:20px;}
.pop_up p{margin-top:50%;color:#ffffff;}

@media (min-width: 500px) {
.pop_up {position: fixed;z-index:2;bottom: 0px;right: 20px;background: url(../img/pop_bg.jpg) no-repeat;width:350px;height:420px;box-shadow: 0 0 8px #c0bdbd;border-top: solid 20px #333333;}
}