@charset "utf-8";
/* CSS Document */
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: normal;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

ul, ol {
  list-style: none;
}

em, i {
  font-style: normal;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input, select {
  vertical-align: middle;
  -webkit-appearance: none;
}

button {
  all: unset;
  cursor: pointer;
}




/* web font setting
------------------------------------*/
/* Noto Sans JP */
@font-face {
  font-family: "Noto Sans JP";
  font-weight: 400;
  src: url("/wp-content/themes/swell/assets/font-noto-sans-jp/400_noto-sans-jp-r.woff") format("woff");
  font-display: swap;
}

/* Noto Sans JP */
@font-face {
  font-family: "Noto Sans JP";
  font-weight: 500;
  src: url("/wp-content/themes/swell/assets/font-noto-sans-jp/500_noto-sans-jp-m.woff") format("woff");
  font-display: swap;
}

/* Noto Sans JP */
@font-face {
  font-family: "Noto Sans JP";
  font-weight: 600;
  src: url("/wp-content/themes/swell/assets/font-noto-sans-jp/600_noto-sans-jp-sb.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans JP";
  font-weight: 700;
  src: url("/wp-content/themes/swell/assets/font-noto-sans-jp/700_noto-sans-jp-b.woff") format("woff");
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans JP";
  font-weight: 800;
  src: url("/wp-content/themes/swell/assets/font-noto-sans-jp/800_noto-sans-jp-bl.woff") format("woff");
  font-display: swap;
}




/* common setting */
html {
  line-height: 1.4;
  text-align: left;
  font-family: "Noto Sans JP", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif" !important;
  color: #333;
}

body {
	-webkit-text-size-adjust: 100%;
}

main {
  line-height: 1;
	font-size: 10px;
	font-size: 1.0rem;
  margin: 0;
}

img {
  width: 100%;
  height: auto;
	line-height: 0;
}

.onlySP {
  display: none;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  /* common setting */
  main {
    margin: -10.666667vw 0 0;
  }

  .onlyPC {
    display: none;
  }

  .onlySP {
    display: block;
  }
}




/* Main Visual setting */
#mainVisual {
  background: url("/wp-content/themes/swell/assets/img/top/bg_main_pc.png") 0 0 / 100% 100% no-repeat;
}

#mainVisual .inner h1 {
  margin: 0 auto 148px;
  padding: 155px 0 0 0;
  width: 980px;
  line-height: 1.5;
  letter-spacing: 0.12em;
  font-weight: 800;
  font-size: 48px;
}

#mainVisual .inner picture {
  position: absolute;
  top: 210px;
  left: 50%;
  display: block;
  margin: 0 0 0 143px;
  width: 281px;
}

#mainVisual .inner ul.fiveReason {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 0 20px 0 rgba(36, 36, 36, 0.1);
  margin: 0 auto;
  padding: 5px;
  width: 1080px;
}

#mainVisual .inner ul.fiveReason li {
  border-radius: 8px;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  padding: 4px;
  width: 210px;
}

#mainVisual .inner ul.fiveReason li .inner {
  display: flex;
  align-items: center;
  border-radius: 4px;
  background: #fff;
  padding: 28px 0;
  height: 100%;
}

#mainVisual .inner ul.fiveReason li .inner p {
  background: linear-gradient(90deg, #0067c0 0%, #009fe9 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  padding: 0.1vw 0;
  width: 100%;
  letter-spacing: 0.02em;
  text-align: center;
  line-height: 1.28;
  font-weight: 800;
  font-size: 28px;
}

#mainVisual .inner ul.fiveReason li .inner p small {
  display: block;
  padding: 0 0 6px;
  line-height: 1.33;
  font-weight: 700;
  font-size: 18px;
}

#mainVisual .inner ul.fiveReason li:nth-child(1) .inner p {
  line-height: 1;
  font-size: 32px;
}

#mainVisual .inner ul.fiveReason li:nth-child(5) .inner p {
  line-height: 1;
}

#mainVisual .inner ul.fiveReason li:nth-child(5) .inner p em {
  line-height: 1.15;
  font-weight: 800;
  font-size: 20px;
}

#mainVisual .inner ul.fiveReason li:nth-child(5) .inner p em i {
  margin: 0 3px 0 0;
  letter-spacing: -0.05em;
  font-weight: 800;
  font-size: 34px;
}

#mainVisual .inner ul.fiveReason li:nth-child(5) .inner p em i span {
  font-weight: 800;
  font-size: 24px;
}

#mainVisual .inner ul.threeCatch {
  position: relative;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #0067c0 0%, #009fe9 100%);
  margin: -60px 0 0;
  padding: 107px 0 47px;
}

#mainVisual .inner ul.threeCatch li {
  position: relative;
  margin: 0 50px;
  padding: 0 0 0 55px;
  text-align: center;
  line-height: 1.28;
  letter-spacing: 0.1em;
  font-weight: 700;
  font-size: 18px;
  color: #fff;
}

#mainVisual .inner ul.threeCatch li:before {
  content: '';
  position: absolute;
  top: -6px;
  left: 0;
  display: block;
}

#mainVisual .inner ul.threeCatch li:not(:last-child):after {
  content: '';
  position: absolute;
  top: -9px;
  right: -50px;
  display: block;
  background: #fff;
  width: 1px;
  height: 40px;
}

#mainVisual .inner ul.threeCatch li:nth-child(2) {
  padding: 0 0 0 60px;
}

#mainVisual .inner ul.threeCatch li:nth-child(1):before {
  background: url("/wp-content/themes/swell/assets/img/top/ico_main01.png") 0 0 / 100% no-repeat;
  width: 35px;
  height: 35px;
}

#mainVisual .inner ul.threeCatch li:nth-child(2):before {
  top: -5px;
  background: url("/wp-content/themes/swell/assets/img/top/ico_main02.png") 0 0 / 100% no-repeat;
  width: 40px;
  height: 33px;
}

#mainVisual .inner ul.threeCatch li:nth-child(3):before {
  background: url("/wp-content/themes/swell/assets/img/top/ico_main03.png") 0 0 / 100% no-repeat;
  width: 35px;
  height: 39px;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  /* Main Visual setting */
  #mainVisual {
    background: url("/wp-content/themes/swell/assets/img/top/bg_main_sp.png") 0 0 / 100% 100% no-repeat;
  }

  #mainVisual .inner h1 {
    margin: 0 0 29.066667vw;
    padding: 32.8vw 0 0 4vw;
    line-height: 1.35;
    font-weight: 700;
    font-size: 6.4vw;
  }

  #mainVisual .inner picture {
    display: none;
  }

  #mainVisual .inner ul.fiveReason {
    border-radius: 1.3333333vw;
    box-shadow: 0 0 2.666667vw 0 rgba(36, 36, 36, 0.1);
    padding: 0.8vw;
    width: 94.666667vw;
  }

  #mainVisual .inner ul.fiveReason li {
    border-radius: 1.0666667vw;
    padding: 0.5333333vw;
    width: 30.666667vw;
  }

  #mainVisual .inner ul.fiveReason li:nth-child(4),
  #mainVisual .inner ul.fiveReason li:nth-child(5) {
    margin: 0.5333333vw 0 0;
    width: 46.266667vw;
  }

  #mainVisual .inner ul.fiveReason li .inner {
    border-radius: 0.5333333vw;
    padding: 2.666667vw 0;
  }

  #mainVisual .inner ul.fiveReason li .inner p {
    padding: 0.1vw 0;
    line-height: 1.15;
    font-size: 4.8vw;
  }

  #mainVisual .inner ul.fiveReason li .inner p small {
    padding: 0 0 0.4vw;
    line-height: 1.25;
    font-size: 3.2vw;
  }

  #mainVisual .inner ul.fiveReason li:nth-child(1) .inner p {
    font-size: 5.6vw;
  }

  #mainVisual .inner ul.fiveReason li:nth-child(5) .inner p {
    line-height: 1.15;
  }

  #mainVisual .inner ul.fiveReason li:nth-child(5) .inner p em {
    line-height: 1.15;
    font-size: 3.733333vw;
  }

  #mainVisual .inner ul.fiveReason li:nth-child(5) .inner p em i {
    font-size: 6.4vw;
  }

  #mainVisual .inner ul.fiveReason li:nth-child(5) .inner p em i span {
    font-size: 3.733333vw;
  }

  #mainVisual .inner ul.threeCatch {
    justify-content: space-between;
    margin: -8.2666667vw 0 0;
    padding: 24vw 5.6vw 5.6vw;
  }

  #mainVisual .inner ul.threeCatch li {
    margin: 0;
    padding: 0;
    font-size: 3.733333vw;
  }

  #mainVisual .inner ul.threeCatch li:before {
    top: -10.6666667vw;
    left: 50%;
  }

  #mainVisual .inner ul.threeCatch li:not(:last-child):after {
    display: none;
  }

  #mainVisual .inner ul.threeCatch li:nth-child(2) {
    padding: 0;
  }

  #mainVisual .inner ul.threeCatch li:nth-child(1):before {
    background: url("/wp-content/themes/swell/assets/img/top/ico_main01.png") 0 0 / cover no-repeat;
    margin: 0 0 0 -3.9333333vw;
    width: 7.8666667vw;
    height: 7.8666667vw;
  }

  #mainVisual .inner ul.threeCatch li:nth-child(2):before {
    top: -12.933333vw;
    background: url("/wp-content/themes/swell/assets/img/top/ico_main02.png") 0 0 / cover no-repeat;
    margin: 0 0 0 -5.3333333vw;
    width: 10.666667vw;
    height: 8.6666667vw;
  }

  #mainVisual .inner ul.threeCatch li:nth-child(3):before {
    background: url("/wp-content/themes/swell/assets/img/top/ico_main03.png") 0 0 / cover no-repeat;
    margin: 0 0 0 -3.9333333vw;
    width: 7.8666667vw;
    height: 8.4vw;
  }
}






/* Top Introduction setting */
#topIntro {
  background: url("/wp-content/themes/swell/assets/img/top/bg_intro_pc.png") right top / 1440px auto no-repeat;
  padding: 100px 0 120px;
}

#topIntro .inner {
}

#topIntro .inner h2 {
  margin: 0 0 40px;
  text-align: center;
  line-height: 1.5;
  letter-spacing: 0.02em;
  font-weight: 700;
  font-size: 18px;
}

#topIntro .inner ul {
  position: relative;
  z-index: 1;
  border-radius: 10px;
  background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
  margin: 0 auto -150px;
  padding: 10px 10px 5px;
  width: 65%;
  max-width: 780px;
}

#topIntro .inner ul li {
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 0 10px 0 rgba(102, 102, 102, 0.1);
  margin: 0 0 5px;
  padding: 15px 0;
  text-align: center;
  line-height: 1.5;
  font-weight: 500;
  font-size: 16px;
}

#topIntro .inner h3 {
  position: relative;
  background: #fff;
  border-top: 150px solid #e8f6f9;
  margin: 0 0 100px;
}

#topIntro .inner h3:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  background: #e8f6f9;
  height: calc(tan(60deg) * 150px / 2);
  width: 100vw;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

#topIntro .inner h3 em {
  position: relative;
  top: 50px;
  z-index: 1;
  display: block;
  text-align: center;
  line-height: 1.5;
  letter-spacing: 0.02em;
  font-weight: 700;
  font-size: 18px;
  color: #0067c0;
}

#topIntro .inner ol {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  border-radius: 10px;
  margin: 0 auto;
  width: 95%;
  max-width: 1080px;
}

#topIntro .inner ol li {
  border-radius: 8px;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  margin: 0 5px 40px;
  padding: 4px;
  width: 300px;
}

#topIntro .inner ol li .inner {
  position: relative;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
  border-radius: 0.5333333vw;
  background: #fff;
  padding: 15px 0;
  height: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
}

#topIntro .inner ol li .inner h4 {
  position: absolute;
  top: -26px;
  left: 5px;
  font-weight: 500;
  font-size: 24px;
  color: #09a8c5;
}

#topIntro .inner ol li .inner h4 small {
  font-weight: 500;
  font-size: 16px;
}

#topIntro .inner ol li .inner em {
  display: block;
  width: 100%;
  padding: 10px 0 0;
  font-weight: 700;
  font-size: 20px;
  color: #0067c0;
}

#topIntro .inner p {
  text-align: center;
  line-height: 1.5;
  font-weight: 700;
  font-size: 18px;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #topIntro {
    background: url("/wp-content/themes/swell/assets/img/top/bg_intro_sp.png") center / cover no-repeat;
    padding: 13.3333333vw 0 17.333333vw;
  }

  #topIntro .inner h2 {
    margin: 0 0 8vw;
    font-size: 5.6vw;
  }

  #topIntro .inner ul {
    z-index: 0;
    border-radius: 1.3333333vw;
    margin: 0 auto 10.3333333vw;
    padding: 2.666667vw 2.666667vw 1.866667vw;
    width: 94.666667vw;
  }

  #topIntro .inner ul li {
    border-radius: 0.8vw;
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: 0 0 0.8vw;
    padding: 2.4vw 0 3.2vw;
    font-size: 3.733333vw;
  }

  #topIntro .inner h3 {
    border-top: 6vw solid #e8f6f9;
    margin: 0 0 3.3333333vw;
  }

  #topIntro .inner h3:after {
    height: calc(tan(60deg) * 18.666667vw / 2);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }

  #topIntro .inner h3 em {
    top: -10vw;
    font-size: 4.8vw;
  }

  #topIntro .inner ol {
    justify-content: space-between;
    border-radius: 1.3333333vw;
    margin: 0 auto;
    width: 92vw;
  }

  #topIntro .inner ol li {
    border-radius: 1.0666667vw;
    margin: 0 0 5.3333333vw;
    padding: 0.5333333vw;
    width: 45.333333vw;
  }

  #topIntro .inner ol li:nth-child(5) {
    width: 100%;
  }

  #topIntro .inner ol li .inner {
    border-radius: 0.5333333vw;
    padding: 2.666667vw 0;
    font-size: 3.733333vw;
  }

  #topIntro .inner ol li .inner h4 {
    top: -4.2vw;
    left: 0.4vw;
    font-size: 4vw;
  }

  #topIntro .inner ol li .inner h4 small {
    font-size: 2.666667vw;
  }

  #topIntro .inner ol li .inner em {
    padding: 2vw 0 0;
    font-size: 4.8vw;
  }

  #topIntro .inner p {
    font-size: 4.2666667vw;
  }
}





/* CTA setting */
.CTA {
  border-top: 4px solid #fff;
  border-bottom: 4px solid #fff;
  background: url("/wp-content/themes/swell/assets/img/top/bg_cta01_pc.png") 0 0 / cover no-repeat;
  box-shadow: 0 0 18px 0 rgba(102, 102, 102, 0.2);
  padding: 10px 0 35px;
  height: auto;
  text-align: center;
}

.CTA h2 {
  font-weight: 700;
  font-size: 32px;
}

.CTA h2 span {
  position: relative;
  top: -25px;
  display: inline-block;
  transform: rotate(-15deg);
  border-radius: 50%;
  background: #0067c0;
  margin: 0 10px 0 -75px;
  width: 75px;
  height: 75px;
  line-height: 75px;
  font-weight: 700;
  font-size: 20px;
  color: #fff;
}

.CTA .inner > p {
  margin: 0 0 20px;
  font-weight: 500;
  font-size: 18px;
}

.CTA ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.CTA ul li {
  position: relative;
  margin: 0 10px;
  width: 300px;
}

.CTA ul li.btnTel {
  margin: 0;
  width: 100%;
}

.CTA ul li:before {
  content: '';
  position: absolute;
  top: 20px;
  left: 16px;
  display: block;
  z-index: 1;
  box-shadow: 0 0 18px 0 rgba(102, 102, 102, 0.2);
  border-radius: 50%;
  background: #fff;
  width: 40px;
  height: 40px;
}

.CTA ul li:after {
  content: '';
  position: absolute;
  top: 32px;
  left: 25px;
  z-index: 1;
  display: block;
}

.CTA ul li a {
  position: relative;
  z-index: 0;
  display: block;
  border-radius: 10px;
  padding: 0 0 0 50px;
  width: 300px;
  height: 80px;
  line-height: 80px;
  letter-spacing: 0.1em;
  font-weight: 700;
  font-size: 20px;
}

.CTA ul li a.onlySP {
  display: none;
}

.CTA ul li a:before {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  display: block;
  border-radius: 8px;
  background-image: linear-gradient(to bottom, rgb(255,255,255) 0%, rgba(255,255,255,0) 50%);
  width: 296px;
  height: 24px;
  opacity: 0.8;
}

.CTA ul li a:link,
.CTA ul li a:visited {
  color: #fff;
}

.CTA ul li.btnTel a.linkContact:link,
.CTA ul li.btnTel a.linkContact:visited {
  text-decoration: underline;
  color: #0067c0;
}

.CTA ul li.btnTel a.linkLINE:link,
.CTA ul li.btnTel a.linkLINE:visited {
  text-decoration: underline;
  color: #00a308;
}

.CTA ul li a em {
  font-weight: 700;
  font-size: 22px;
}

.CTA ul li a em small {
  font-weight: 700;
  font-size: 20px;
}

.CTA ul li.btnTel:before,
.CTA ul li.btnTel:after {
  display: none;
}

.CTA ul li.btnTel .onlyPC {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.CTA ul li.btnTel .onlyPC span {
  display: block;
  border-radius: 50%;
  background: #eb3323;
  padding: 14px 0 0;
  width: 60px;
  height: 60px;
  text-align: center;
  line-height: 1.25;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
}

.CTA ul li.btnTel .onlyPC p {
  position: relative;
  padding: 0 15px 0 57px;
  font-weight: 800;
  font-size: 56px;
  color: #eb3323;
}

.CTA ul li.btnTel .onlyPC p:before {
  content: '';
  position: absolute;
  top: 13px;
  left: 16px;
  display: block;
  background: url("/wp-content/themes/swell/assets/img/top/ico_tel_pc.png") 0 0 / 100% no-repeat;
  width: 35px;
  height: 41px;
}

.CTA ul li.btnTel .onlyPC dl {
  display: flex;
  align-items: center;
  border-radius: 25px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(102, 102, 102, 0.2);
  height: 50px;
}

.CTA ul li.btnTel .onlyPC dl dt {
  width: 115px;
  text-align: center;
  letter-spacing: 0.1em;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

.CTA ul li.btnTel .onlyPC dl dd {
  border-left: 1px solid #ddd;
  padding: 0 40px 0 20px;
  text-align: left;
  font-size: 18px;
}

.CTA ul li.btnTel .onlyPC dl dd small {
  font-size: 14px;
}

.CTA ul li.btnTel .onlyPC em {
  display: flex;
  justify-content: center;
  padding: 20px 0 35px;
  width: 100%;
  letter-spacing: 0.1em;
  font-size: 14px;
}

.CTA ul li.btnTel .onlyPC a {
  display: inline;
  border-radius: 0;
  padding: 0;
  width: auto;
  height: auto;
  letter-spacing: 0;
  line-height: 1;
  font-size: 14px;
}

.CTA ul li.btnTel .onlyPC a:before {
  display: none;
}


.CTA ul li.btnMail:after {
  background: url("/wp-content/themes/swell/assets/img/top/ico_mail.png") 0 0 / 100% 100% no-repeat;
  width: 23px;
  height: 17px;
}

.CTA ul li.btnMail a {
  background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
}

.CTA ul li.btnLine:after {
  background: url("/wp-content/themes/swell/assets/img/top/ico_line.png") 0 0 / 100% 100% no-repeat;
  width: 21px;
  height: 18px;
}

.CTA ul li.btnLine a {
  background: linear-gradient(0deg, #009b00 0%, #00e937 100%);
}

.CTA.fullParts {
  position: relative;
  border-top: 4px solid #fffe85;
  border-bottom: 4px solid #fffe85;
  background: url("/wp-content/themes/swell/assets/img/top/bg_cta03_pc.png") center / cover no-repeat;
  padding: 15px 0 20px;
  height: auto;
}

.CTA.fullParts ul li.btnTel .onlyPC {
  position: relative;
  left: 50%;
  margin: 0 0 0 -495px;
  width: 570px;
}

.CTA.fullParts ul li.btnTel .onlyPC span {
  position: relative;
  top: 15px;
  padding: 18px 0 0;
  width: 80px;
  height: 80px;
  line-height: 1.25;
  font-size: 18px;
}

.CTA.fullParts ul li.btnTel .onlyPC dl {
  position: relative;
  left: 40px;
  display: flex;
  justify-content: center;
  border-radius: 25px;
  background: #fff;
  box-shadow: 0 0 6px 0 rgba(102, 102, 102, 0.2);
  width: 400px;
  height: 20px;
}

.CTA.fullParts ul li.btnTel .onlyPC dl dt {
  padding: 0 10px 0 0;
  width: auto;
  font-size: 14px;
  color: #333;
}

.CTA.fullParts ul li.btnTel .onlyPC dl dd {
  border-left: 1px solid #ddd;
  padding: 0 0 0 10px;
  font-size: 14px;
}

.CTA.fullParts ul li.btnTel .onlyPC em {
  padding: 20px 0 15px;
}

.CTA.fullParts ul li {
  margin: 0 5px;
  width: 280px;
}

.CTA.fullParts ul li.btnMail,
.CTA.fullParts ul li.btnLine {
  position: relative;
  left: -215px;
}

.CTA.fullParts ul li.btnTel {
  margin: 0;
  width: 100%;
}

.CTA.fullParts ul li:before {
  content: '';
  position: absolute;
  top: 10px;
  left: 16px;
  display: block;
  z-index: 1;
  box-shadow: 0 0 18px 0 rgba(102, 102, 102, 0.2);
  border-radius: 50%;
  background: #fff;
  width: 40px;
  height: 40px;
}

.CTA.fullParts ul li:after {
  content: '';
  position: absolute;
  top: 22px;
  left: 25px;
  z-index: 1;
  display: block;
}

.CTA.fullParts ul li a {
  position: relative;
  z-index: 0;
  display: block;
  border-radius: 10px;
  padding: 0 0 0 50px;
  width: 280px;
  height: 60px;
  line-height: 60px;
  letter-spacing: 0.1em;
  font-weight: 700;
  font-size: 20px;
}

.CTA.fullParts ul li.btnTel:before,
.CTA.fullParts ul li.btnTel:after,
.CTA.fullParts ul li a.onlySP {
  display: none;
}

.CTA.fullParts ul li a:before {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  display: block;
  border-radius: 8px;
  background-image: linear-gradient(to bottom, rgb(255,255,255) 0%, rgba(255,255,255,0) 50%);
  width: 276px;
  height: 24px;
  opacity: 0.8;
}

.CTA.fullParts ul.fiveReason {
  position: absolute;
  top: 85px;
  left: 50%;
  margin: 0 0 0 115px;
  width: 320px;
}

.CTA.fullParts ul.fiveReason li {
  border-radius: 20px;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  margin: 0 0 5px;
  padding: 3px;
  width: 100%;
  height: 40px;
}

.CTA.fullParts ul.fiveReason li .inner {
  position: relative;
  border-radius: 17px;
  background: #fff;
  padding: 0 0 0 25px;
  height: 100%;
  text-align: center;
  line-height: 34px;
  letter-spacing: 0.02em;
  font-weight: 700;
  font-size: 16px;
}

.CTA.fullParts ul.fiveReason li:before {
  top: 7px;
  left: 7px;
  box-shadow: none;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  margin: 0;
  width: 26px;
  height: 26px;
}

.CTA.fullParts ul.fiveReason li:after {
  top: 14px;
  left: 14px;
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
  width: 12px;
  height: 8px;
  transform: rotate(-45deg);
}

.CTA.fullParts ul.fiveReason li .inner em {
  font-weight: 700;
  color: #0067c0;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  .CTA {
    border-top: 0.5333333vw solid #fff;
    border-bottom: 0.5333333vw solid #fff;
    background: url("/wp-content/themes/swell/assets/img/top/bg_cta01_sp.png") 0 0 / cover no-repeat;
    box-shadow: 0 0 2.4vw 0 rgba(102, 102, 102, 0.2);
    padding: 3.2vw 0 4.8vw;
    height: 44.8vw;
  }

  .CTA h2 {
    font-weight: 700;
    font-size: 5.6vw;
  }

  .CTA h2 span {
    top: -6vw;
    margin: 0 0 0 -13.3333333vw;
    width: 13.3333333vw;
    height: 13.3333333vw;
    line-height: 13.3333333vw;
    font-size: 3.733333vw;
  }

  .CTA ul {
    justify-content: space-between;
    margin: 0 auto;
    width: 92vw;
  }

  .CTA ul li {
    margin: 0;
    width: 29.333333vw;
  }

  .CTA ul li.btnTel {
    margin: 0;
    width: 29.333333vw;
  }

  .CTA ul li:before {
    top: -1.4666667vw;
    left: 50%;
    box-shadow: 0 0 2.4vw 0 rgba(102, 102, 102, 0.2);
    margin: 0 0 0 -2.666667vw;
    width: 5.3333333vw;
    height: 5.3333333vw;
  }

  .CTA ul li:after {
    top: 0;
    left: 50%;
  }

  .CTA ul li.btnTel:before,
  .CTA ul li.btnTel:after {
    display: block;
  }

  .CTA ul li a {
    border-radius: 1.3333333vw;
    padding: 4.2666667vw 0 0;
    width: 100%;
    height: 22.666667vw;
    line-height: 1;
    font-size: 3.733333vw;
  }

  .CTA ul li a:before {
    top: 0.2666667vw;
    left: 0.2666667vw;
    border-radius: 1.0666667vw;
    width: 28.8vw;
    height: 3.2vw;
  }

  .CTA ul li a em {
    display: block;
    padding: 0.4vw 0 1.3333333vw;
    font-size: 4.8vw;
  }

  .CTA ul li a em small {
    font-size: 3.733333vw;
  }

  .CTA ul li a p {
    border-radius: 2.2666667vw;
    background: #fff;
    margin: 1.8666667vw auto 0;
    width: 26.666667vw;
    height: 4.5333333vw;
    line-height: 4.5333333vw;
    letter-spacing: 0;
    font-size: 2.933333vw;
  }

  .CTA ul li.btnTel:after {
    background: url("/wp-content/themes/swell/assets/img/top/ico_tel2.png") 0 0 / 100% 100% no-repeat;
    margin: 0 0 0 -1.3333333vw;
    width: 2.666667vw;
    height: 2.666667vw;
  }

  .CTA ul li.btnTel .onlyPC {
    display: none;
  }

  .CTA ul li.btnTel .onlySP {
    display: block;
  }

  .CTA ul li.btnTel a {
    background: linear-gradient(0deg, #990013 0%, #eb3323 100%);
  }

  .CTA ul li.btnTel a p {
    color: #990013;
  }

  .CTA ul li.btnMail:after {
    margin: 0 0 0 -1.4666666vw;
    width: 2.933333vw;
    height: 2.1333333vw;
  }

  .CTA ul li.btnMail a {
    background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
  }

  .CTA ul li.btnMail a p {
    color: #0067c0;
  }

  .CTA ul li.btnLine:after {
    margin: 0 0 0 -1.4666666vw;
    width: 2.933333vw;
    height: 2.4vw;
  }

  .CTA ul li.btnLine a {
    background: linear-gradient(0deg, #009b00 0%, #00e937 100%);
  }

  .CTA ul li.btnLine a p {
    color: #009b00;
  }

  .CTA.fullParts {
    border-top: 1.3333333vw solid #fffe85;
    border-bottom: 1.3333333vw solid #fffe85;
    background: url("/wp-content/themes/swell/assets/img/top/bg_cta03_sp.png") 0 bottom / 100% auto no-repeat;
    padding: 3.2vw 0 1.4vw;
    height: auto;
  }

  .CTA.fullParts ul li,
  .CTA.fullParts ul li.btnTel {
    margin: 0;
    width: 29.333333vw;
  }

  .CTA.fullParts ul li.btnMail,
  .CTA.fullParts ul li.btnLine {
    left: auto;
  }

  .CTA.fullParts ul li:before {
    top: -1.4666667vw;
    left: 50%;
    box-shadow: 0 0 2.4vw 0 rgba(102, 102, 102, 0.2);
    margin: 0 0 0 -2.666667vw;
    width: 5.3333333vw;
    height: 5.3333333vw;
  }

  .CTA.fullParts ul li:after {
    top: 0;
    left: 50%;
  }

  .CTA.fullParts ul li a {
    border-radius: 1.3333333vw;
    padding: 4.2666667vw 0 0;
    width: 100%;
    height: 22.666667vw;
    line-height: 1;
    font-size: 3.733333vw;
  }

  .CTA.fullParts ul li a:before {
    top: 0.2666667vw;
    left: 0.2666667vw;
    border-radius: 1.0666667vw;
    width: 28.8vw;
    height: 3.2vw;
  }

  .CTA.fullParts ul li.btnTel:before,
  .CTA.fullParts ul li.btnTel:after,
  .CTA.fullParts ul li a.onlySP {
    display: block;
  }

  .CTA.fullParts ul.fiveReason {
    position: relative;
    top: auto;
    left: auto;
    margin: 4vw auto 0;
    width: 64vw;
  }

  .CTA.fullParts ul.fiveReason li {
    border-radius: 3.733333vw;
    background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
    margin: 0 0 1.0666667vw;
    padding: 0.2666667vw;
    width: 100%;
    height: 7.4666667vw;
  }

  .CTA.fullParts ul.fiveReason li .inner {
    position: relative;
    border-radius: 3.733333vw;
    background: #fff;
    padding: 0 0 0 2.4vw;
    height: 100%;
    text-align: center;
    line-height: 6.9333333vw;
    letter-spacing: 0.02em;
    font-weight: 700;
    font-size: 3.2vw;
  }

  .CTA.fullParts ul.fiveReason li:before {
    top: 1.6vw;
    left: 1.6vw;
    box-shadow: none;
    background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
    margin: 0;
    width: 4.2666667vw;
    height: 4.2666667vw;
  }

  .CTA.fullParts ul.fiveReason li:after {
    top: 2.8vw;
    left: 2.8vw;
    border-left: 0.4vw solid #fff;
    border-bottom: 0.4vw solid #fff;
    width: 1.8666667vw;
    height: 1.2vw;
    transform: rotate(-45deg);
  }

  .CTA.fullParts ul.fiveReason li .inner em {
    font-weight: 700;
    color: #0067c0;
  }
}



/* Reason Introduction setting */
#reasonInrro {
  padding: 100px 0 0;
}

#reasonInrro > .inner {
  margin: 0 auto;
  max-width: 1080px;
}

#reasonInrro .inner h2 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  line-height: 1.5;
  font-weight: 700;
  font-size: 24px;
}

#reasonInrro .inner h2 small {
  display: block;
  font-size: 16px;
}

#reasonInrro .inner h2:before {
  content: 'Reason';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  text-align: center;
  letter-spacing: 0.05em;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#reasonInrro .inner h2:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#reasonInrro > .inner > p {
  margin: 0 auto 40px;
  width: 100%;
  text-align: center;
  line-height: 1.71;
  font-size: 16px;
}

/* INDEX */
#reasonInrro .inner article.index {
  background: #f5f5f5;
  margin: 0 auto 40px;
  padding: 20px 0 5px;
  width: 600px;
}

#reasonInrro .inner article.index h3 {
  margin: 0 0 20px;
  text-align: center;
  font-weight: 700;
  font-size: 20px;
}

#reasonInrro .inner article.index ul {
  margin: 0 auto;
  width: 95%;
}

#reasonInrro .inner article.index ul li a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
  margin: 0 0 10px;
  padding: 0 45px 0 10px;
  height: 50px;
}

#reasonInrro .inner article.index ul li a:after {
  content: '';
  position: absolute;
  top: 32.5%;
  right: 15px;
  border-top: 3px solid #0067c0;
  border-right: 3px solid #0067c0;
  width: 12px;
  height: 12px;
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

#reasonInrro .inner article.index ul li a:link,
#reasonInrro .inner article.index ul li a:visited {
  color: #0067c0;
}

#reasonInrro .inner article.index ul li a span {
  border-radius: 20px;
  background: #0067c0;
  display: block;
  width: 80px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #fff;
}

#reasonInrro .inner article.index ul li a em {
  display: block;
  width: 430px;
  line-height: 1.5;
  font-weight: 700;
  font-size: 18px;
}

/* Reason Common Settings */
#reasonInrro .inner article#reason01,
#reasonInrro .inner article#reason02,
#reasonInrro .inner article#reason03,
#reasonInrro .inner article#reason04,
#reasonInrro .inner article#reason05 {
  position: relative;
  padding: 80px 0 120px;
}

#reasonInrro .inner article#reason01:before,
#reasonInrro .inner article#reason02:before,
#reasonInrro .inner article#reason03:before,
#reasonInrro .inner article#reason04:before,
#reasonInrro .inner article#reason05:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  display: block;
  border-radius: 10px;
  background: linear-gradient(0deg, transparent 0%, #e8f6f9 100%);
  width: 100%;
  height: 40vw;
}

#reasonInrro .inner article#reason01 .inner,
#reasonInrro .inner article#reason02 .inner,
#reasonInrro .inner article#reason03 .inner,
#reasonInrro .inner article#reason04 .inner,
#reasonInrro .inner article#reason05 .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
  width: 95%;
}

#reasonInrro .inner article#reason01 .inner.reverseCont,
#reasonInrro .inner article#reason02 .inner.reverseCont,
#reasonInrro .inner article#reason03 .inner.reverseCont,
#reasonInrro .inner article#reason04 .inner.reverseCont,
#reasonInrro .inner article#reason05 .inner.reverseCont {
  flex-direction: row-reverse;
}

#reasonInrro .inner article#reason01 h3,
#reasonInrro .inner article#reason02 h3,
#reasonInrro .inner article#reason03 h3,
#reasonInrro .inner article#reason04 h3,
#reasonInrro .inner article#reason05 h3 {
  position: relative;
  z-index: 1;
  margin: 0 0 40px;
  width: 100%;
  text-align: center;
}

#reasonInrro .inner article#reason01 h3 span,
#reasonInrro .inner article#reason02 h3 span,
#reasonInrro .inner article#reason03 h3 span,
#reasonInrro .inner article#reason04 h3 span,
#reasonInrro .inner article#reason05 h3 span {
  border-radius: 2.666667vw;
  background: #0067c0;
  display: block;
  margin: 0 auto 2.4vw;
  width: 110px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-weight: 700;
  font-size: 20px;
  color: #fff;
}

#reasonInrro .inner article#reason01 h3 em,
#reasonInrro .inner article#reason02 h3 em,
#reasonInrro .inner article#reason03 h3 em,
#reasonInrro .inner article#reason04 h3 em,
#reasonInrro .inner article#reason05 h3 em {
  font-weight: 700;
  font-size: 24px;
  color: #0067c0;
}

#reasonInrro .inner article#reason01 .inner > p,
#reasonInrro .inner article#reason02 .inner > p,
#reasonInrro .inner article#reason03 .inner > p,
#reasonInrro .inner article#reason04 .inner > p,
#reasonInrro .inner article#reason05 .inner > p {
  position: relative;
  z-index: 1;
  margin: 0 0 30px;
  width: 62.5%;
  line-height: 1.6;
  font-size: 14px;
}

#reasonInrro .inner article#reason01 .inner > p.w100,
#reasonInrro .inner article#reason02 .inner > p.w100,
#reasonInrro .inner article#reason03 .inner > p.w100,
#reasonInrro .inner article#reason04 .inner > p.w100,
#reasonInrro .inner article#reason05 .inner > p.w100 {
  width: 100%;
  text-align: center;
}

#reasonInrro .inner article#reason01 .inner > p em,
#reasonInrro .inner article#reason02 .inner > p em,
#reasonInrro .inner article#reason03 .inner > p em,
#reasonInrro .inner article#reason04 .inner > p em,
#reasonInrro .inner article#reason05 .inner > p em {
  position: relative;
  background: linear-gradient(to top, #fffe85 50%, transparent 50%);
  font-weight: 700;
}

#reasonInrro .inner article#reason01 .inner > p strong,
#reasonInrro .inner article#reason02 .inner > p strong,
#reasonInrro .inner article#reason03 .inner > p strong,
#reasonInrro .inner article#reason04 .inner > p strong,
#reasonInrro .inner article#reason05 .inner > p strong {
  position: relative;
  background: linear-gradient(to top, #b4f0ff 50%, transparent 50%);
  font-weight: 700;
}

#reasonInrro .inner article#reason01 .inner > p span,
#reasonInrro .inner article#reason02 .inner > p span,
#reasonInrro .inner article#reason03 .inner > p span,
#reasonInrro .inner article#reason04 .inner > p span,
#reasonInrro .inner article#reason05 .inner > p span {
  font-weight: 700;
  color: #c00;
}

#reasonInrro .inner article#reason01 .inner > picture,
#reasonInrro .inner article#reason02 .inner > picture,
#reasonInrro .inner article#reason03 .inner > picture,
#reasonInrro .inner article#reason04 .inner > picture,
#reasonInrro .inner article#reason05 .inner > picture {
  position: relative;
  display: block;
  margin: 0 0 30px;
  width: 35%;
}


#reasonInrro .inner article#reason01 .inner > picture.comment:before,
#reasonInrro .inner article#reason02 .inner > picture.comment:before,
#reasonInrro .inner article#reason03 .inner > picture.comment:before,
#reasonInrro .inner article#reason04 .inner > picture.comment:before,
#reasonInrro .inner article#reason05 .inner > picture.comment:before {
  content: '';
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  width: 90px;
  height: 90px;
}

#reasonInrro .inner article#reason01 .inner > picture.comment:after,
#reasonInrro .inner article#reason02 .inner > picture.comment:after,
#reasonInrro .inner article#reason03 .inner > picture.comment:after,
#reasonInrro .inner article#reason04 .inner > picture.comment:after,
#reasonInrro .inner article#reason05 .inner > picture.comment:after {
  white-space: pre;
  position: absolute;
  z-index: 1;
  border-radius: 50%;
  background: #fff;
  padding: 25px 0 0;
  width: 82px;
  height: 82px;
  text-align: center;
  line-height: 1.3;
  font-weight: 700;
  font-size: 12px;
  color: #0067c0;
}

#reasonInrro .inner article#reason01 .CTA,
#reasonInrro .inner article#reason02 .CTA,
#reasonInrro .inner article#reason03 .CTA,
#reasonInrro .inner article#reason04 .CTA,
#reasonInrro .inner article#reason05 .CTA {
  box-sizing: border-box;
  border-radius: 10px;
  border: 4px solid #fff;
  background: url("/wp-content/themes/swell/assets/img/top/bg_cta02_sp.png") right 0 / auto 100% no-repeat;
  box-shadow: 0 0 18px 0 rgba(102, 102, 102, 0.2);
  margin: 0 auto;
  padding: 10px 0 10px;
  width: 600px;
  height: auto;
}

#reasonInrro .inner article#reason01 .CTA h4,
#reasonInrro .inner article#reason02 .CTA h4,
#reasonInrro .inner article#reason03 .CTA h4,
#reasonInrro .inner article#reason04 .CTA h4,
#reasonInrro .inner article#reason05 .CTA h4 {
  margin: 0 0 10px;
  width: 100%;
  font-weight: 700;
  font-size: 24px;
}

#reasonInrro .inner article#reason01 .CTA h4 span,
#reasonInrro .inner article#reason02 .CTA h4 span,
#reasonInrro .inner article#reason03 .CTA h4 span,
#reasonInrro .inner article#reason04 .CTA h4 span,
#reasonInrro .inner article#reason05 .CTA h4 span {
  position: relative;
  top: -25px;
  display: inline-block;
  transform: rotate(-15deg);
  border-radius: 50%;
  background: #0067c0;
  margin: 0 10px 0 -75px;
  width: 75px;
  height: 75px;
  line-height: 75px;
  font-weight: 700;
  font-size: 20px;
  color: #fff;
}

#reasonInrro .inner article#reason01 .CTA ul,
#reasonInrro .inner article#reason02 .CTA ul,
#reasonInrro .inner article#reason03 .CTA ul,
#reasonInrro .inner article#reason04 .CTA ul,
#reasonInrro .inner article#reason05 .CTA ul {
  display: block;
  justify-content: space-between;
  margin: 0 auto;
  width: 100%;
}

#reasonInrro .inner article#reason01 .CTA ul li,
#reasonInrro .inner article#reason02 .CTA ul li,
#reasonInrro .inner article#reason03 .CTA ul li,
#reasonInrro .inner article#reason04 .CTA ul li,
#reasonInrro .inner article#reason05 .CTA ul li {
  display: flex;
  margin: 0;
  padding: 0 0 10px 30px;
  width: 100%;
}

#reasonInrro .inner article#reason01 .CTA ul li:before,
#reasonInrro .inner article#reason02 .CTA ul li:before,
#reasonInrro .inner article#reason03 .CTA ul li:before,
#reasonInrro .inner article#reason04 .CTA ul li:before,
#reasonInrro .inner article#reason05 .CTA ul li:before {
  display: none;
}

#reasonInrro .inner article#reason01 .CTA ul li:after,
#reasonInrro .inner article#reason02 .CTA ul li:after,
#reasonInrro .inner article#reason03 .CTA ul li:after,
#reasonInrro .inner article#reason04 .CTA ul li:after,
#reasonInrro .inner article#reason05 .CTA ul li:after {
  content: '';
  position: absolute;
  top: 2px;
  left: 8px;
  z-index: 1;
  display: block;
}

#reasonInrro .inner article#reason01 .CTA ul li a,
#reasonInrro .inner article#reason02 .CTA ul li a,
#reasonInrro .inner article#reason03 .CTA ul li a,
#reasonInrro .inner article#reason04 .CTA ul li a,
#reasonInrro .inner article#reason05 .CTA ul li a {
  border-radius: 0;
  margin: 0 10px 0 0;
  padding: 0;
  width: auto;
  height: auto;
  text-decoration: underline;
  text-align: left;
  line-height: 1;
  letter-spacing: 0.02em;
  font-weight: 700;
  font-size: 16px;
}

#reasonInrro .inner article#reason01 .CTA ul li > em.onlyPC,
#reasonInrro .inner article#reason02 .CTA ul li > em.onlyPC,
#reasonInrro .inner article#reason03 .CTA ul li > em.onlyPC,
#reasonInrro .inner article#reason04 .CTA ul li > em.onlyPC,
#reasonInrro .inner article#reason05 .CTA ul li > em.onlyPC {
  display: block;
  margin: 0 10px 0 0;
  text-align: left;
  line-height: 1;
  letter-spacing: 0.02em;
  font-weight: 700;
  font-size: 16px;
}

#reasonInrro .inner article#reason01 .CTA ul li a:before,
#reasonInrro .inner article#reason02 .CTA ul li a:before,
#reasonInrro .inner article#reason03 .CTA ul li a:before,
#reasonInrro .inner article#reason04 .CTA ul li a:before,
#reasonInrro .inner article#reason05 .CTA ul li a:before {
  display: none;
}

#reasonInrro .inner article#reason01 .CTA ul li a:link,
#reasonInrro .inner article#reason01 .CTA ul li a:visited,
#reasonInrro .inner article#reason02 .CTA ul li a:link,
#reasonInrro .inner article#reason02 .CTA ul li a:visited,
#reasonInrro .inner article#reason03 .CTA ul li a:link,
#reasonInrro .inner article#reason03 .CTA ul li a:visited,
#reasonInrro .inner article#reason04 .CTA ul li a:link,
#reasonInrro .inner article#reason04 .CTA ul li a:visited,
#reasonInrro .inner article#reason05 .CTA ul li a:link,
#reasonInrro .inner article#reason05 .CTA ul li a:visited {
  color: #fff;
}

#reasonInrro .inner article#reason01 .CTA ul li a em,
#reasonInrro .inner article#reason02 .CTA ul li a em,
#reasonInrro .inner article#reason03 .CTA ul li a em,
#reasonInrro .inner article#reason04 .CTA ul li a em,
#reasonInrro .inner article#reason05 .CTA ul li a em {
  display: block;
  padding: 0.4vw 0 1.3333333vw;
  font-weight: 700;
  font-size: 4.8vw;
}

#reasonInrro .inner article#reason01 .CTA ul li a em small,
#reasonInrro .inner article#reason02 .CTA ul li a em small,
#reasonInrro .inner article#reason03 .CTA ul li a em small,
#reasonInrro .inner article#reason04 .CTA ul li a em small,
#reasonInrro .inner article#reason05 .CTA ul li a em small {
  font-weight: 700;
  font-size: 3.733333vw;
}

#reasonInrro .inner article#reason01 .CTA ul li p,
#reasonInrro .inner article#reason02 .CTA ul li p,
#reasonInrro .inner article#reason03 .CTA ul li p,
#reasonInrro .inner article#reason04 .CTA ul li p,
#reasonInrro .inner article#reason05 .CTA ul li p {
  position: relative;
  top: -4px;
  border-radius: 12px;
  padding: 0 10px;
  height: 24px;
  line-height: 24px;
  letter-spacing: 0;
  font-size: 12px;
  color: #fff;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnTel:after,
#reasonInrro .inner article#reason02 .CTA ul li.btnTel:after,
#reasonInrro .inner article#reason03 .CTA ul li.btnTel:after,
#reasonInrro .inner article#reason04 .CTA ul li.btnTel:after,
#reasonInrro .inner article#reason05 .CTA ul li.btnTel:after {
  display: block;
  background: url("/wp-content/themes/swell/assets/img/top/ico_tel.png") 0 0 / 100% 100% no-repeat;
  margin: 0;
  width: 16px;
  height: 16px;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnTel a,
#reasonInrro .inner article#reason02 .CTA ul li.btnTel a,
#reasonInrro .inner article#reason03 .CTA ul li.btnTel a,
#reasonInrro .inner article#reason04 .CTA ul li.btnTel a,
#reasonInrro .inner article#reason05 .CTA ul li.btnTel a {
  background: none;
  color: #0099ba;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnTel p,
#reasonInrro .inner article#reason02 .CTA ul li.btnTel p,
#reasonInrro .inner article#reason03 .CTA ul li.btnTel p,
#reasonInrro .inner article#reason04 .CTA ul li.btnTel p,
#reasonInrro .inner article#reason05 .CTA ul li.btnTel p {
  background: #0099ba;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnMail:after,
#reasonInrro .inner article#reason02 .CTA ul li.btnMail:after,
#reasonInrro .inner article#reason03 .CTA ul li.btnMail:after,
#reasonInrro .inner article#reason04 .CTA ul li.btnMail:after,
#reasonInrro .inner article#reason05 .CTA ul li.btnMail:after {
  margin: 0;
  width: 16px;
  height: 11px;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnMail a,
#reasonInrro .inner article#reason02 .CTA ul li.btnMail a,
#reasonInrro .inner article#reason03 .CTA ul li.btnMail a,
#reasonInrro .inner article#reason04 .CTA ul li.btnMail a,
#reasonInrro .inner article#reason05 .CTA ul li.btnMail a {
  background: none;
  color: #0067c0;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnMail p,
#reasonInrro .inner article#reason02 .CTA ul li.btnMail p,
#reasonInrro .inner article#reason03 .CTA ul li.btnMail p,
#reasonInrro .inner article#reason04 .CTA ul li.btnMail p,
#reasonInrro .inner article#reason05 .CTA ul li.btnMail p {
  background: #0067c0;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnLine:after,
#reasonInrro .inner article#reason02 .CTA ul li.btnLine:after,
#reasonInrro .inner article#reason03 .CTA ul li.btnLine:after,
#reasonInrro .inner article#reason04 .CTA ul li.btnLine:after,
#reasonInrro .inner article#reason05 .CTA ul li.btnLine:after {
  margin: 0;
  width: 16px;
  height: 13px;
}

#reasonInrro .inner article#reason01 .CTA ul li.btnLine a,
#reasonInrro .inner article#reason02 .CTA ul li.btnLine a,
#reasonInrro .inner article#reason03 .CTA ul li.btnLine a,
#reasonInrro .inner article#reason04 .CTA ul li.btnLine a,
#reasonInrro .inner article#reason05 .CTA ul li.btnLine a {
  background: none;
  color: #009b00;
}


#reasonInrro .inner article#reason01 .CTA ul li.btnLine p,
#reasonInrro .inner article#reason02 .CTA ul li.btnLine p,
#reasonInrro .inner article#reason03 .CTA ul li.btnLine p,
#reasonInrro .inner article#reason04 .CTA ul li.btnLine p,
#reasonInrro .inner article#reason05 .CTA ul li.btnLine p {
  background: #009b00;
}

/* Reason 01 Settings */
#reasonInrro .inner article#reason01 .inner > picture.comment:before {
  top: -15px;
  right: 10px;
}

#reasonInrro .inner article#reason01 .inner > picture.comment:after {
  content: '安心して\A相談できる';
  top: -11px;
  right: 14px;
}

/* Reason 02 Settings */
#reasonInrro .inner article#reason02 .inner > picture.comment {
  display: none;
}

#reasonInrro .inner article#reason02 .inner > ul.concerns {
  border-bottom: 10px solid #fff;
  position: relative;
  background: #e8f6f9;
  margin: 0 auto;
  padding: 20px 0 0;
  width: 550px;
}

#reasonInrro .inner article#reason02 .inner > ul.concerns:after {
  content: '';
  position: relative;
  display: block;
  background: #fff url("/wp-content/themes/swell/assets/img/top/img_reason02a_sp.png") 0 0 / 100% auto no-repeat;
  width: 550px;
  height: 250px;
}

#reasonInrro .inner article#reason02 .inner > ul.concerns li {
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.1);
  margin: 0 auto 10px;
  width: 90%;
  padding: 15px 0;
  text-align: center;
  line-height: 1.4;
  font-weight: bold;
  font-size: 14px;
}

#reasonInrro .inner article#reason02 .inner > ul.resolution {
  position: relative;
  background: #e8f6f9;
  margin: 0 auto 250px;
  padding: 20px 0 10px;
  width: 550px;
}

#reasonInrro .inner article#reason02 .inner > ul.resolution:after {
  content: '';
  position: absolute;
  bottom: -260px;
  left: 50%;
  display: block;
  background: url("/wp-content/themes/swell/assets/img/top/img_reason02c_sp.png") 0 0 / 100% auto no-repeat;
  margin: 0 0 0 -75px;
  width: 150px;
  height: 250px;
}

#reasonInrro .inner article#reason02 .inner > ul.resolution li {
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.1);
  margin: 0 auto 10px;
  width: 90%;
  padding: 15px 0;
  text-align: center;
  line-height: 1.4;
  font-weight: bold;
  font-size: 14px;
}

#reasonInrro .inner article#reason02 .CTA h4 {
  margin: 0 0 15px;
}

#reasonInrro .inner article#reason02 .CTA h4 span {
  top: 0;
  display: block;
  transform: rotate(0deg);
  border-radius: 12px;
  background: #0067c0;
  margin: 0 auto 5px;
  width: 240px;
  height: 24px;
  line-height: 24px;
  font-size: 16px;
}

/* Reason 03 Settings */
#reasonInrro .inner article#reason03 .inner > picture.comment:before {
  top: -15px;
  right: 10px;
  width: 110px;
  height: 110px;
}

#reasonInrro .inner article#reason03 .inner > picture.comment:after {
  content: '解決が遅れて\A苦しむのは\Aあなた！';
  top: -11px;
  right: 14px;
  padding: 32px 0 0;
  width: 102px;
  height: 102px;
}

#reasonInrro .inner article#reason03 .CTA h4 {
  margin: -10px 0 10px;
}

#reasonInrro .inner article#reason03 .CTA h4 span {
  top: -15px;
  margin: 0 10px 0 -75px;
  padding: 20px 0 0;
  width: 80px;
  height: 80px;
  line-height: 1.2;
  font-size: 16px;
}

/* Reason 04 Settings */
#reasonInrro .inner article#reason04 .inner > picture.comment:before {
  top: -15px;
  right: 10px;
  width: 110px;
  height: 110px;
}

#reasonInrro .inner article#reason04 .inner > picture.comment:after {
  content: '誰にも\A聞かれたくない\A話でも安心！';
  top: -11px;
  right: 14px;
  padding: 28px 0 0;
  width: 102px;
  height: 102px;
}

#reasonInrro .inner article#reason04 .CTA h4 {
  margin: 0 0 25px;
}

#reasonInrro .inner article#reason04 .CTA h4 span {
  top: 0;
  display: block;
  background: none;
  transform: rotate(0deg);
  margin: 10px 0 12px;
  width: auto;
  height: auto;
  line-height: 1;
  font-size: 16px;
  color: #333;
}

/* Reason 05 Settings */
#reasonInrro .inner article#reason05 .inner > picture.comment:before {
  top: -15px;
  right: 10px;
  width: 110px;
  height: 110px;
}

#reasonInrro .inner article#reason05 .inner > picture.comment:after {
  content: '弁護士選び\A失敗したく\Aないなら？';
  top: -11px;
  right: 14px;
  padding: 28px 0 0;
  width: 102px;
  height: 102px;
}

#reasonInrro .inner article#reason05 ol {
  display: flex;
  justify-content: space-between;
  counter-reset: voice-counter1;
  margin: 0 auto 80px;
  padding: 30px 0 0;
  width: 95%;
  max-width: 1080px;
}

#reasonInrro .inner article#reason05 ol li {
  border-radius: 10px;
  background: linear-gradient(to bottom, #0067c0 6px, #fff 6px);
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.2);
  margin: 0 0.5%;
  padding: 0 20px 20px;
  width: 32%;
}

#reasonInrro .inner article#reason05 ol li:before {
  position: relative;
  top: 0;
  left: 50%;
  content: "VOICE."counter(voice-counter1);
  counter-increment: voice-counter1;
  display: inline-block;
  border-radius: 0 0 10px 10px;
  background: #0067c0;
  margin: 0 0 30px -60px;
  width: 120px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.05em;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
}

#reasonInrro .inner article#reason05 ol li h4 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 15px;
}

#reasonInrro .inner article#reason05 ol li h4 picture {
  display: block;
  width: 27.5%;
}

#reasonInrro .inner article#reason05 ol li h4 p {
  width: 70%;
  font-weight: 700;
  font-size: 20px;
  color: #0067c0;
}

#reasonInrro .inner article#reason05 ol li h4 p small {
  display: block;
  margin: 0 0 15px;
  font-weight: 700;
  font-size: 16px;
}

#reasonInrro .inner article#reason05 ol li > picture {
  display: block;
  margin: 0 0 15px;
}

#reasonInrro .inner article#reason05 ol li > p {
  line-height: 1.5;
  font-size: 14px;
}

#reasonInrro .inner article#reason05 > ul.btn {
  position: relative;
  z-index: 0;
  border-radius: 10px;
  background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
  margin: 0 auto 120px;
  padding: 2px 2px 6px;
  width: 500px;
}

#reasonInrro .inner article#reason05 > ul.btn li a {
  position: relative;
  display: block;
  border-radius: 8px;
  background: linear-gradient(0deg, #dadada 0%, #fff 8%);
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.1);
  padding: 15px 30px 15px 0;
  text-align: center;
  line-height: 1.5;
  font-weight: 700;
  font-size: 16px;
}

#reasonInrro .inner article#reason05 > ul.btn li a:after {
  content: '';
  position: absolute;
  top: 37.5%;
  right: 25px;
  border-top: 3px solid #0067c0;
  border-right: 3px solid #0067c0;
  width: 12px;
  height: 12px;
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

#reasonInrro .inner article#reason05 > ul.btn li small {
  display: block;
  font-weight: 500;
  font-size: 14px;
  color: #333;
}

#reasonInrro .inner article#reason05 .CTA h4 {
  margin: -20px 0 10px;
}

#reasonInrro .inner article#reason05 .CTA h4 span {
  top: -10px;
  padding: 22px 0 0;
  width: 75px;
  height: 75px;
  line-height: 1.2;
  font-size: 16px;
}

/* Reason Common Settings */
#reasonInrro .inner article#reasonSummary {
  position: relative;
  border-radius: 20px;
  background: #e8f6f9;
  margin: 0 0 120px;
  padding: 80px 0;
}

#reasonInrro .inner article#reasonSummary h3 {
  position: relative;
  z-index: 1;
  margin: 0 0 30px;
  text-align: center;
}

#reasonInrro .inner article#reasonSummary h3 span {
  border-radius: 2.666667vw;
  background: #0067c0;
  display: block;
  margin: 0 auto 2.4vw;
  width: 110px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-weight: 700;
  font-size: 20px;
  color: #fff;
}

#reasonInrro .inner article#reasonSummary h3 em {
  line-height: 1.5;
  font-weight: 700;
  font-size: 24px;
}

#reasonInrro .inner article#reasonSummary > .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
  width: 95%;
}

#reasonInrro .inner article#reasonSummary > p {
  margin: 0 auto;
  width: 95%;
  line-height: 1.5;
  font-size: 14px;
}

#reasonInrro .inner article#reasonSummary > .inner p {
  width: 62.5%;
  line-height: 1.5;
  font-size: 14px;
}

#reasonInrro .inner article#reasonSummary > .inner picture {
  position: relative;
  display: block;
  width: 35%;
}

#reasonInrro .inner article#reasonSummary ul {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  border-radius: 10px;
  margin: 30px auto 50px;
  width: 600px;
}

#reasonInrro .inner article#reasonSummary ul li {
  border-radius: 1.0666667vw;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  margin: 0 0 10px;
  padding: 4px;
  width: 100%;
}

#reasonInrro .inner article#reasonSummary ul li .inner {
  position: relative;
  border-radius: 12px;
  background: #fff;
  padding: 15px 0 18px;
  height: 100%;
  text-align: center;
  line-height: 1.33333;
  font-weight: 700;
  font-size: 16px;
}

#reasonInrro .inner article#reasonSummary ul li .inner em {
  font-weight: 700;
  font-size: 20px;
  color: #0067c0;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #reasonInrro {
    padding: 12vw 0 0;
  }

  #reasonInrro .inner h2 {
    position: relative;
    margin: 0 0 5.3333333vw;
    padding: 10vw 0 0;
    text-align: center;
    line-height: 1.5;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #reasonInrro .inner h2 small {
    display: block;
    font-size: 4.2666667vw;
  }

  #reasonInrro .inner h2:before {
    content: 'Reason';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100vw;
    text-align: center;
    letter-spacing: 0.05em;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #reasonInrro .inner h2:after {
    content: '';
    position: absolute;
    top: 5.8vw;
    left: 50%;
    display: block;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #reasonInrro > .inner > p {
    margin: 0 auto 12vw;
    width: 92vw;
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  /* INDEX */
  #reasonInrro .inner article.index {
    margin: 0 0 1.3333333vw;
    padding: 8vw 0 6.6666667vw;
    width: 100vw;
  }

  #reasonInrro .inner article.index h3 {
    margin: 0 0 5.2vw;
    text-align: center;
    font-weight: 700;
    font-size: 4.8vw;
  }

  #reasonInrro .inner article.index ul {
    margin: 0 auto;
    width: 92vw;
  }

  #reasonInrro .inner article.index ul li a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 1.3333333vw;
    background: #fff;
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: 0 0 1.3333333vw;
    padding: 0 8vw 0 4vw;
    height: 16vw;
  }

  #reasonInrro .inner article.index ul li a:after {
    content: '';
    position: absolute;
    top: 45.5%;
    right: 4.6666667vw;
    border-top: 0.4vw solid #0067c0;
    border-right: 0.4vw solid #0067c0;
    width: 1.6vw;
    height: 1.6vw;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
  }

  #reasonInrro .inner article.index ul li a:link,
  #reasonInrro .inner article.index ul li a:visited {
    color: #0067c0;
  }

  #reasonInrro .inner article.index ul li a span {
    border-radius: 2.666667vw;
    background: #0067c0;
    display: block;
    width: 14.666667vw;
    height: 5.3333333vw;
    line-height: 5.3333333vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.466667vw;
    color: #fff;
  }

  #reasonInrro .inner article.index ul li a em {
    display: block;
    width: 62.666667vw;
    line-height: 1.5;
    font-weight: 700;
    font-size: 4.2666667vw;
  }

  /* Reason Common Settings */
  #reasonInrro .inner article#reason01,
  #reasonInrro .inner article#reason02,
  #reasonInrro .inner article#reason03,
  #reasonInrro .inner article#reason04,
  #reasonInrro .inner article#reason05 {
    position: relative;
    padding: 10.666667vw 0 16vw;
  }

  #reasonInrro .inner article#reason01:before,
  #reasonInrro .inner article#reason02:before,
  #reasonInrro .inner article#reason03:before,
  #reasonInrro .inner article#reason04:before,
  #reasonInrro .inner article#reason05:before {
    content: '';
    position: absolute;
    top: 0;
    left: 1.3333333vw;
    z-index: 0;
    display: block;
    border-radius: 1.3333333vw;
    background: linear-gradient(0deg, transparent 0%, #e8f6f9 100%);
    width: 97.3333333vw;
    height: 40vw;
  }

  #reasonInrro .inner article#reason01 h3,
  #reasonInrro .inner article#reason02 h3,
  #reasonInrro .inner article#reason03 h3,
  #reasonInrro .inner article#reason04 h3,
  #reasonInrro .inner article#reason05 h3 {
    position: relative;
    z-index: 1;
    margin: 0 0 5.3333333vw;
    text-align: center;
  }

  #reasonInrro .inner article#reason01 h3 span,
  #reasonInrro .inner article#reason02 h3 span,
  #reasonInrro .inner article#reason03 h3 span,
  #reasonInrro .inner article#reason04 h3 span,
  #reasonInrro .inner article#reason05 h3 span {
    border-radius: 2.666667vw;
    background: #0067c0;
    display: block;
    margin: 0 auto 2.4vw;
    width: 14.666667vw;
    height: 5.3333333vw;
    line-height: 5.3333333vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.466667vw;
    color: #fff;
  }

  #reasonInrro .inner article#reason01 h3 em,
  #reasonInrro .inner article#reason02 h3 em,
  #reasonInrro .inner article#reason03 h3 em,
  #reasonInrro .inner article#reason04 h3 em,
  #reasonInrro .inner article#reason05 h3 em {
    font-weight: 700;
    font-size: 4.8vw;
    color: #0067c0;
  }

  #reasonInrro .inner article#reason01 .inner,
  #reasonInrro .inner article#reason02 .inner,
  #reasonInrro .inner article#reason03 .inner,
  #reasonInrro .inner article#reason04 .inner,
  #reasonInrro .inner article#reason05 .inner {
    width: 100%;
  }

  #reasonInrro .inner article#reason01 .inner > p,
  #reasonInrro .inner article#reason02 .inner > p,
  #reasonInrro .inner article#reason03 .inner > p,
  #reasonInrro .inner article#reason04 .inner > p,
  #reasonInrro .inner article#reason05 .inner > p {
    position: relative;
    z-index: 1;
    margin: 0 auto 8vw;
    width: 92vw;
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reason01 .inner > p.w100,
  #reasonInrro .inner article#reason02 .inner > p.w100,
  #reasonInrro .inner article#reason03 .inner > p.w100,
  #reasonInrro .inner article#reason04 .inner > p.w100,
  #reasonInrro .inner article#reason05 .inner > p.w100 {
    width: 92vw;
    text-align: left;
  }

  #reasonInrro .inner article#reason01 .inner > p em,
  #reasonInrro .inner article#reason02 .inner > p em,
  #reasonInrro .inner article#reason03 .inner > p em,
  #reasonInrro .inner article#reason04 .inner > p em,
  #reasonInrro .inner article#reason05 .inner > p em {
    position: relative;
    background: linear-gradient(to top, #fffe85 50%, transparent 50%);
    font-weight: 700;
  }

  #reasonInrro .inner article#reason01 .inner > p strong,
  #reasonInrro .inner article#reason02 .inner > p strong,
  #reasonInrro .inner article#reason03 .inner > p strong,
  #reasonInrro .inner article#reason04 .inner > p strong,
  #reasonInrro .inner article#reason05 .inner > p strong {
    position: relative;
    background: linear-gradient(to top, #b4f0ff 50%, transparent 50%);
    font-weight: 700;
  }

  #reasonInrro .inner article#reason01 .inner > p span,
  #reasonInrro .inner article#reason02 .inner > p span,
  #reasonInrro .inner article#reason03 .inner > p span,
  #reasonInrro .inner article#reason04 .inner > p span,
  #reasonInrro .inner article#reason05 .inner > p span {
    font-weight: 700;
    color: #c00;
  }

  #reasonInrro .inner article#reason01 .inner > picture,
  #reasonInrro .inner article#reason02 .inner > picture,
  #reasonInrro .inner article#reason03 .inner > picture,
  #reasonInrro .inner article#reason04 .inner > picture,
  #reasonInrro .inner article#reason05 .inner > picture {
    position: relative;
    display: block;
    margin: 0 auto 5.3333333vw;
    width: 93.333333vw;
  }


  #reasonInrro .inner article#reason01 .inner > picture.comment:before,
  #reasonInrro .inner article#reason02 .inner > picture.comment:before,
  #reasonInrro .inner article#reason03 .inner > picture.comment:before,
  #reasonInrro .inner article#reason04 .inner > picture.comment:before,
  #reasonInrro .inner article#reason05 .inner > picture.comment:before {
    content: '';
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
    width: 24vw;
    height: 24vw;
  }

  #reasonInrro .inner article#reason01 .inner > picture.comment:after,
  #reasonInrro .inner article#reason02 .inner > picture.comment:after,
  #reasonInrro .inner article#reason03 .inner > picture.comment:after,
  #reasonInrro .inner article#reason04 .inner > picture.comment:after,
  #reasonInrro .inner article#reason05 .inner > picture.comment:after {
    white-space: pre;
    position: absolute;
    z-index: 1;
    border-radius: 50%;
    background: #fff;
    padding: 6.4vw 0 0;
    width: 22.4vw;
    height: 22.4vw;
    text-align: center;
    line-height: 1.3;
    font-weight: 700;
    font-size: 3.733333vw;
    color: #0067c0;
  }

  #reasonInrro .inner article#reason01 .CTA,
  #reasonInrro .inner article#reason02 .CTA,
  #reasonInrro .inner article#reason03 .CTA,
  #reasonInrro .inner article#reason04 .CTA,
  #reasonInrro .inner article#reason05 .CTA {
    box-sizing: border-box;
    border-radius: 1.3333333vw;
    border: 0.5333333vw solid #fff;
    background: url("/wp-content/themes/swell/assets/img/top/bg_cta02_sp.png") 0 0 / cover no-repeat;
    box-shadow: 0 0 2.4vw 0 rgba(102, 102, 102, 0.2);
    margin: 0 auto;
    padding: 2.4vw 0 1.2vw;
    width: 92vw;
    height: auto;
  }

  #reasonInrro .inner article#reason01 .CTA .inner,
  #reasonInrro .inner article#reason02 .CTA .inner,
  #reasonInrro .inner article#reason03 .CTA .inner,
  #reasonInrro .inner article#reason04 .CTA .inner,
  #reasonInrro .inner article#reason05 .CTA .inner {
    width: 100%;
  }

  #reasonInrro .inner article#reason01 .CTA h4,
  #reasonInrro .inner article#reason02 .CTA h4,
  #reasonInrro .inner article#reason03 .CTA h4,
  #reasonInrro .inner article#reason04 .CTA h4,
  #reasonInrro .inner article#reason05 .CTA h4 {
    margin: 0 0 2vw;
    font-weight: 700;
    font-size: 4.8vw;
  }

  #reasonInrro .inner article#reason01 .CTA h4 span,
  #reasonInrro .inner article#reason02 .CTA h4 span,
  #reasonInrro .inner article#reason03 .CTA h4 span,
  #reasonInrro .inner article#reason04 .CTA h4 span,
  #reasonInrro .inner article#reason05 .CTA h4 span {
    position: relative;
    top: -4.4vw;
    display: inline-block;
    transform: rotate(-15deg);
    border-radius: 50%;
    background: #0067c0;
    margin: 0 1.0666667vw 0 -12.4vw;
    width: 11.466667vw;
    height: 11.466667vw;
    line-height: 11.466667vw;
    font-weight: 700;
    font-size: 3.2vw;
    color: #fff;
  }

  #reasonInrro .inner article#reason01 .CTA ul,
  #reasonInrro .inner article#reason02 .CTA ul,
  #reasonInrro .inner article#reason03 .CTA ul,
  #reasonInrro .inner article#reason04 .CTA ul,
  #reasonInrro .inner article#reason05 .CTA ul {
    display: block;
    justify-content: space-between;
    margin: 0 auto;
    width: 92vw;
  }

  #reasonInrro .inner article#reason01 .CTA ul li,
  #reasonInrro .inner article#reason02 .CTA ul li,
  #reasonInrro .inner article#reason03 .CTA ul li,
  #reasonInrro .inner article#reason04 .CTA ul li,
  #reasonInrro .inner article#reason05 .CTA ul li {
    display: flex;
    padding: 0 0 4vw 10vw;
    width: 100%;
  }

  #reasonInrro .inner article#reason01 .CTA ul li:before,
  #reasonInrro .inner article#reason02 .CTA ul li:before,
  #reasonInrro .inner article#reason03 .CTA ul li:before,
  #reasonInrro .inner article#reason04 .CTA ul li:before,
  #reasonInrro .inner article#reason05 .CTA ul li:before {
    display: none;
  }

  #reasonInrro .inner article#reason01 .CTA ul li:after,
  #reasonInrro .inner article#reason02 .CTA ul li:after,
  #reasonInrro .inner article#reason03 .CTA ul li:after,
  #reasonInrro .inner article#reason04 .CTA ul li:after,
  #reasonInrro .inner article#reason05 .CTA ul li:after {
    content: '';
    position: absolute;
    top: 0.4vw;
    left: 4.8vw;
    z-index: 1;
    display: block;
  }

  #reasonInrro .inner article#reason01 .CTA ul li a,
  #reasonInrro .inner article#reason02 .CTA ul li a,
  #reasonInrro .inner article#reason03 .CTA ul li a,
  #reasonInrro .inner article#reason04 .CTA ul li a,
  #reasonInrro .inner article#reason05 .CTA ul li a {
    border-radius: 0;
    margin: 0 0.9333333vw 0 0;
    padding: 0;
    width: auto;
    height: auto;
    text-decoration: underline;
    text-align: left;
    letter-spacing: 0.02em;
    font-weight: 700;
    font-size: 3.466667vw;
  }

  #reasonInrro .inner article#reason01 .CTA ul li > em.onlyPC,
  #reasonInrro .inner article#reason02 .CTA ul li > em.onlyPC,
  #reasonInrro .inner article#reason03 .CTA ul li > em.onlyPC,
  #reasonInrro .inner article#reason04 .CTA ul li > em.onlyPC,
  #reasonInrro .inner article#reason05 .CTA ul li > em.onlyPC {
    display: none;
  }

  #reasonInrro .inner article#reason01 .CTA ul li a:before,
  #reasonInrro .inner article#reason02 .CTA ul li a:before,
  #reasonInrro .inner article#reason03 .CTA ul li a:before,
  #reasonInrro .inner article#reason04 .CTA ul li a:before,
  #reasonInrro .inner article#reason05 .CTA ul li a:before {
    display: none;
  }

  #reasonInrro .inner article#reason01 .CTA ul li a:link,
  #reasonInrro .inner article#reason01 .CTA ul li a:visited,
  #reasonInrro .inner article#reason02 .CTA ul li a:link,
  #reasonInrro .inner article#reason02 .CTA ul li a:visited,
  #reasonInrro .inner article#reason03 .CTA ul li a:link,
  #reasonInrro .inner article#reason03 .CTA ul li a:visited,
  #reasonInrro .inner article#reason04 .CTA ul li a:link,
  #reasonInrro .inner article#reason04 .CTA ul li a:visited,
  #reasonInrro .inner article#reason05 .CTA ul li a:link,
  #reasonInrro .inner article#reason05 .CTA ul li a:visited {
    color: #fff;
  }

  #reasonInrro .inner article#reason01 .CTA ul li a em,
  #reasonInrro .inner article#reason02 .CTA ul li a em,
  #reasonInrro .inner article#reason03 .CTA ul li a em,
  #reasonInrro .inner article#reason04 .CTA ul li a em,
  #reasonInrro .inner article#reason05 .CTA ul li a em {
    display: block;
    padding: 0.4vw 0 1.3333333vw;
    font-weight: 700;
    font-size: 4.8vw;
  }

  #reasonInrro .inner article#reason01 .CTA ul li a em small,
  #reasonInrro .inner article#reason02 .CTA ul li a em small,
  #reasonInrro .inner article#reason03 .CTA ul li a em small,
  #reasonInrro .inner article#reason04 .CTA ul li a em small,
  #reasonInrro .inner article#reason05 .CTA ul li a em small {
    font-weight: 700;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reason01 .CTA ul li p,
  #reasonInrro .inner article#reason02 .CTA ul li p,
  #reasonInrro .inner article#reason03 .CTA ul li p,
  #reasonInrro .inner article#reason04 .CTA ul li p,
  #reasonInrro .inner article#reason05 .CTA ul li p {
    top: 0;
    border-radius: 2vw;
    padding: 0 1.6vw;
    height: 4vw;
    line-height: 4vw;
    letter-spacing: 0;
    font-size: 2.666667vw;
    color: #fff;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnTel:after,
  #reasonInrro .inner article#reason02 .CTA ul li.btnTel:after,
  #reasonInrro .inner article#reason03 .CTA ul li.btnTel:after,
  #reasonInrro .inner article#reason04 .CTA ul li.btnTel:after,
  #reasonInrro .inner article#reason05 .CTA ul li.btnTel:after {
    margin: 0;
    width: 3.466667vw;
    height: 3.466667vw;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnTel a,
  #reasonInrro .inner article#reason02 .CTA ul li.btnTel a,
  #reasonInrro .inner article#reason03 .CTA ul li.btnTel a,
  #reasonInrro .inner article#reason04 .CTA ul li.btnTel a,
  #reasonInrro .inner article#reason05 .CTA ul li.btnTel a {
    background: none;
    color: #0099ba;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnTel p,
  #reasonInrro .inner article#reason02 .CTA ul li.btnTel p,
  #reasonInrro .inner article#reason03 .CTA ul li.btnTel p,
  #reasonInrro .inner article#reason04 .CTA ul li.btnTel p,
  #reasonInrro .inner article#reason05 .CTA ul li.btnTel p {
    background: #0099ba;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnMail:after,
  #reasonInrro .inner article#reason02 .CTA ul li.btnMail:after,
  #reasonInrro .inner article#reason03 .CTA ul li.btnMail:after,
  #reasonInrro .inner article#reason04 .CTA ul li.btnMail:after,
  #reasonInrro .inner article#reason05 .CTA ul li.btnMail:after {
    margin: 0;
    width: 3.733333vw;
    height: 2.8vw;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnMail a,
  #reasonInrro .inner article#reason02 .CTA ul li.btnMail a,
  #reasonInrro .inner article#reason03 .CTA ul li.btnMail a,
  #reasonInrro .inner article#reason04 .CTA ul li.btnMail a,
  #reasonInrro .inner article#reason05 .CTA ul li.btnMail a {
    background: none;
    color: #0067c0;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnMail p,
  #reasonInrro .inner article#reason02 .CTA ul li.btnMail p,
  #reasonInrro .inner article#reason03 .CTA ul li.btnMail p,
  #reasonInrro .inner article#reason04 .CTA ul li.btnMail p,
  #reasonInrro .inner article#reason05 .CTA ul li.btnMail p {
    background: #0067c0;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnLine:after,
  #reasonInrro .inner article#reason02 .CTA ul li.btnLine:after,
  #reasonInrro .inner article#reason03 .CTA ul li.btnLine:after,
  #reasonInrro .inner article#reason04 .CTA ul li.btnLine:after,
  #reasonInrro .inner article#reason05 .CTA ul li.btnLine:after {
    margin: 0;
    width: 3.8666667vw;
    height: 3.333333vw;
  }

  #reasonInrro .inner article#reason01 .CTA ul li.btnLine a,
  #reasonInrro .inner article#reason02 .CTA ul li.btnLine a,
  #reasonInrro .inner article#reason03 .CTA ul li.btnLine a,
  #reasonInrro .inner article#reason04 .CTA ul li.btnLine a,
  #reasonInrro .inner article#reason05 .CTA ul li.btnLine a {
    background: none;
    color: #009b00;
  }


  #reasonInrro .inner article#reason01 .CTA ul li.btnLine p,
  #reasonInrro .inner article#reason02 .CTA ul li.btnLine p,
  #reasonInrro .inner article#reason03 .CTA ul li.btnLine p,
  #reasonInrro .inner article#reason04 .CTA ul li.btnLine p,
  #reasonInrro .inner article#reason05 .CTA ul li.btnLine p {
    background: #009b00;
  }

  /* Reason 01 Settings */
  #reasonInrro .inner article#reason02 .inner > ul.concerns {
    border-bottom: 8vw solid #fff;
    position: relative;
    background: #e8f6f9;
    padding: 4vw 0 0;
  }

  #reasonInrro .inner article#reason01 .inner > picture.comment:before {
    top: -4vw;
    right: 1.3333333vw;
  }

  #reasonInrro .inner article#reason01 .inner > picture.comment:after {
    content: '安心して\A相談できる';
    top: -3.2vw;
    right: 2.1333333vw;
  }

  /* Reason 02 Settings */
  #reasonInrro .inner article#reason02 .inner > picture.comment {
    display: block;
  }

  #reasonInrro .inner article#reason02 .inner > picture.comment:before {
    top: -4vw;
    left: 1.3333333vw;
  }

  #reasonInrro .inner article#reason02 .inner > picture.comment:after {
    content: '不安な時に\A嬉しい！';
    top: -3.2vw;
    left: 2.1333333vw;
  }

  #reasonInrro .inner article#reason02 .inner > ul.concerns:after {
    content: '';
    position: relative;
    display: block;
    background: #fff url("/wp-content/themes/swell/assets/img/top/img_reason02a_sp.png") 0 0 / cover no-repeat;
    width: 100vw;
    height: 38.8vw;
  }

  #reasonInrro .inner article#reason02 .inner > ul.concerns li {
    border-radius: 1.3333333vw;
    background: #fff;
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: 0 auto 2.666667vw;
    width: 92vw;
    padding: 3.2vw 0;
    text-align: center;
    line-height: 1.71;
    font-weight: bold;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reason02 .inner > ul.resolution {
    position: relative;
    background: #e8f6f9;
    margin: 0 0 33.333333vw;
    padding: 4vw 0 9.3333333vw;
  }

  #reasonInrro .inner article#reason02 .inner > ul.resolution:after {
    content: '';
    position: absolute;
    bottom: -28vw;
    left: 50%;
    display: block;
    background: url("/wp-content/themes/swell/assets/img/top/img_reason02c_sp.png") 0 0 / cover no-repeat;
    margin: 0 0 0 -13.6vw;
    width: 27.333333vw;
    height:  37.866667vw;
  }

  #reasonInrro .inner article#reason02 .inner > ul.resolution li {
    border-radius: 1.3333333vw;
    background: #fff;
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: 0 auto 2.666667vw;
    width: 92vw;
    padding: 3.2vw 0;
    text-align: center;
    line-height: 1.71;
    font-weight: bold;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reason02 .CTA h4 {
    margin: 0 0 4vw;
  }

  #reasonInrro .inner article#reason02 .CTA h4 span {
    top: 0;
    display: block;
    transform: rotate(0deg);
    border-radius: 2.666667vw;
    background: #0067c0;
    margin: 0 auto 1.3333333vw;
    width: 46.666667vw;
    height: 5.3333333vw;
    line-height: 5.3333333vw;
    font-size: 3.733333vw;
  }

  /* Reason 03 Settings */
  #reasonInrro .inner article#reason03 .inner > picture.comment:before {
    top: -4vw;
    right: 1.3333333vw;
    width: 26.666667vw;
    height: 26.666667vw;
  }

  #reasonInrro .inner article#reason03 .inner > picture.comment:after {
    content: '解決が遅れて\A苦しむのは\Aあなた！';
    top: -3.2vw;
    right: 2.1333333vw;
    padding: 6vw 0 0;
    width: 25.066667vw;
    height: 25.066667vw;
  }

  #reasonInrro .inner article#reason03 .CTA h4 {
    margin: -3.2vw 0 2vw;
  }

  #reasonInrro .inner article#reason03 .CTA h4 span {
    top: -1.2vw;
    padding: 3.2vw 0 0;
    width: 13.3333333vw;
    height: 13.3333333vw;
    line-height: 1.27;
    font-size: 2.933333vw;
  }


  /* Reason 04 Settings */
  #reasonInrro .inner article#reason04 .inner > picture.comment:before {
    bottom: -4vw;
    left: 1.3333333vw;
    width: 26.666667vw;
    height: 26.666667vw;
  }

  #reasonInrro .inner article#reason04 .inner > picture.comment:after {
    content: '誰にも\A聞かれたくない\A話でも安心！';
    bottom: -3.2vw;
    left: 2.1333333vw;
    padding: 6vw 0 0;
    width: 25.066667vw;
    height: 25.066667vw;
    font-size: 3.466667vw;
  }

  #reasonInrro .inner article#reason04 .CTA h4 {
    margin: 0 0 4vw;
  }

  #reasonInrro .inner article#reason04 .CTA h4 span {
    top: 0;
    display: block;
    background: none;
    transform: rotate(0deg);
    margin: 0.8vw 0 1.3333333vw;
    width: auto;
    height: auto;
    line-height: 1;
    font-size: 3.733333vw;
    color: #333;
  }

  /* Reason 05 Settings */
  #reasonInrro .inner article#reason05 .inner > picture.comment:before {
    bottom: -4vw;
    right: 1.3333333vw;
    width: 26.666667vw;
    height: 26.666667vw;
  }

  #reasonInrro .inner article#reason05 .inner > picture.comment:after {
    content: '弁護士選び\A失敗したく\Aないなら？';
    bottom: -3.2vw;
    right: 2.1333333vw;
    padding: 6vw 0 0;
    width: 25.066667vw;
    height: 25.066667vw;
  }

  #reasonInrro .inner article#reason05 ol {
    display: block;
    counter-reset: voice-counter1;
    margin: 0 auto 6.6666667vw;
    padding: 5.0666667vw 0 0;
    width: 92vw;
  }

  #reasonInrro .inner article#reason05 ol li {
    border-radius: 1.3333333vw;
    background: linear-gradient(to bottom, #0067c0 1.3333333vw, #fff 1.3333333vw);
    box-shadow: 0 0 2.4vw 0 rgba(102, 102, 102, 0.2);
    margin: 0 0 5.3333333vw;
    padding: 0 5.3333333vw 5.3333333vw;
    width: 100%;
  }

  #reasonInrro .inner article#reason05 ol li:before {
    position: relative;
    top: 0;
    left: 50%;
    content: "VOICE."counter(voice-counter1);
    counter-increment: voice-counter1;
    display: inline-block;
    border-radius: 0 0 2.666667vw 2.666667vw;
    background: #0067c0;
    margin: 0 0 8vw -12.66666vw;
    width: 25.333333vw;
    height: 6.6666667vw;
    line-height: 6.6666667vw;
    text-align: center;
    letter-spacing: 0.05em;
    font-weight: 700;
    font-size: 3.733333vw;
    color: #fff;
  }

  #reasonInrro .inner article#reason05 ol li h4 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 4vw;
  }

  #reasonInrro .inner article#reason05 ol li h4 picture {
    display: block;
    width: 22.666667vw;
  }

  #reasonInrro .inner article#reason05 ol li h4 p {
    width: 52.666667vw;
    font-weight: 700;
    font-size: 5.6vw;
    color: #0067c0;
  }

  #reasonInrro .inner article#reason05 ol li h4 p small {
    display: block;
    margin: 0 0 2.1333333vw;
    font-weight: 700;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reason05 ol li > picture {
    display: block;
    margin: 0 0 2.666667vw;
  }

  #reasonInrro .inner article#reason05 ol li > p {
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reason05 > ul.btn {
    position: relative;
    z-index: 0;
    border-radius: 1.3333333vw;
    background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
    margin: 0 auto 10.3333333vw;
    padding: 0.2666667vw 0.2666667vw 0.8vw;
    width: 92vw;
  }

  #reasonInrro .inner article#reason05 > ul.btn li a {
    position: relative;
    display: block;
    border-radius: 0.8vw;
    background: linear-gradient(0deg, #dadada 0%, #fff 8%);
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    padding: 2.4vw 4vw 3.2vw 0;
    text-align: center;
    line-height: 1.5;
    font-weight: 700;
    font-size: 4.2666667vw;
  }

  #reasonInrro .inner article#reason05 > ul.btn li a:after {
    content: '';
    position: absolute;
    top: 45.5%;
    right: 3.2vw;
    border-top: 0.4vw solid #0067c0;
    border-right: 0.4vw solid #0067c0;
    width: 1.6vw;
    height: 1.6vw;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
  }

  #reasonInrro .inner article#reason05 > ul.btn li small {
    display: block;
    font-weight: 500;
    font-size: 3.2vw;
    color: #333;
  }


  #reasonInrro .inner article#reason05 .CTA h4 {
    margin: -3.2vw 0 2vw;
  }

  #reasonInrro .inner article#reason05 .CTA h4 span {
    top: -1.2vw;
    padding: 3.2vw 0 0;
    width: 13.3333333vw;
    height: 13.3333333vw;
    line-height: 1.27;
    font-size: 2.933333vw;
  }

  /* Reason Common Settings */
  #reasonInrro .inner article#reasonSummary {
    position: relative;
    border-radius: 0;
    background: #e8f6f9;
    margin: 0;
    padding: 7.4666667vw 0 16vw;
  }

  #reasonInrro .inner article#reasonSummary h3 {
    position: relative;
    z-index: 1;
    margin: 0 0 12vw;
    text-align: center;
  }

  #reasonInrro .inner article#reasonSummary h3 span {
    border-radius: 2.933333vw;
    background: #0067c0;
    display: block;
    margin: 0 auto 2.666667vw;
    width: 17.333333vw;
    height: 5.8666667vw;
    line-height: 5.8666667vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.466667vw;
    color: #fff;
  }

  #reasonInrro .inner article#reasonSummary h3 em {
    line-height: 1.5;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #reasonInrro .inner article#reasonSummary > .inner {
    display: block;
    width: 100%;
  }

  #reasonInrro .inner article#reasonSummary > .inner p {
    margin: 0 auto;
    width: 92vw;
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reasonSummary > .inner picture {
    position: relative;
    display: block;
    margin: 8vw auto;
    width: 92vw;
  }

  #reasonInrro .inner article#reasonSummary > p {
    margin: 0 auto;
    width: 92vw;
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reasonSummary ul {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-radius: 1.3333333vw;
    margin: 0 auto 1.3333333vw;
    width: 92vw;
  }

  #reasonInrro .inner article#reasonSummary ul li {
    border-radius: 1.0666667vw;
    background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
    margin: 0 0 4vw;
    padding: 0.5333333vw;
    width: 100%;
  }

  #reasonInrro .inner article#reasonSummary ul li .inner {
    position: relative;
    border-radius: 0.5333333vw;
    background: #fff;
    padding: 3.2vw 0 4.5333333vw;
    height: 100%;
    text-align: center;
    line-height: 1.33333;
    font-weight: 700;
    font-size: 3.733333vw;
  }

  #reasonInrro .inner article#reasonSummary ul li .inner em {
    font-weight: 700;
    font-size: 4.8vw;
    color: #0067c0;
  }
}





/* Anchor Navigation setting */
#anchorNav {
  position: fixed;
  top: 80px;
  left: 0;
  z-index: 3;
  background: #fff;
  box-shadow: 0 0 20px 0 rgba(36, 36, 36, 0.1);
  width: 100vw;
  height: 80px;
}

#anchorNav .inner h3 {
  display: none;
}

#anchorNav .inner ul {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  width: 1180px;
}

#anchorNav .inner ul:after {
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  display: block;
  background: #eee;
  width: 1px;
  height: 60px;
}

#anchorNav .inner ul li {
  position: relative;
}

#anchorNav .inner ul li:after {
  content: '';
  position: absolute;
  top: 10px;
  right: 0;
  display: block;
  background: #eee;
  width: 1px;
  height: 60px;
}

#anchorNav .inner ul li a {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: #fff;
  padding: 0 18px;
  height: 80px;
  text-align: center;
  line-height: 1.3;
  font-weight: 700;
  font-size: 14px;
}

#anchorNav .inner ul li a:before {
  content: '';
  position: absolute;
  bottom: -13px;
  left: 50%;
  display: block;
  border-radius: 50%;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  margin: 0 0 0 -13px;
  width: 26px;
  height: 26px;
}

#anchorNav .inner ul li a:after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 50%;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  margin: 0 0 0 -4px;
  width: 8px;
  height: 8px;
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

#anchorNav .inner ul li a:link,
#anchorNav .inner ul li a:visited {
  color: #333;
}

#anchorNav .inner ul li a small {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 11px;
}


/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #anchorNav {
    position: relative;
    top: auto;
    left: auto;
    box-shadow: none;
    background: #f5f5f5;
    margin: 0 0 12vw;
    padding: 8vw 0 10.666667vw;
    height: auto;
  }

  #anchorNav .inner h3 {
    display: block;
    margin: 0 0 5.2vw;
    text-align: center;
    font-weight: 700;
    font-size: 4.8vw;
  }

  #anchorNav .inner ul {
    display: block;
    margin: 0 auto;
    width: 92vw;
    height: auto;
  }

  #anchorNav .inner ul li a {
    position: relative;
    display: block;
    border-radius: 1.3333333vw;
    background: #fff;
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: 0 0 1.3333333vw;
    padding: 0 8vw 0 4vw;
    height: 16vw;
    line-height: 16vw;
    text-align: left;
    font-weight: 700;
    font-size: 4.2666667vw;
  }

  #anchorNav .inner ul li a:before {
    display: none;
  }

  #anchorNav .inner ul li a:after {
    content: '';
    position: absolute;
    bottom: auto;
    left: auto;
    top: 45.5%;
    right: 4.6666667vw;
    border-top: 0.4vw solid #0067c0;
    border-right: 0.4vw solid #0067c0;
    margin: 0;
    width: 1.6vw;
    height: 1.6vw;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
  }

  #anchorNav .inner ul li a:link,
  #anchorNav .inner ul li a:visited {
    color: #0067c0;
  }

  #anchorNav .inner ul li a small {
    display: inline;
    width: auto;
    font-weight: 700;
    font-size: 4.2666667vw;
  }
}





/* Top Information setting */
#topInfo {
  padding: 100px 0 120px;
}

#topInfo .inner h3 {
  margin: 0 0 40px;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#topInfo .inner ul#infoList {
  border-top: 2px solid #f5f5f5;
  margin: 0 auto 60px;
  padding: 20px 0 0;
  width: 95%;
  max-width: 800px;
}

#topInfo .inner ul#infoList li {
  border-bottom: 2px solid #f5f5f5;
  margin: 0 0 20px;
  padding: 0 15px 20px;
  font-size: 16px;
}

#topInfo .inner ul#infoList li span {
  margin: 0 10px 0 0;
  color: #999;
}

#topInfo .inner ul#infoList li em a {
  position: relative;
  top: -2px;
  display: inline-block;
  border-radius: 12px;
  background: #0067c0;
  margin: 0 0 10px;
  padding: 0 10px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  font-size: 12px;
  color: #fff;
}

#topInfo .inner ul#infoList li > a {
  display: block;
  line-height: 1.3;
}

#topInfo .inner ul#infoList li > a:link,
#topInfo .inner ul#infoList li > a:visited {
  text-decoration: underline;
  color: #333;
}

#topInfo .inner ul.btn {
  position: relative;
  z-index: 0;
  border-radius: 10px;
  background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
  margin: 0 auto;
  padding: 2px 2px 6px;
  width: 500px;
}

#topInfo .inner ul.btn li a {
  position: relative;
  display: block;
  border-radius: 8px;
  background: linear-gradient(0deg, #dadada 0%, #fff 8%);
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.1);
  padding: 15px 30px 15px 0;
  text-align: center;
  line-height: 1.5;
  font-weight: 700;
  font-size: 16px;
}

#topInfo .inner ul.btn li a:after {
  content: '';
  position: absolute;
  top: 37.5%;
  right: 25px;
  border-top: 3px solid #0067c0;
  border-right: 3px solid #0067c0;
  width: 12px;
  height: 12px;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #topInfo {
    padding: 12vw 0 16vw;
  }

  #topInfo .inner h3 {
    margin: 0 0 6vw;
    text-align: center;
    font-weight: 700;
    font-size: 4.8vw;
  }

  #topInfo .inner ul#infoList {
    border-top: 0.2666667vw solid #f5f5f5;
    margin: 0 0 8vw;
    padding: 6vw 0 0;
  }

  #topInfo .inner ul#infoList li {
    border-bottom: 0.2666667vw solid #f5f5f5;
    margin: 0 0 4.2666667vw;
    padding: 0 3.733333vw 5.3333333vw;
    font-size: 3.733333vw;
  }

  #topInfo .inner ul#infoList li span {
    margin: 0 2.4vw 0 0;
    color: #999;
  }

  #topInfo .inner ul#infoList li em a {
    position: relative;
    top: -0.4vw;
    display: inline-block;
    border-radius: 2.1333333vw;
    background: #0067c0;
    margin: 0 0 2.4vw;
    padding: 0 2.1333333vw;
    height: 4.2666667vw;
    line-height: 4.2666667vw;
    text-align: center;
    font-size: 2.933333vw;
    color: #fff;
  }

  #topInfo .inner ul#infoList li > a {
    display: block;
    line-height: 1.3;
  }

  #topInfo .inner ul#infoList li > a:link,
  #topInfo .inner ul#infoList li > a:visited {
    text-decoration: underline;
    color: #333;
  }

  #topInfo .inner ul.btn {
    position: relative;
    z-index: 0;
    border-radius: 1.3333333vw;
    background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
    margin: 0 auto;
    padding: 0.2666667vw 0.2666667vw 0.8vw;
    width: 92vw;
  }

  #topInfo .inner ul.btn li a {
    position: relative;
    display: block;
    border-radius: 0.8vw;
    background: linear-gradient(0deg, #dadada 0%, #fff 8%);
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    padding: 0 4vw 0 0;
    height: 14.933333vw;
    line-height: 14.933333vw;
    text-align: center;
    font-weight: 700;
    font-size: 4.2666667vw;
  }

  #topInfo .inner ul.btn li a:after {
    content: '';
    position: absolute;
    top: 45.5%;
    right: 3.2vw;
    border-top: 0.4vw solid #0067c0;
    border-right: 0.4vw solid #0067c0;
    width: 1.6vw;
    height: 1.6vw;
  }
}





/* Work List setting */
#workList {
  background: #e8f6f9;
  padding: 100px 0 120px;
}

#workList .inner {
  margin: 0 auto;
  width: 95%;
  max-width: 1080px;
}

#workList .inner h3 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#workList .inner h3:before {
  content: 'Works';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#workList .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#workList .inner > p {
  margin: 0 auto 40px;
  width: 100%;
  line-height: 1.5;
  text-align: center;
  font-size: 14px;
}

#workList .inner .tabContainer {
  width: 100%;
}

#workList .inner .tabContainer input[name="tab"] {
  display: none;
  width: 0;
  height: 0;
  opacity: 0;
  border: none;
  margin: 0;
  padding: 0;
  position: absolute;
  z-index: -1;
}

#workList .inner .tabContainer .tabLabel {
  position: relative;
  display: inline-block;
  border-bottom: 6px solid #dedede;
  width: 49.7%;
  height: 80px;
  line-height: 80px;
  text-align: center;
  font-weight: 700;
  font-size: 20px;
  color: #999;
  transition: background 0.3s;
  cursor: pointer;
}

#workList .inner .tabContainer .tabContent {
  display: none;
  width: 100%;
}

#workList .inner .tabContainer #tabLabel1:checked ~ #worksContent1,
#workList .inner .tabContainer #tabLabel2:checked ~ #worksContent2 {
  display: block;
}

#workList .inner .tabContainer input:checked + .tabLabel {
  border-bottom: 6px solid #0067c0;
  color: #0067c0;
}

#workList .inner .tabContainer input:checked + .tabLabel:after {
  content: '';
  position: absolute;
  bottom: -20px;
  left: 50%;
  z-index: 1;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -15px;
  width: 30px;
  height: 16px;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

#workList .inner .tabContainer .tabContent ul {
  display: flex;
  flex-wrap: wrap;
  padding: 30px 0 0;
}

#workList .inner .tabContainer .tabContent ul li {
  position: relative;
  border-radius: 10px;
  background-color: rgb(255, 255, 255);
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.1);
  margin: 0 1% 10px 0;
  width: 24.25%;
  overflow: hidden;
}

#workList .inner .tabContainer .tabContent ul li:nth-child(4n) {
  margin: 0 0 10px;
}

#workList .inner .tabContainer .tabContent ul li:before {
  content: '';
  position: absolute;
  left: 50%;
  top: 30px;
  display: block;
  margin: 0 0 0 -40px;
  width: 80px;
  height: 80px;
}

#workList .inner .tabContainer .tabContent ul li.trafficAccident:before {background: url("/wp-content/themes/swell/assets/img/top/ico_traffic-accident.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.inheritance:before {background: url("/wp-content/themes/swell/assets/img/top/ico_inheritance.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.divorce:before {background: url("/wp-content/themes/swell/assets/img/top/ico_divorce.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.debt:before {background: url("/wp-content/themes/swell/assets/img/top/ico_debt.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.medicalAccidents:before {background: url("/wp-content/themes/swell/assets/img/top/ico_medical-accidents.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.criminalCases:before {background: url("/wp-content/themes/swell/assets/img/top/ico_criminal-cases.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.juvenileDelinquency:before {background: url("/wp-content/themes/swell/assets/img/top/ico_juvenile-delinquency.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.hepatitisBLawsuit:before {background: url("/wp-content/themes/swell/assets/img/top/ico_hepatitis-b-lawsuit.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.laborIssues:before {background: url("/wp-content/themes/swell/assets/img/top/ico_labor-issues.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.asbestosCompensation:before {background: url("/wp-content/themes/swell/assets/img/top/ico_asbestos-compensation.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.constructionDisputes:before {background: url("/wp-content/themes/swell/assets/img/top/ico_construction-disputes.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.internationalLegalAffairs:before {background: url("/wp-content/themes/swell/assets/img/top/ico_international-legal-affairs.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.schoolIssues:before {background: url("/wp-content/themes/swell/assets/img/top/ico_school-issues.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.debtCollection:before {background: url("/wp-content/themes/swell/assets/img/top/ico_debt-collection.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.cyberDefamation:before {background: url("/wp-content/themes/swell/assets/img/top/ico_cyber-defamation.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.realEstateIssue:before {background: url("/wp-content/themes/swell/assets/img/top/ico_real-estate-issue.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.advisoryContract:before {background: url("/wp-content/themes/swell/assets/img/top/ico_advisory-contract.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.b2bTransactions:before {background: url("/wp-content/themes/swell/assets/img/top/ico_b2b-transactions.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.companyBankruptcy:before {background: url("/wp-content/themes/swell/assets/img/top/ico_company-bankruptcy.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.ip:before {background: url("/wp-content/themes/swell/assets/img/top/ico_ip.png") 0 0 / 100% no-repeat;}
#workList .inner .tabContainer .tabContent ul li.overseas:before {background: url("/wp-content/themes/swell/assets/img/top/ico_overseas.png") 0 0 / 100% no-repeat;}

#workList .inner .tabContainer .tabContent ul li a {
  position: relative;
  display: block;
  padding: 130px 15px 30px;
  height: 100%;
}

#workList .inner .tabContainer .tabContent ul li a:before {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
  display: block;
  background: #0067c0;
  width: 50px;
  height: 50px;
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

#workList .inner .tabContainer .tabContent ul li a:after {
  content: '';
  position: absolute;
  bottom: 13px;
  right: 15px;
  z-index: 1;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  width: 8px;
  height: 8px;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#workList .inner .tabContainer .tabContent ul li a h4 {
  position: relative;
  margin: 0 0 20px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
}

#workList .inner .tabContainer .tabContent ul li a p {
  line-height: 1.5;
  font-size: 14px;
  color: #333;
}

#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1),
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2),
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3),
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4) {
  width: 49.5%;
}

#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2) {
  margin: 0 0 10px;
}

#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1):before,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2):before,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3):before,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4):before {
  left: 50%;
  top: 30px;
  margin: 0 0 0 -40px;
}

#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1) a,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2) a,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3) a,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4) a {
  padding: 130px 15px 15px;
}

#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1) a h4,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2) a h4,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3) a h4,
#workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4) a h4 {
  text-align: center;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #workList {
    background: #e8f6f9;
    padding: 16vw 0 13.3333333vw;
  }

  #workList .inner {
    width: 100vw;
  }
  
  #workList .inner h3 {
    position: relative;
    margin: 0 0 4.2666667vw;
    padding: 10vw 0 0;
    text-align: center;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #workList .inner h3:before {
    content: 'Works';
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #workList .inner h3:after {
    content: '';
    position: absolute;
    top: 4.2666667vw;
    left: 50%;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #workList .inner > p {
    margin: 0 auto 9.6vw;
    width: 92vw;
    line-height: 1.71;
    text-align: left;
    font-size: 3.733333vw;
  }

  #workList .inner .tabContainer {
    margin: 0 auto;
    width: 97.3333333vw;
  }

  #workList .inner .tabContainer input[name="tab"] {
    display: none;
    width: 0;
    height: 0;
    opacity: 0;
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: -1; /* さらに上に要素があっても表示されないようにする */
  }

  #workList .inner .tabContainer .tabLabel {
    position: relative;
    display: inline-block;
    border-bottom: 1.0666667vw solid #dedede;
    width: 49.58%;
    height: 11.333333vw;
    line-height: 11.333333vw;
    text-align: center;
    font-weight: 700;
    font-size: 4.8vw;
    color: #999;
    transition: background 0.3s;
    cursor: pointer;
  }

  #workList .inner .tabContainer .tabContent {
    display: none;
    margin: 0 auto;
    width: 94.666667vw;
  }

  #workList .inner .tabContainer #tabLabel1:checked ~ #worksContent1,
  #workList .inner .tabContainer #tabLabel2:checked ~ #worksContent2 {
    display: block;
  }

  #workList .inner .tabContainer input:checked + .tabLabel {
    border-bottom: 1.0666667vw solid #0067c0;
    color: #0067c0;
  }

  #workList .inner .tabContainer input:checked + .tabLabel:after {
    content: '';
    position: absolute;
    bottom: -3.12vw;
    left: 50%;
    z-index: 1;
    display: block;
    background: #0067c0;
    margin: 0 0 0 -2vw;
    width: 4vw;
    height: 2.1333333vw;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }

  #workList .inner .tabContainer .tabContent ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 8vw 0 0;
  }

  #workList .inner .tabContainer .tabContent ul li {
    position: relative;
    border-radius: 1.3333333vw;
    background-color: rgb(255, 255, 255);
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: 0 0 2.666667vw;
    width: 100%;
    overflow: hidden;
  }

  #workList .inner .tabContainer .tabContent ul li:before {
    content: '';
    position: absolute;
    left: 4vw;
    top: 50%;
    display: block;
    margin: -8vw 0 0;
    width: 16vw;
    height: 16vw;
  }

  #workList .inner .tabContainer .tabContent ul li.trafficAccident:before {background: url("/wp-content/themes/swell/assets/img/top/ico_traffic-accident.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.inheritance:before {background: url("/wp-content/themes/swell/assets/img/top/ico_inheritance.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.divorce:before {background: url("/wp-content/themes/swell/assets/img/top/ico_divorce.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.debt:before {background: url("/wp-content/themes/swell/assets/img/top/ico_debt.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.medicalAccidents:before {background: url("/wp-content/themes/swell/assets/img/top/ico_medical-accidents.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.criminalCases:before {background: url("/wp-content/themes/swell/assets/img/top/ico_criminal-cases.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.juvenileDelinquency:before {background: url("/wp-content/themes/swell/assets/img/top/ico_juvenile-delinquency.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.hepatitisBLawsuit:before {background: url("/wp-content/themes/swell/assets/img/top/ico_hepatitis-b-lawsuit.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.laborIssues:before {background: url("/wp-content/themes/swell/assets/img/top/ico_labor-issues.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.asbestosCompensation:before {background: url("/wp-content/themes/swell/assets/img/top/ico_asbestos-compensation.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.constructionDisputes:before {background: url("/wp-content/themes/swell/assets/img/top/ico_construction-disputes.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.internationalLegalAffairs:before {background: url("/wp-content/themes/swell/assets/img/top/ico_international-legal-affairs.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.schoolIssues:before {background: url("/wp-content/themes/swell/assets/img/top/ico_school-issues.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.debtCollection:before {background: url("/wp-content/themes/swell/assets/img/top/ico_debt-collection.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.cyberDefamation:before {background: url("/wp-content/themes/swell/assets/img/top/ico_cyber-defamation.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.realEstateIssue:before {background: url("/wp-content/themes/swell/assets/img/top/ico_real-estate-issue.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.advisoryContract:before {background: url("/wp-content/themes/swell/assets/img/top/ico_advisory-contract.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.b2bTransactions:before {background: url("/wp-content/themes/swell/assets/img/top/ico_b2b-transactions.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.companyBankruptcy:before {background: url("/wp-content/themes/swell/assets/img/top/ico_company-bankruptcy.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.ip:before {background: url("/wp-content/themes/swell/assets/img/top/ico_ip.png") 0 0 / 100% no-repeat;}
  #workList .inner .tabContainer .tabContent ul li.overseas:before {background: url("/wp-content/themes/swell/assets/img/top/ico_overseas.png") 0 0 / 100% no-repeat;}

  #workList .inner .tabContainer .tabContent ul li a {
    position: relative;
    display: block;
    padding: 4.2666667vw 5.6vw 4.2666667vw 24vw;
    height: 100%;
  }

  #workList .inner .tabContainer .tabContent ul li a:before {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    display: block;
    background: #0067c0;
    width: 6.8vw;
    height: 6.8vw;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
  }

  #workList .inner .tabContainer .tabContent ul li a:after {
    content: '';
    position: absolute;
    bottom: 1.4vw;
    right: 1.8vw;
    z-index: 1;
    border-top: 0.2666667vw solid #fff;
    border-right: 0.2666667vw solid #fff;
    width: 1.0666667vw;
    height: 1.0666667vw;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  #workList .inner .tabContainer .tabContent ul li a h4 {
    position: relative;
    margin: 0 0 2.4vw;
    text-align: left;
    font-weight: 700;
    font-size: 3.733333vw;
  }

  #workList .inner .tabContainer .tabContent ul li a p {
    line-height: 1.5;
    font-size: 3.2vw;
    color: #333;
  }

  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1),
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2),
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3),
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4) {
    width: 100%;
  }

  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1):before,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2):before,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3):before,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4):before {
    top: 5.3333333vw;
    left: 50%;
    margin: 0 0 0 -8vw;
  }

  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1) a,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2) a,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3) a,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4) a {
    padding: 27.2vw 3.2vw 6.6666667vw;
  }

  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(1) a h4,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(2) a h4,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(3) a h4,
  #workList .inner .tabContainer .tabContent#worksContent1 ul li:nth-child(4) a h4 {
    text-align: center;
  }
}





/* Case List setting */
#caseList {
  padding: 100px 0 120px;
}

#caseList .inner h3 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#caseList .inner h3:before {
  content: 'Case';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#caseList .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#caseList .inner > p {
  margin: 0 auto 40px;
  width: 100%;
  line-height: 1.5;
  text-align: center;
  font-size: 14px;
}

#caseList .inner ol {
  display: flex;
  flex-wrap: wrap;
  counter-reset: case-counter1;
  margin: 0 auto;
  width: 95%;
  max-width: 1080px;
}

#caseList .inner ol li {
  position: relative;
  border-radius: 10px;
  box-shadow: 0 0 20px 0 rgba(102, 102, 102, 0.2);
  background: #fff;
  margin: 0 2% 15px 0;
  padding: 0 0 15px;
  width: 32%;
  overflow: hidden;
}

#caseList .inner ol li:nth-child(3n) {
  margin: 0 0 15px;
}

#caseList .inner ol li:before {
  position: relative;
  top: 0;
  left: 0;
  z-index: 0;
  content: "解決事例."counter(case-counter1);
  counter-increment: case-counter1;
  display: inline-block;
  background: #ff4f29 url("/wp-content/themes/swell/assets/img/top/ttl_case-en.png") 0 0 / auto 100% no-repeat;
  margin: 0 0 20px;
  padding: 0 0 0 20px;
  width: 100%;
  height: 40px;
  line-height: 40px;
  letter-spacing: 0.05em;
  font-weight: 700;
  font-size: 16px;
  color: #fff;
}

#caseList .inner ol li h4 {
  position: relative;
  margin: 0 0 20px;
  padding: 0 15px 0 100px;
  min-height: 75px;
}

#caseList .inner ol li h4 picture {
  position: absolute;
  top: 0;
  left: 15px;
  display: block;
  width: 75px;
}

#caseList .inner ol li h4 em {
  display: block;
  line-height: 1.5;
  font-weight: 700;
  font-size: 15px;
  color: #0067c0;
}

#caseList .inner ol li h4 small {
  border-top: 1px solid #ddd;
  display: block;
  margin: 10px 0 0;
  padding: 10px 0 0;
  font-size: 12px;
  color: #999;
}

#caseList .inner ol li span {
  position: absolute;
  top: 10px;
  right: 10px;
  display: block;
  border-radius: 6px;
  background: #fff;
  padding: 0 10px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  font-weight: 700;
  font-size: 12px;
  color: #0067c0;
}

#caseList .inner ol li p {
  margin: 0 auto 20px;
  width: 95%;
  line-height: 1.5;
  font-size: 14px;
}

#caseList .inner ol li > picture {
  display: block;
  margin: 0 auto;
  width: 95%;
}

#caseList .inner ol li article h5 {
  margin: 0 auto;
  width: 95%;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #caseList {
    padding: 16vw 0 13.3333333vw;
  }

  #caseList .inner h3 {
    position: relative;
    margin: 0 0 4.2666667vw;
    padding: 10vw 0 0;
    text-align: center;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #caseList .inner h3:before {
    content: 'Case';
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #caseList .inner h3:after {
    content: '';
    position: absolute;
    top: 4.2666667vw;
    left: 50%;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #caseList .inner > p {
    margin: 0 auto 8vw;
    width: 92vw;
    line-height: 1.71;
    text-align: center;
    font-size: 3.733333vw;
  }

  #caseList .inner ol {
    display: block;
    counter-reset: case-counter1;
    margin: 0 auto 6.6666667vw;
    width: 92vw;
  }

  #caseList .inner ol li {
    position: relative;
    border-radius: 1.3333333vw;
    box-shadow: 0 0 2.4vw 0 rgba(102, 102, 102, 0.2);
    background: #fff;
    margin: 0 0 4vw;
    padding: 0 0 4vw;
    width: 100%;
    overflow: hidden;
  }

  #caseList .inner ol li:before {
    position: relative;
    top: 0;
    left: 0;
    z-index: 0;
    content: "解決事例."counter(case-counter1);
    counter-increment: case-counter1;
    display: inline-block;
    margin: 0 0 4.8vw;
    padding: 0 0 0 4vw;
    width: 100%;
    height: 12vw;
    line-height: 12vw;
    letter-spacing: 0.05em;
    font-weight: 700;
    font-size: 3.733333vw;
    color: #fff;
  }

  #caseList .inner ol li h4 {
    position: relative;
    margin: 0 0 3.733333vw;
    padding: 0 4vw 0 30.666667vw;
    min-height: 22.666667vw;
  }

  #caseList .inner ol li h4 picture {
    position: absolute;
    top: 0;
    left: 4vw;
    display: block;
    width: 22.666667vw;
  }

  #caseList .inner ol li h4 em {
    display: block;
    line-height: 1.5;
    font-weight: 700;
    font-size: 4.2666667vw;
    color: #0067c0;
  }

  #caseList .inner ol li h4 small {
    border-top: 0.2666667vw solid #ddd;
    display: block;
    margin: 3.466667vw 0 0;
    padding: 3.466667vw 0 0;
    font-size: 3.2vw;
    color: #999;
  }

  #caseList .inner ol li span {
    position: absolute;
    top: 2.666667vw;
    right: 2.666667vw;
    display: block;
    border-radius: 0.8vw;
    background: #fff;
    padding: 0 3.2vw;
    height: 6.6666667vw;
    line-height: 6.6666667vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.733333vw;
    color: #0067c0;
  }

  #caseList .inner ol li p {
    margin: 0 auto 5.6vw;
    width: 84vw;
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #caseList .inner ol li > picture {
    display: block;
    margin: 0 auto;
    width: 84vw;
  }

  #caseList .inner ol li article h5 {
    margin: 0 auto;
    width: 84vw;
  }
}





/* Step setting */
#step {
  background: #e8f6f9;
  padding: 100px 0 120px;
}

#step > .inner {
  margin: 0 auto;
  width: 95%;
  max-width: 1080px;
}

#step .inner h3 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#step .inner h3:before {
  content: 'Step';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#step .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#step .inner ol#stepIntro {
  display: flex;
  justify-content: space-between;
  counter-reset: step-counter1;
  margin: 0 auto 60px;
  padding: 20px 0 0;
  width: 95%;
  max-width: 900px;
}

#step .inner ol#stepIntro > li {
  position: relative;
  border-radius: 8px;
  background: #fff;
  padding: 40px 0 0;;
  width: 17.5%;
  height: 90px;
  text-align: center;
  line-height: 1.2;
  font-weight: 700;
  font-size: 14px;
}

#step .inner ol#stepIntro > li:before {
  position: absolute;
  top: -25px;
  left: 50%;
  z-index: 1;
  content: "STEP\A" counter(step-counter1);
  white-space: pre;
  counter-increment: step-counter1;
  display: inline-block;
  border-radius: 50%;
  background: #09a8c4;
  margin: 0 0 0 -25px;
  padding: 13px 0 0;
  width: 50px;
  height: 50px;
  line-height: 1.2;
  text-align: center;
  letter-spacing: 0.05em;
  font-weight: 700;
  font-size: 12px;
  color: #fff;
}

#step .inner ol#stepIntro > li:not(:last-child):after {
  content: '';
  position: absolute;
  top: 40%;
  right: -15%;
  z-index: 1;
  display: block;
  background: linear-gradient(0deg, #09a8c5 0%, #3725ba 100%);
  width: 10.5%;
  height: 20px;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

#step .inner ol#stepDetail {
  counter-reset: step-counter2;
  width: 100%;
}

#step .inner ol#stepDetail > li {
  display: flex;
  position: relative;
  border-radius: 10px;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  margin: 0 0 50px;
  padding: 4px;
}

#step .inner ol#stepDetail > li:before {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 1;
  content: "STEP."counter(step-counter2);
  counter-increment: step-counter2;
  display: inline-block;
  border-radius: 0 0 10px 10px;
  background: #09a8c4;
  margin: 0 0 30px -60px;
  width: 120px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.05em;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
}

#step .inner ol#stepDetail > li:not(:last-child):after {
  content: '';
  position: absolute;
  bottom: -40px;
  left: 50%;
  z-index: 1;
  display: block;
  background: linear-gradient(0deg, #09a8c5 0%, #3725ba 100%);
  margin: 0 0 0 -40px;
  width: 80px;
  height: 40px;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}

#step .inner ol#stepDetail li > .inner {
  position: relative;
  border-radius: 6px;
  background: #fff;
  padding: 0 15px 15px 30px;
  width: 100%;
  height: 100%;
  min-height: 190px;
  text-align: center;
  line-height: 1.33333;
  font-weight: 700;
  font-size: 14px;
  overflow: hidden;
}

#step .inner ol#stepDetail li > .inner picture {
  position: absolute;
  top: 15px;
  right: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 27.5%;
  aspect-ratio: 68 / 37;
  overflow: hidden;
}

#step .inner ol#stepDetail li > .inner picture img {
  display: block;
  width: auto;
  height: 100%;
  object-fit: contain;
}

#step .inner ol#stepDetail li > .inner h4 {
  margin: 30px 0 15px;
  text-align: left;
  font-weight: 700;
  font-size: 20px;
  color: #0067c0;
}

#step .inner ol#stepDetail li > .inner > p {
  width: 70%;
  line-height: 1.5;
  text-align: left;
  font-size: 14px;
}

#step .inner ol#stepDetail li > .inner .CTA {
  border-top: none;
  border-bottom: none;
  background: none;
  box-shadow: none;
  margin: 30px auto 0;
  padding: 0;
  height: auto;
  width: 100%;
}

#step .inner ol#stepDetail li > .inner .CTA ul {
  flex-wrap: nowrap;
  width: 100%;
}

#step .inner ol#stepDetail li > .inner .CTA ul li {
  margin: 0 0.5%;
  width: 25%;
  line-height: 1;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel {
  width: 36.5%;
}

#step .inner ol#stepDetail li > .inner .CTA ul li a {
  padding: 0 0 0 35px;
  width: 100%;
  font-size: 14px;
}

#step .inner ol#stepDetail li > .inner .CTA ul li a em,
#step .inner ol#stepDetail li > .inner .CTA ul li a em small {
  font-size: 14px;
}

#step .inner ol#stepDetail li > .inner .CTA ul li a p {
  width: 100%;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC span {
  display: block;
  border-radius: 50%;
  background: #eb3323;
  padding: 9px 0 0;
  width: 38px;
  height: 38px;
  text-align: center;
  line-height: 1.25;
  font-weight: 700;
  font-size: 9px;
  color: #fff;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC p {
  position: relative;
  padding: 0 15px 0 35px;
  font-weight: 800;
  font-size: 32px;
  color: #eb3323;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC p:before {
  content: '';
  position: absolute;
  top: 6px;
  left: 10px;
  display: block;
  width: 22px;
  height: 26px;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC dl {
  border-radius: 12px;
  margin: 5px 0 0;
  height: 24px;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC dl dt {
  width: 75px;
  text-align: center;
  letter-spacing: 0.1em;
  font-weight: 700;
  font-size: 12px;
  color: #0067c0;
}

#step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC dl dd {
  border-left: 1px solid #ddd;
  padding: 0 15px;
  text-align: left;
  font-size: 12px;
}

#step .inner ol#stepDetail li > .inner > ul.evidence {
  margin: 15px auto 0;
  width: 100%;
}

#step .inner ol#stepDetail li > .inner > ul.evidence li {
  padding: 0 0 0 13px;
  line-height: 1.5;
  text-align: left;
  font-size: 13px;
}

#step .inner ol#stepDetail li > .inner > ul.evidence li:first-letter {
  margin: 0 0 0 -13px;
}

#step .inner ol#stepDetail li article {
  position: relative;
  border-radius: 10px;
  background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
  margin: 25px auto 0;
  padding: 6px;
  width: 70%;
}

#step .inner ol#stepDetail li article:after {
  content: '';
  position: absolute;
  top: -16px;
  left: 50%;
  z-index: 1;
  display: block;
  background: #009fe9;
  margin: 0 0 0 -8px;
  width: 16px;
  height: 16px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

#step .inner ol#stepDetail li article > .inner {
  position: relative;
  border-radius: 6px;
  background: #fff;
  padding: 15px 0;
  height: 100%;
  text-align: center;
}

#step .inner ol#stepDetail li article > .inner h5 {
  margin: 0 0 1.4vw;
  font-weight: 700;
  font-size: 20px;
  color: #0067c0;
}

#step .inner ol#stepDetail li article > .inner p {
  line-height: 1.5;
  font-size: 14px;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #step {
    padding: 16vw 0 8vw;
  }

  #step > .inner {
    width: 100%;
  }

  #step .inner h3 {
    position: relative;
    margin: 0 0 8vw;
    padding: 10vw 0 0;
    text-align: center;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #step .inner h3:before {
    content: 'Step';
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #step .inner h3:after {
    content: '';
    position: absolute;
    top: 4.2666667vw;
    left: 50%;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #step .inner ol#stepIntro {
    display: none;
  }

  #step .inner ol#stepDetail {
    margin: 0 auto 6.6666667vw;
    width: 92vw;
  }

  #step .inner ol#stepDetail > li {
    position: relative;
    border-radius: 1.3333333vw;
    margin: 0 0 8vw;
    padding: 0.6666667vw;
  }

  #step .inner ol#stepDetail > li:before {
    border-radius: 0 0 2.666667vw 2.666667vw;
    margin: 0 0 8vw -12.66666vw;
    width: 25.333333vw;
    height: 7.3333333vw;
    line-height: 7.3333333vw;
    letter-spacing: 0.05em;
    font-size: 3.733333vw;
  }


  #step .inner ol#stepDetail > li:not(:last-child):after {
    content: '';
    position: absolute;
    bottom: -5.2vw;
    left: 50%;
    z-index: 1;
    display: block;
    background: linear-gradient(0deg, #09a8c5 0%, #3725ba 100%);
    margin: 0 0 0 -8.6666667vw;
    width: 17.333333vw;
    height: 5.3333333vw;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }

  #step .inner ol#stepDetail li > .inner {
    position: relative;
    border-radius: 0.5333333vw;
    background: #fff;
    padding: 0 0 4.5333333vw;
    height: 100%;
    text-align: center;
    line-height: 1.33333;
    font-weight: 700;
    font-size: 3.733333vw;
  }

  #step .inner ol#stepDetail li > .inner picture {
    position: relative;
    top: auto;
    right: auto;
    display: block;
    width: 100%;
    margin: 0 0 4.8vw;
  }

  #step .inner ol#stepDetail li > .inner h4 {
    margin: 0 0 4vw;
    text-align: center;
    font-weight: 700;
    font-size: 4.8vw;
    color: #0067c0;
  }

  #step .inner ol#stepDetail li > .inner > p {
    margin: 0 auto;
    width: 81.333333vw;
    line-height: 1.71;
    text-align: left;
    font-size: 3.733333vw;
  }

  #step .inner ol#stepDetail li > .inner .CTA {
    border-top: none;
    border-bottom: none;
    background: none;
    box-shadow: none;
    margin: 0 auto;
    padding: 4.8vw 0 0;
    height: auto;
  }

  #step .inner ol#stepDetail li > .inner .CTA ul {
    width: 85.333333vw;
  }

  #step .inner ol#stepDetail li > .inner .CTA ul li,
  #step .inner ol#stepDetail li > .inner .CTA ul li.btnTel {
    width: 28vw;
    line-height: 1;
  }

  #step .inner ol#stepDetail li > .inner .CTA ul li a:before {
    width: 27.466667vw;
  }

  #step .inner ol#stepDetail li > .inner .CTA ul li a {
    padding: 4.2666667vw 0 0;
  }

  #step .inner ol#stepDetail li > .inner .CTA ul li a p {
    width: 25.333333vw;
  }

  #step .inner ol#stepDetail li > .inner .CTA ul li.btnTel .onlyPC {
    display: none;
  }

  #step .inner ol#stepDetail li > .inner > ul.evidence {
    margin: 3.733333vw auto 0;
    width: 81.333333vw;
  }

  #step .inner ol#stepDetail li > .inner > ul.evidence li {
    padding: 0 0 0 3.2vw;
    line-height: 1.5;
    text-align: left;
    font-size: 3.2vw;
  }

  #step .inner ol#stepDetail li > .inner > ul.evidence li:first-letter {
    margin: 0 0 0 -3.2vw;
  }

  #step .inner ol#stepDetail li article {
    position: relative;
    border-radius: 1.3333333vw;
    background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
    margin: 7.2vw auto 0;
    padding: 1.3333333vw;
    width: 81.333333vw;
  }

  #step .inner ol#stepDetail li article:after {
    content: '';
    position: absolute;
    top: -2.1333333vw;
    left: 50%;
    z-index: 1;
    display: block;
    background: #009fe9;
    margin: 0 0 0 -1.0666667vw;
    width: 2.1333333vw;
    height: 2.1333333vw;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
  }

  #step .inner ol#stepDetail li article > .inner {
    position: relative;
    border-radius: 0.8vw;
    background: #fff;
    padding: 3.2vw 0 3.2vw;
    height: 100%;
    text-align: center;
  }

  #step .inner ol#stepDetail li article > .inner h5 {
    margin: 0 0 1.4vw;
    font-weight: 700;
    font-size: 4.2666667vw;
    color: #0067c0;
  }

  #step .inner ol#stepDetail li article > .inner p {
    line-height: 1.71;
    font-size: 3.733333vw;
  }
}





/* Cost setting */
#cost {
  padding: 100px 0 120px;
}

#cost .inner h3 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#cost .inner h3:before {
  content: 'Cost';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#cost .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#cost > .inner > ul {
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  width: 95%;
  max-width: 1080px;
}

#cost > .inner > ul > li {
  position: relative;
  width: 49%;
}

#cost > .inner > ul > li picture {
  position: absolute;
  top: 170px;
  left: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 150px;
  overflow: hidden;
}

#cost > .inner > ul > li > .inner {
  position: relative;
  z-index: 1;
  border-radius: 1.3333333vw;
  background-color: rgb(255, 255, 255);
  box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
  padding: 20px 0 30px;
  width: 100%;
  height: 100%;
}

#cost > .inner > ul > li > .inner h4 {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0 0 180px;
  height: 140px;
  text-align: center;
  line-height: 1.5;
}

#cost > .inner > ul > li > .inner h4 span {
  display: flex;
  justify-content: center;
  border-radius: 15px;
  background: #0067c0;
  margin: 0 auto 10px;
  padding: 0 10px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
}

#cost > .inner > ul > li > .inner h4 em {
  display: flex;
  justify-content: center;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 18px;
}

#cost > .inner > ul > li > .inner h4 em strong {
  position: relative;
  top: -15px;
  font-weight: 700;
  font-size: 34px;
  color: #c00;
}

#cost > .inner > ul > li > .inner p {
  margin: 0 auto;
  width: 90%;
  line-height: 1.5;
  text-align: left;
  font-size: 14px;
}

#cost > .inner > ul > li > .inner p em {
  position: relative;
  background: linear-gradient(to top, #fffe85 50%, transparent 50%);
  font-weight: 700;
}

#cost > .inner > ul > li > .inner p strong {
  position: relative;
  background: linear-gradient(to top, #b4f0ff 50%, transparent 50%);
  font-weight: 700;
}

#cost > .inner > ul > li > .inner p span {
  font-weight: 700;
  color: #c00;
}

#cost > .inner > ul > li > .inner ul {
  border-radius: 1.3333333vw;
  margin: 20px auto 0;
  width: 90%;
}

#cost > .inner > ul > li > .inner ul.merit li {
  border-radius: 10px;
  background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
  margin: 0 0 10px;
  padding: 4px;
}

#cost > .inner > ul > li > .inner ul.merit li .inner {
  border-radius: 6px;
  background: #fff;
  height: 30px;
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.05em;
  font-weight: 700;
  font-size: 16px;
}

#cost > .inner > ul > li > .inner ul.merit li .inner em {
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#cost > .inner > ul > li > .inner > ul.evidence {
  margin: 20px auto 0;
  width: 90%;
}

#cost > .inner > ul > li > .inner > ul.evidence li {
  padding: 0 0 0 12px;
  line-height: 1.5;
  text-align: left;
  font-size: 12px;
}

#cost > .inner > ul > li > .inner > ul.evidence li:first-letter {
  margin: 0 0 0 -12px;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #cost {
    padding: 16vw 0 4vw;
  }

  #cost .inner h3 {
    position: relative;
    margin: 0 0 8vw;
    padding: 10vw 0 0;
    text-align: center;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #cost .inner h3:before {
    content: 'Cost';
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #cost .inner h3:after {
    content: '';
    position: absolute;
    top: 4.2666667vw;
    left: 50%;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #cost > .inner > ul {
    display: block;
    width: 100%;
  }

  #cost > .inner > ul > li {
    position: relative;
    width: 100%;
  }

  #cost > .inner > ul > li picture {
    position: relative;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: auto;
  }

  #cost > .inner > ul > li > .inner {
    position: relative;
    z-index: 1;
    border-radius: 1.3333333vw;
    background-color: rgb(255, 255, 255);
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: -10.666667vw auto 12vw;
    padding: 5.3333333vw 0 8.6666667vw;
    width: 94.666667vw;
  }

  #cost > .inner > ul > li > .inner h4 {
    margin: 0 0 5.3333333vw;
    text-align: center;
    line-height: 1.5;
  }

  #cost > .inner > ul > li > .inner h4 span {
    display: inline-block;
    border-radius: 2.933333vw;
    background: #0067c0;
    margin: 0 0 2.4vw;
    padding: 0 2.666667vw;
    height: 5.8666667vw;
    line-height: 5.8666667vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.733333vw;
    color: #fff;
  }

  #cost > .inner > ul > li > .inner h4 em {
    display: block;
    text-align: center;
    font-weight: 700;
    font-size: 4.8vw;
  }

  #cost > .inner > ul > li > .inner h4 em strong {
    top: 0.4vw;
    font-size: 10.4vw;
  }

  #cost > .inner > ul > li > .inner p {
    margin: 0 auto;
    width: 84vw;
    line-height: 1.71;
    text-align: left;
    font-size: 3.733333vw;
  }

  #cost > .inner > ul > li > .inner ul {
    border-radius: 1.3333333vw;
    margin: 5.6vw auto 0;
    width: 84vw;
  }

  #cost > .inner > ul > li > .inner ul.merit li {
    border-radius: 1.0666667vw;
    background: linear-gradient(0deg, #3725ba 0%, #09a8c5 100%);
    margin: 0 0 2.666667vw;
    padding: 0.5333333vw;
  }

  #cost > .inner > ul > li > .inner ul.merit li .inner {
    border-radius: 0.5333333vw;
    background: #fff;
    height: 14.666667vw;
    line-height: 14.666667vw;
    text-align: center;
    letter-spacing: 0.05em;
    font-weight: 700;
    font-size: 3.733333vw;
  }

  #cost > .inner > ul > li > .inner ul.merit li .inner em {
    font-weight: 700;
    font-size: 4.8vw;
    color: #0067c0;
  }

  #cost > .inner > ul > li > .inner > ul.evidence {
    margin: 3.733333vw auto 0;
    width: 81.333333vw;
  }

  #cost > .inner > ul > li > .inner > ul.evidence li {
    padding: 0 0 0 3.2vw;
    line-height: 1.5;
    text-align: left;
    font-size: 3.2vw;
  }

  #cost > .inner > ul > li > .inner > ul.evidence li:first-letter {
    margin: 0 0 0 -3.2vw;
  }
}





/* Voice setting */
#voice {
  background: #e8f6f9;
  padding: 100px 0 120px;
}

#voice .inner {
  margin: 0 auto;
  width: 95%;
  max-width: 1080px;
}

#voice .inner h3 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#voice .inner h3:before {
  content: 'Voice';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#voice .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#voice .inner > p {
  margin: 0 auto 30px;
  line-height: 1.5;
  text-align: center;
  font-size: 14px;
}

#voice .inner ol {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  counter-reset: voice-counter1;
  margin: 0 auto;
  padding: 30px 0 0;
  width: 95%;
  max-width: 1080px;
}

#voice .inner ol li {
  border-radius: 10px;
  background: linear-gradient(to bottom, #0067c0 6px, #fff 6px);
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.2);
  margin: 0 0.5% 15px;
  padding: 0 20px 20px;
  width: 32%;
}

#voice .inner ol li:before {
  position: relative;
  top: 0;
  left: 50%;
  content: "VOICE."counter(voice-counter1);
  counter-increment: voice-counter1;
  display: inline-block;
  border-radius: 0 0 10px 10px;
  background: #0067c0;
  margin: 0 0 30px -60px;
  width: 120px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.05em;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
}

#voice .inner ol li h4 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 15px;
}

#voice .inner ol li h4 picture {
  display: block;
  width: 27.5%;
}

#voice .inner ol li h4 p {
  width: 70%;
  font-weight: 700;
  font-size: 20px;
  color: #0067c0;
}

#voice .inner ol li h4 p small {
  display: block;
  margin: 0 0 15px;
  font-weight: 700;
  font-size: 16px;
}

#voice .inner ol li > picture {
  display: block;
  margin: 0 0 15px;
}

#voice .inner ol li > p {
  line-height: 1.5;
  font-size: 14px;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #voice {
    padding: 16vw 0 10.666667vw;
  }

  #voice .inner {
    width: 100%;
  }

  #voice .inner h3 {
    position: relative;
    margin: 0 0 8vw;
    padding: 10vw 0 0;
    text-align: center;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #voice .inner h3:before {
    content: 'Voice';
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #voice .inner h3:after {
    content: '';
    position: absolute;
    top: 4.2666667vw;
    left: 50%;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #voice .inner > p {
    margin: 0 auto 8vw;
    width: 92vw;
    line-height: 1.71;
    text-align: center;
    font-size: 3.733333vw;
  }

  #voice .inner ol {
    display: block;
    counter-reset: voice-counter1;
    margin: 0 auto 6.6666667vw;
    width: 92vw;
  }

  #voice .inner ol li {
    border-radius: 1.3333333vw;
    background: linear-gradient(to bottom, #0067c0 1.3333333vw, #fff 1.3333333vw);
    box-shadow: 0 0 2.4vw 0 rgba(102, 102, 102, 0.2);
    margin: 0 0 5.3333333vw;
    padding: 0 5.3333333vw 5.3333333vw;
    width: 100%;
  }

  #voice .inner ol li:before {
    position: relative;
    top: 0;
    left: 50%;
    content: "VOICE."counter(voice-counter1);
    counter-increment: voice-counter1;
    display: inline-block;
    border-radius: 0 0 2.666667vw 2.666667vw;
    background: #0067c0;
    margin: 0 0 8vw -12.66666vw;
    width: 25.333333vw;
    height: 6.6666667vw;
    line-height: 6.6666667vw;
    text-align: center;
    letter-spacing: 0.05em;
    font-weight: 700;
    font-size: 3.733333vw;
    color: #fff;
  }

  #voice .inner ol li h4 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 4vw;
  }

  #voice .inner ol li h4 picture {
    display: block;
    width: 22.666667vw;
  }

  #voice .inner ol li h4 p {
    width: 52.666667vw;
    font-weight: 700;
    font-size: 5.6vw;
    color: #0067c0;
  }

  #voice .inner ol li h4 p small {
    display: block;
    margin: 0 0 2.1333333vw;
    font-weight: 700;
    font-size: 3.733333vw;
  }

  #voice .inner ol li > picture {
    display: block;
    margin: 0 0 2.666667vw;
  }

  #voice .inner ol li > p {
    line-height: 1.71;
    font-size: 3.733333vw;
  }
}





/* Lawyers Introduction setting */
#lawyersIntro {
  padding: 100px 0 120px;
}

#lawyersIntro .inner h3 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#lawyersIntro .inner h3:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#lawyersIntro .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#lawyersIntro .inner article > p {
  line-height: 1.5;
  font-size: 14px;
}

#lawyersIntro .inner #leadAttorney {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  flex-direction: row-reverse;
  margin: 0 auto 40px;
  width: 95%;
  max-width: 1080px;
  line-height: 1.5;
  font-size: 14px;
}

#lawyersIntro .inner #leadAttorney h3 {
  width: 100%;
}

#lawyersIntro .inner #leadAttorney h3:before {
  content: 'Message';
}

#lawyersIntro .inner #leadAttorney .ph {
  display: block;
  width: 25%;
}

#lawyersIntro .inner #leadAttorney .ph picture {
  display: block;
  width: 100%;
}

#lawyersIntro .inner #leadAttorney .ph h4 {
  margin: 0 auto 15px;
  text-align: center;
  font-weight: bold;
  font-size: 16px;
}

#lawyersIntro .inner #leadAttorney p {
  width: 70%;
}

#lawyersIntro .inner #member h3:before {
  content: 'Member';
}

#lawyersIntro .inner #member .slider {
}

#lawyersIntro .inner #member .slider .slick-list .slick-track {
  overflow: hidden;
}

#lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide {
  position: relative;
  display: inline-block;
  margin: 0 25px;
  width: 200px !important;
  transition: none;
}

#lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide picture {
  position: relative;
  z-index: 1;
  display: block;
  margin: 0 auto;
  width: 200px;
}

#lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 {
  padding: 15px 0 0;
  width: 100%;
  text-align: center;
}

#lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 span {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 1;
  display: block;
  border-radius: 4px;
  background: #0067c0;
  padding: 0 5px;
  height: 20px;
  line-height: 20px;
  font-weight: 500;
  font-size: 12px;
  color: #fff;
}

#lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 em {
  font-weight: 700;
  font-size: 16px;
  color: #333;
}

#lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 small {
  display: block;
  padding: 10px 0 0;
  font-weight: 500;
  font-size: 12px;
  color: #333;
}

#lawyersIntro .inner #member .slider .slick-arrow {
  position: absolute;
  top: 25%;
  left: 0;
  z-index: 1;
  border-radius: 0 10px 10px 0;
  background: rgba(0,0,0,0.70);
  width: 45px;
  height: 120px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

#lawyersIntro .inner #member .slider .slick-arrow:before {
  content: '';
  position: absolute;
  top: 45%;
  left: 20px;
  z-index: 1;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  width: 10px;
  height: 10px;
  -ms-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

#lawyersIntro .inner #member .slider .slick-arrow.slick-next {
  left: auto;
  right: 0;
  border-radius: 10px 0 0 10px;
}

#lawyersIntro .inner #member .slider .slick-arrow.slick-next:before {
  left: auto;
  right: 20px;
  transform: rotate(45deg);
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #lawyersIntro {
    padding: 16vw 0;
  }

  #lawyersIntro .inner h3 {
    position: relative;
    margin: 0 0 8vw;
    padding: 10vw 0 0;
    text-align: center;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #lawyersIntro .inner h3:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #lawyersIntro .inner h3:after {
    content: '';
    position: absolute;
    top: 4.2666667vw;
    left: 50%;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #lawyersIntro .inner article > p {
    margin: 0 auto 16vw;
    width: 92vw;
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #lawyersIntro .inner #leadAttorney {
    display: block;
  }

  #lawyersIntro .inner #leadAttorney h3:before {
    content: 'Message';
  }

  #lawyersIntro .inner #leadAttorney .ph {
    margin: 0 auto 3.733333vw;
    width: 53.333333vw;
  }

  #lawyersIntro .inner #leadAttorney .ph picture {
    display: block;
    width: 53.333333vw;
  }

  #lawyersIntro .inner #leadAttorney .ph h4 {
    margin: 0 auto 5.3333333vw;
    text-align: center;
    font-weight: bold;
    font-size: 3.733333vw;
  }

  #lawyersIntro .inner #leadAttorney p {
    width: 100%;
  }

  #lawyersIntro .inner #member h3:before {
    content: 'Member';
  }

  #lawyersIntro .inner #member .slider {
  }

  #lawyersIntro .inner #member .slider .slick-list .slick-track {
    overflow: hidden;
  }

  #lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide {
    position: relative;
    display: inline-block;
    margin: 0 4vw;
    width: 53.333333vw !important;
    transition: none;
  }

  #lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide picture {
    position: relative;
    z-index: 1;
    display: block;
    margin: 0 auto;
    width: 53.333333vw;
  }

  #lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 {
    padding: 3.6vw 0 0;
    width: 100%;
    text-align: center;
  }

  #lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 span {
    position: absolute;
    top: 1.3333333vw;
    right: 1.3333333vw;
    z-index: 1;
    display: block;
    border-radius: 0.5333333vw;
    background: #0067c0;
    padding: 0 2.1333333vw;
    height: 4.8vw;
    line-height: 4.8vw;
    font-weight: 500;
    font-size: 3.2vw;
    color: #fff;
  }

  #lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 em {
    font-weight: 700;
    font-size: 3.733333vw;
    color: #333;
  }

  #lawyersIntro .inner #member .slider .slick-list .slick-track .slick-slide h4 small {
    display: block;
    padding: 1.2vw 0 0;
    font-weight: 500;
    font-size: 3.2vw;
    color: #333;
  }

  #lawyersIntro .inner #member .slider .slick-arrow {
    position: absolute;
    top: 30%;
    left: 0;
    z-index: 1;
    border-radius: 0 1.3333333vw 1.3333333vw 0;
    background: rgba(0,0,0,0.70);
    width: 8vw;
    height: 21.333333vw;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
  }

  #lawyersIntro .inner #member .slider .slick-arrow:before {
    content: '';
    position: absolute;
    top: 45%;
    left: 3.2vw;
    z-index: 1;
    border-top: 0.4vw solid #fff;
    border-right: 0.4vw solid #fff;
    width: 1.3333333vw;
    height: 1.3333333vw;
    -ms-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
  }

  #lawyersIntro .inner #member .slider .slick-arrow.slick-next {
    left: auto;
    right: 0;
    border-radius: 1.3333333vw 0 0 1.3333333vw;
  }

  #lawyersIntro .inner #member .slider .slick-arrow.slick-next:before {
    left: auto;
    right: 3.2vw;
    transform: rotate(45deg);
  }
}





/* FAQ setting */
#faq {
  background: #e8f6f9;
  padding: 100px 0 120px;
}

#faq .inner {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  width: 95%;
  max-width: 1080px;
}

#faq .inner h3 {
  position: relative;
  margin: 0 0 40px;
  padding: 75px 0 0;
  width: 100%;
  text-align: center;
  line-height: 1.5;
  font-weight: 700;
  font-size: 24px;
}

#faq .inner h3:before {
  content: 'Faq';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#faq .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#faq .inner article {
  margin: 0 1%;
  width: 31%;
}

#faq .inner article h4 {
  background: linear-gradient(0deg, #0067c0 0%, #009fe9 100%);
  margin: 0 0 15px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #fff;
}

#faq .inner article ul {
  margin: 0 auto;
  width: 98.5%;
}

#faq .inner article ul li {
  position: relative;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 0 15px 0 rgba(102, 102, 102, 0.1);
  margin: 0 0 10px;
  padding: 0 20px;
}

#faq .inner article ul li dl {
}

#faq .inner article ul li dl dt {
  position: relative;
  padding: 20px 20px 20px 40px;
}

#faq .inner article ul li dl dt:before {
  content: 'Q';
  position: absolute;
  top: 32.5%;
  left: 0;
  display: block;
  border-radius: 50%;
  background: #0067c0;
  width: 30px;
  height: 30px;
  line-height: 26px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #fff;
}

#faq .inner article ul li dl dt h5 {
  position: relative;
  line-height: 1.5;
  font-weight: 700;
  font-size: 14px;
}

#faq .inner article ul li dl dt h5:before,
#faq .inner article ul li dl dt h5:after {
  content: '';
  position: absolute;
  top: 50%;
  right: -20px;
  z-index: 1;
  display: block;
  background: #0067c0;
  width: 15px;
  height: 3px;
}

#faq .inner article ul li dl dt h5:after {
  transform: rotate(90deg);
}

#faq .inner article ul li dl dd {
  position: relative;
  opacity: 0;
  transition: height 0.6s ease, opacity 0.6s ease;
  height: 0;
  line-height: 1.5;
  font-size: 14px;
}

#faq .inner article ul li dl dd:before {
  content: 'A';
  position: absolute;
  top: -5px;
  left: 0;
  display: block;
  border-radius: 50%;
  background: #e8f6f9;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-weight: 700;
  font-size: 20px;
  color: #0067c0;
}

#faq .inner article ul li.active dl:after {
  display: none;
}

#faq .inner article ul li.active dl dt {
  border-bottom: 1px solid #eee;
  margin: 0 0 20px;
}

#faq .inner article ul li.active dl dt h5:after {
  display: none;
}

#faq .inner article ul li.active dl dd {
  padding: 0 0 20px 40px;
  height: auto;
  opacity: 1;
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #faq {
    background: #e8f6f9;
    padding: 16vw 0 6.6666667vw;
  }

  #faq .inner {
    display: block;
    width: 100%;
  }

  #faq .inner h3 {
    margin: 0 0 8vw;
    padding: 10vw 0 0;
    font-size: 5.6vw;
  }

  #faq .inner h3:before {
    width: 100vw;
    font-size: 3.2vw;
  }

  #faq .inner h3:after {
    top: 5.4vw;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #faq .inner article {
    margin: 0 0 9.3333333vw;
    width: 100%;
  }

  #faq .inner article h4 {
    margin: 0 0 4vw;
    height: 13.3333333vw;
    line-height: 13.3333333vw;
    font-size: 4.8vw;
  }

  #faq .inner article ul {
    margin: 0 auto;
    width: 94.666667vw;
  }

  #faq .inner article ul li {
    border-radius: 1.3333333vw;
    box-shadow: 0 0 2vw 0 rgba(102, 102, 102, 0.1);
    margin: 0 0 2.666667vw;
    padding: 0 4vw;
  }

  #faq .inner article ul li dl {
  }

  #faq .inner article ul li dl dt {
    padding: 5.0666667vw 5.6vw 5.0666667vw 12vw;
  }

  #faq .inner article ul li dl dt:before {
    top: 32.5%;
    width: 8vw;
    height: 8vw;
    line-height: 7vw;
    font-size: 4.8vw;
  }

  #faq .inner article ul li dl dt h5 {
    line-height: 1.71;
    font-size: 3.7333333vw;
  }

  #faq .inner article ul li dl dt h5:before,
  #faq .inner article ul li dl dt h5:after {
    right: -6vw;
    width: 2.666667vw;
    height: 0.5333333vw;
  }

  #faq .inner article ul li dl dd {
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #faq .inner article ul li dl dd:before {
    top: 1.6vw;
    width: 8vw;
    height: 8vw;
    line-height: 8vw;
    font-size: 4.8vw;
  }

  #faq .inner article ul li.active dl dt {
    border-bottom: 0.2666667vw solid #eee;
    margin: 0 0 4vw;
  }

  #faq .inner article ul li.active dl dd {
    padding: 0 2.4vw 5.0666667vw 12vw;
  }
}





/* Office setting */
#office {
  padding: 100px 0 120px;
}

#office .inner {
  position: relative;
  margin: 0 auto;
  width: 95%;
  max-width: 1160px;
  height: 950px;
}

#office .inner h3 {
  position: relative;
  margin: 0 0 30px;
  padding: 75px 0 0;
  text-align: center;
  font-weight: 700;
  font-size: 24px;
}

#office .inner h3:before {
  content: 'Office';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #0067c0;
}

#office .inner h3:after {
  content: '';
  position: absolute;
  top: 35px;
  left: 50%;
  display: block;
  background: #0067c0;
  margin: 0 0 0 -18px;
  width: 36px;
  height: 4px;
}

#office .inner h4 {
  margin: 0 0 25px;
  text-align: center;
  line-height: 1.5;
  font-weight: 700;
  font-size: 18px;
  color: #0067c0;
}

#office .inner > p {
  margin: 0 0 80px;
  line-height: 1.5;
  text-align: center;
  font-size: 14px;
}

#office .inner picture {
  display: block;
  margin: 0 0 0 32.5%;
  width: 43.1%;
  max-width: 500px;
}

#office .inner > ul {
}

#office .inner > ul > li {
  position: absolute;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 0 20px 0 rgba(36, 36, 36, 0.1);
  padding: 20px 1.72% 10px;
  width: 31.89%;
  max-width: 370px;
}

#office .inner > ul > li#areaHokkaido {top: 240px; right: 0; width: 17.24%; max-width: 200px;}
#office .inner > ul > li#areaTohoku {top: 385px; right: 0; width: 17.24%; max-width: 200px;}
#office .inner > ul > li#areaKanto {top: 530px; right: 0;}
#office .inner > ul > li#areaKansai {top: 785px; right: 0;}
#office .inner > ul > li#areaShikoku {top: 785px; right: 34.05%;}
#office .inner > ul > li#areaChugoku {top: 530px; left: 0;}
#office .inner > ul > li#areaKyushu {top: 725px; left: 0;}
#office .inner > ul > li#areaOkinawa {top: 330px; left: 0;}

#office .inner > ul li dl dt {
  padding: 0 0 20px;
  text-align: center;
  font-weight: 700;
  font-size: 18px;
}

#office .inner > ul li dl dd {
}

#office .inner > ul li dl dd ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
}

#office .inner > ul li dl dd ul li {
  margin: 0 0 10px;
  width: 48%;
  max-width: 160px;
}

#office .inner > ul li#areaHokkaido dl dd ul li,
#office .inner > ul li#areaTohoku dl dd ul li {
  width: 100%;
}

#office .inner > ul li dl dd ul li a {
  position: relative;
  display: block;
  border-radius: 10px;
  background: linear-gradient(-60deg, #0067c0 0%, #009fe9 100%);
  padding: 0 15px 0 0;
  width: 100%;
  height: 44px;
  line-height: 44px;
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
}

#office .inner > ul li dl dd ul li a:before {
  content: '';
  position: absolute;
  top: 2px;
  left: 1.25%;
  display: block;
  border-radius: 8px;
  background-image: linear-gradient(to bottom, rgb(255,255,255) 0%, rgba(255,255,255,0) 100%);
  width: 97.5%;
  height: 20px;
  opacity: 0.8;
}

#office .inner > ul li dl dd ul li a:after {
  content: '';
  position: absolute;
  top: 46.5%;
  right: 10px;
  z-index: 1;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  width: 6px;
  height: 6px;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* ------------------------------------------------------------------------
	Ajustment For Smart Phone 
------------------------------------------------------------------------ */
@media screen and (max-width: 768px) {
  #office {
    padding: 16vw 0 6.6666667vw;
  }

  #office .inner {
    height: auto;
  }

  #office .inner h3 {
    position: relative;
    margin: 0 0 6vw;
    padding: 10vw 0 0;
    text-align: center;
    font-weight: 700;
    font-size: 5.6vw;
  }

  #office .inner h3:before {
    content: 'Office';
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.2vw;
    color: #0067c0;
  }

  #office .inner h3:after {
    content: '';
    position: absolute;
    top: 4.2666667vw;
    left: 50%;
    background: #0067c0;
    margin: 0 0 0 -2.4vw;
    width: 4.8vw;
    height: 0.5333333vw;
  }

  #office .inner h4 {
    margin: 0 0 2.666667vw;
    text-align: center;
    line-height: 1.5;
    font-weight: 700;
    font-size: 4.2666667vw;
    color: #0067c0;
  }

  #office .inner > p {
    margin: 0 0 12vw;
    text-align: center;
    line-height: 1.71;
    font-size: 3.733333vw;
  }

  #office .inner picture {
    display: none;
  }

  #office .inner > ul {
    margin: 0 auto;
    width: 94.666667vw;
  }

  #office .inner > ul li {
  }

  #office .inner > ul > li {
    position: relative;
    border-radius: 0;
    box-shadow: none;
    margin: 0 0 9.3333333vw;
    padding: 0;
    width: 100%;
    max-width: 100%;
  }

  #office .inner > ul > li#areaHokkaido {top: auto; right: auto; width: 100%; max-width: 100%;}
  #office .inner > ul > li#areaTohoku {top: auto; right: auto; width: 100%; max-width: 100%;}
  #office .inner > ul > li#areaKanto {top: auto; right: auto;}
  #office .inner > ul > li#areaKansai {top: auto; right: auto;}
  #office .inner > ul > li#areaShikoku {top: auto; right: auto;}
  #office .inner > ul > li#areaChugoku {top: auto; left: auto;}
  #office .inner > ul > li#areaKyushu {top: auto; left: auto;}
  #office .inner > ul > li#areaOkinawa {top: auto; left: auto;}

  #office .inner > ul li dl dt {
    border-bottom: 0.2666667vw solid #ddd;
    padding: 0 0 2.666667vw;
    text-align: center;
    font-weight: 700;
    font-size: 4.2666667vw;
  }

  #office .inner > ul li dl dd {
    padding: 2.666667vw 0 0;
  }

  #office .inner > ul li dl dd ul {
    justify-content: flex-start;
    margin: 0 auto;
    width: 92vw;
  }

  #office .inner > ul li dl dd ul li {
    margin: 0 2vw 2vw 0;
    width: 29.333333vw;
    max-width: 29.333333vw;
  }

  #office .inner > ul li dl dd ul li:nth-child(3n) {
    margin: 0 0 2vw;
  }

  #office .inner > ul li dl dd ul li a {
    position: relative;
    display: block;
    border-radius: 1.3333333vw;
    background: linear-gradient(-60deg, #0067c0 0%, #009fe9 100%);
    padding: 0 2.4vw 0 0;
    width: 100%;
    height: 13.3333333vw;
    line-height: 13.3333333vw;
    text-align: center;
    font-weight: 700;
    font-size: 3.733333vw;
    color: #fff;
  }

  #office .inner > ul li dl dd ul li a:before {
    content: '';
    position: absolute;
    top: 0.2666667vw;
    left: 0.2666667vw;
    display: block;
    border-radius: 1.0666667vw;
    background-image: linear-gradient(to bottom, rgb(255,255,255) 0%, rgba(255,255,255,0) 100%);
    width: 28.8vw;
    height: 3.2vw;
    opacity: 0.8;
  }

  #office .inner > ul li dl dd ul li a:after {
    content: '';
    position: absolute;
    top: 48.5%;
    right: 2vw;
    z-index: 1;
    border-top: 0.4vw solid #fff;
    border-right: 0.4vw solid #fff;
    width: 1.3333333vw;
    height: 1.3333333vw;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
}