/* CSS Document */
/*//////////////////////////////////////////////////////////////////////////////////////////////

  reset style

//////////////////////////////////////////////////////////////////////////////////////////////*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, 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 {
  font-size: 100%;
  border: none;
  outline: none;
  vertical-align: baseline;
  background: transparent;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

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

nav ul {
  list-style: none;
}

img {
  border: none;
  outline: none;
  vertical-align: top;
}

li {
  list-style: none;
}

address {
  font-style: normal;
}

a {
  text-decoration: none;
}

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

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

button {
  background: none;
  border: none;
  outline: none;
  cursor: pointer;
}

i, cite, em, var, address {
  font-style: normal;
}

em {
  font-weight: bold;
}

strong, b {
  font-weight: normal;
}

legend {
  margin: 0;
  float: none;
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}

body {
  background: #fff;
  font-family: 'BIZ UDPGothic', sans-serif;
  color: #0b1d29;
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
}

a {
  color: #0b1d29;
}

a:focus {
  outline: 0;
}

#document {
  width: 100%;
  min-height: 100vh;
  background: #f5f9fa;
  display: flex;
  align-items: center;
  flex-direction: column;
  font-feature-settings: "palt";
  position: relative;
  overflow: hidden;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  #document {
    overflow-x: hidden;
  }
}

@media screen and (max-width: 767px) {
  #document {
    overflow-x: hidden;
  }
}

#document.is-nav {
  height: 0;
  overflow-y: hidden;
}

#document.is-nav:before {
  display: block;
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}

#document.is-open {
  height: 0;
  overflow-y: hidden;
}

.mypage #document {
  background: #f5f9fa;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mypage #document {
    background: none;
  }
}

@media screen and (max-width: 767px) {
  .mypage #document {
    background: none;
  }
}

.mypage #document:after {
  display: block;
  content: "";
  width: 100rem;
  height: 66.5rem;
  background: url(/common/images/mypage/bg_content_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mypage #document:after {
    width: 100%;
    height: 42.4rem;
    top: 6rem;
    left: 0;
    transform: translateX(0);
  }
}

@media screen and (max-width: 767px) {
  .mypage #document:after {
    width: 100%;
    height: 42.4rem;
    top: 6rem;
    left: 0;
    transform: translateX(0);
  }
}

#document.is-fix--btn {
  padding: 0 0 9rem;
}

.global-hd {
  width: 100%;
  background: #fff;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  position: relative;
  z-index: 101;
}

.mypage .global-hd {
  background: none;
  box-shadow: none;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mypage .global-hd {
    background: #fff;
  }
}

@media screen and (max-width: 767px) {
  .mypage .global-hd {
    background: #fff;
  }
}

.global-hd--content {
  max-width: 68rem;
  margin: 0 auto;
  padding: 1.5rem 0;
  display: flex;
  align-items: center;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .global-hd--content {
    min-height: 5.6rem;
    padding: .8rem 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .global-hd--content {
    min-height: 5.6rem;
    padding: .8rem 1.5rem;
  }
}

.mypage .global-hd--content {
  max-width: 96rem;
  margin: 0 auto;
  padding: 1.2rem 1.5rem 0;
}

.global-hd--content .nav {
  margin-left: auto;
}

.global-hd--content .nav--one .todo {
  padding: 3.2rem 0 0;
  display: block;
  font-weight: 700;
  font-size: 1.6rem;
  color: #666;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .global-hd--content .nav--one .todo {
    padding: 2rem 0 0;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 767px) {
  .global-hd--content .nav--one .todo {
    padding: 2rem 0 0;
    font-size: 1.2rem;
  }
}

.global-hd--content .nav--one .todo:before {
  display: block;
  content: "";
  width: 2.4rem;
  height: 2.7rem;
  background: url(/common/images/img_todo_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .global-hd--content .nav--one .todo:before {
    width: 1.7rem;
    height: 2rem;
    margin: 0 0 0 .3rem;
  }
}

@media screen and (max-width: 767px) {
  .global-hd--content .nav--one .todo:before {
    width: 1.7rem;
    height: 2rem;
    margin: 0 0 0 .3rem;
  }
}

.global-hd--content .nav--one .todo:hover:before {
  background: url(/common/images/img_todo_01_hv.png) no-repeat 0 0;
  background-size: 100% auto;
}

.global-hd--ttl a {
  display: block;
}

.global-hd--ttl a img {
  width: 24.9rem;
  height: auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .global-hd--ttl a img {
    width: 16.4rem;
  }
}

@media screen and (max-width: 767px) {
  .global-hd--ttl a img {
    width: 16.4rem;
  }
}

.global-hd--ttl a span {
  margin: .4rem 0 0;
  display: block;
  font-weight: 700;
  font-size: 1.1rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .global-hd--ttl a span {
    margin: .3rem 0 0;
    font-size: 1rem;
    transform-origin: left;
    transform: scale(0.8);
  }
}

@media screen and (max-width: 767px) {
  .global-hd--ttl a span {
    margin: .3rem 0 0;
    font-size: 1rem;
    transform-origin: left;
    transform: scale(0.8);
  }
}

.mypage .global-hd--ttl a span {
  font-size: 1.6rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mypage .global-hd--ttl a span {
    margin: .3rem 0 0;
    font-size: 1rem;
    transform-origin: left;
    transform: scale(0.9);
  }
}

@media screen and (max-width: 767px) {
  .mypage .global-hd--ttl a span {
    margin: .3rem 0 0;
    font-size: 1rem;
    transform-origin: left;
    transform: scale(0.9);
  }
}

.global-hd--nav {
  display: flex;
}

.global-hd--nav li a {
  display: flex;
  align-items: center;
  font-weight: 700;
  font-size: 1.6rem;
}

.global-hd--nav li a:hover {
  text-decoration: underline;
}

.global-hd--nav li a i {
  margin-right: .7rem;
  line-height: 1;
}

.global-hd--nav li a i img {
  width: 100%;
}

#globalMain {
  width: 100%;
  flex-grow: 1;
}

#globalMain .container {
  margin: 0 auto;
  padding: 0 0 7rem;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  #globalMain .container {
    padding: 0 0 10rem;
  }
}

@media screen and (max-width: 767px) {
  #globalMain .container {
    padding: 0 0 10rem;
  }
}

#globalMain .container .content {
  max-width: 68rem;
  margin: 0 auto;
  padding: 5.5rem 0 0;
  position: relative;
  z-index: 10;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  #globalMain .container .content {
    padding: 3.5rem 2.8rem 0;
  }
}

@media screen and (max-width: 767px) {
  #globalMain .container .content {
    padding: 3.5rem 1.5rem 0;
  }
}

.mypage #globalMain .container .content {
  max-width: 96rem;
  padding: 3.5rem 0 0;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mypage #globalMain .container .content {
    padding: 2rem 1.5rem 0;
  }
}

@media screen and (max-width: 767px) {
  .mypage #globalMain .container .content {
    padding: 2rem 1.5rem 0;
  }
}

.breadcrumb {
  width: 100%;
  margin: 0 0 4rem;
  background: #f8f8f8;
  position: relative;
}

@media screen and (max-width: 767px) {
  .breadcrumb {
    width: 100vw;
    overflow-x: scroll;
  }
}

.breadcrumb ol {
  margin: 0 auto;
  padding: 1rem 4rem;
  display: flex;
}

@media screen and (min-width: 960px) {
  .breadcrumb ol {
    max-width: 132rem;
    width: 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .breadcrumb ol {
    max-width: 132rem;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .breadcrumb ol {
    margin: 0;
    padding: 1rem 1.6rem;
    flex-shrink: 0;
  }
}

.breadcrumb ol li {
  font-size: 1.2rem;
  line-height: 1;
  position: relative;
}

.breadcrumb ol li + li {
  padding: 0 0 0 2.5rem;
}

.breadcrumb ol li + li:before {
  display: block;
  content: ">";
  position: absolute;
  top: 50%;
  left: 1rem;
  color: #000;
  line-height: 1;
  transform: translateY(-50%);
}

.breadcrumb ol li a {
  color: #000;
  text-decoration: none;
}

.breadcrumb ol li a:hover {
  text-decoration: underline;
}

.global-ft {
  width: 100%;
  position: relative;
  z-index: 2;
}

.mypage .global-ft {
  padding: 24rem 0 0;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mypage .global-ft {
    padding: 10rem 0 0;
  }
}

@media screen and (max-width: 767px) {
  .mypage .global-ft {
    padding: 10rem 0 0;
  }
}

.mypage .global-ft:before {
  display: block;
  content: "";
  width: 100rem;
  height: 52rem;
  background: url(/common/images/mypage/bg_content_02.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mypage .global-ft:before {
    width: 100%;
    height: 25.2rem;
    background: url(/common/images/mypage/bg_content_02_sp.png) no-repeat 0 0;
    background-size: 100% auto;
  }
}

@media screen and (max-width: 767px) {
  .mypage .global-ft:before {
    width: 100%;
    height: 25.2rem;
    background: url(/common/images/mypage/bg_content_02_sp.png) no-repeat 0 0;
    background-size: 100% auto;
  }
}

.global-ft--content {
  padding: 2rem;
  background: #fff;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .global-ft--content {
    padding: 2rem 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .global-ft--content {
    padding: 2rem 1.5rem;
  }
}

.mypage .global-ft--content {
  background: rgba(255, 255, 255, 0.59);
}

.global-ft--content--copy {
  font-size: 1rem;
  color: #666;
  text-align: center;
  line-height: 1.2;
}

.heading-type--01 {
  margin: 0 0 3rem;
  font-weight: 700;
  font-size: 1.8rem;
  text-align: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--01 {
    margin: 0 0 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--01 {
    margin: 0 0 1.5rem;
  }
}

.heading-type--02 {
  margin: 0 0 4.5rem;
  font-weight: 700;
  font-size: 2.6rem;
  text-align: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--02 {
    margin: 0 0 4rem;
    font-size: 2rem;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--02 {
    margin: 0 0 4rem;
    font-size: 2rem;
  }
}

.heading-type--03 {
  margin: 0 0 1.5rem;
  font-weight: 700;
  font-size: 1.6rem;
  text-align: center;
}

.heading-type--04 {
  margin: 0 0 2.5rem;
  display: flex;
  align-items: center;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--04 {
    margin: 0 0 2rem;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--04 {
    margin: 0 0 2rem;
    flex-wrap: wrap;
  }
}

.heading-type--04.bg-white .ttl {
  padding: .8rem;
  background: rgba(255, 255, 255, 0.5);
}

.heading-type--04 .ttl {
  font-weight: 700;
  font-size: 2.2rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--04 .ttl {
    font-size: 2rem;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--04 .ttl {
    font-size: 2rem;
  }
}

.heading-type--04 .ttl small {
  font-size: 1.6rem;
}

.heading-type--04 .num {
  margin: 0 0 0 1rem;
  font-weight: 700;
  font-size: 3.2rem;
  color: #ed5634;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--04 .num {
    margin: 0 0 0 .6rem;
    font-size: 2.6rem;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--04 .num {
    margin: 0 0 0 .6rem;
    font-size: 2.6rem;
  }
}

.heading-type--04 .num small {
  font-weight: 400;
  font-size: 1.4rem;
  color: #0b1d29;
}

.heading-type--04 .more {
  margin-left: auto;
}

.heading-type--04 .more a {
  padding: 0 1.6rem 0 0;
  font-weight: 700;
  font-size: 1.5rem;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--04 .more a {
    font-size: 1.3rem;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--04 .more a {
    font-size: 1.3rem;
  }
}

.heading-type--04 .more a:hover {
  text-decoration: underline;
}

.heading-type--04 .more a i {
  width: .6rem;
  display: inline-block;
  line-height: 0;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.heading-type--04 .btn {
  width: 2.2rem;
  height: 2.2rem;
  margin: 0 0 0 1rem;
  display: inline-block;
  vertical-align: middle;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--04 .btn {
    width: 1.8rem;
    height: 1.8rem;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--04 .btn {
    width: 1.8rem;
    height: 1.8rem;
  }
}

.heading-type--04 .btn:hover {
  background: url(/common/images/icn_question_on.png) no-repeat 0 50%;
  background-size: 100% auto;
}

.heading-type--04 .btn:hover img {
  display: none;
}

.heading-type--04 .app-checkbox {
  margin-left: auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--04 .app-checkbox {
    margin: 1rem 0 0 0;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--04 .app-checkbox {
    margin: 1rem 0 0 0;
  }
}

.heading-type--04 .app-checkbox input[type="checkbox"] {
  display: none;
}

.heading-type--04 .app-checkbox input[type="checkbox"] + label .check {
  margin: 0 0 0 1rem;
}

.heading-type--05 {
  margin: 0 0 2rem;
  font-weight: 700;
  font-size: 2rem;
  text-align: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .heading-type--05 {
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 767px) {
  .heading-type--05 {
    font-size: 1.8rem;
  }
}

.heading-type--05 span {
  padding: 0 .1rem;
  position: relative;
}

.heading-type--05 span:after {
  display: block;
  content: "";
  width: 100%;
  height: .6rem;
  background: #c6e8f7;
  position: absolute;
  bottom: -.3rem;
  left: 0;
  z-index: -1;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .app-checkbox {
    width: 100%;
    margin: 1rem 0 0 0;
    display: flex;
    justify-content: flex-end;
  }
}

@media screen and (max-width: 767px) {
  .app-checkbox {
    width: 100%;
    margin: 1rem 0 0 0;
    display: flex;
    justify-content: flex-end;
  }
}

.app-checkbox label {
  display: flex;
  align-items: center;
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}

.app-checkbox label .on {
  display: none;
}

.app-checkbox input[type="checkbox"] {
  display: none;
}

.app-checkbox input[type="checkbox"] + label .check {
  width: 6rem;
  height: 2.3rem;
  padding: 0 .8rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  background: #ccc;
  border-radius: 1.2rem;
  font-weight: 700;
  font-size: 1.3rem;
  color: #666;
  cursor: pointer;
}

.app-checkbox input[type="checkbox"] + label .check:before {
  content: "";
  display: block;
  width: 1.5rem;
  height: 1.5rem;
  background: #fff;
  position: absolute;
  top: 50%;
  left: .4rem;
  border-radius: 100%;
  transform: translateY(-50%);
  transition: all 0.3s ease;
}

.app-checkbox input[type="checkbox"] + label .show {
  width: 6rem;
  height: 2.3rem;
  padding: 0 .5rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  background: #ccc;
  border-radius: 1.2rem;
  font-weight: 700;
  font-size: 1.1rem;
  color: #666;
  cursor: pointer;
}

.app-checkbox input[type="checkbox"] + label .show:before {
  content: "";
  display: block;
  width: 1.5rem;
  height: 1.5rem;
  background: #fff;
  position: absolute;
  top: 50%;
  left: .4rem;
  border-radius: 100%;
  transform: translateY(-50%);
  transition: all 0.3s ease;
}

.app-checkbox input[type="checkbox"]:checked + label .check {
  padding: 0 .8rem 0 1rem;
  background: #4e8ad9;
  justify-content: flex-start;
  color: #fff;
}

.app-checkbox input[type="checkbox"]:checked + label .check .off {
  display: none;
}

.app-checkbox input[type="checkbox"]:checked + label .check .on {
  display: block;
}

.app-checkbox input[type="checkbox"]:checked + label .check:before {
  box-shadow: none;
  left: 68%;
  transition: all .3s ease;
}

.app-checkbox input[type="checkbox"]:checked + label .show {
  padding: 0 .8rem 0 1.1rem;
  background: #4e8ad9;
  justify-content: flex-start;
  color: #fff;
}

.app-checkbox input[type="checkbox"]:checked + label .show .off {
  display: none;
}

.app-checkbox input[type="checkbox"]:checked + label .show .on {
  display: block;
}

.app-checkbox input[type="checkbox"]:checked + label .show:before {
  box-shadow: none;
  left: 68%;
  transition: all .3s ease;
}

@media screen and (min-width: 960px) {
  .btn-list {
    margin: 0 -1.5rem;
    display: flex;
    justify-content: center;
  }
}

.btn-list--one {
  width: 26rem;
  padding: 0 1.5rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-list--one {
    margin: 0 auto;
    padding: 0;
  }
  .btn-list--one + .btn-list--one {
    margin-top: 1rem;
  }
}

@media screen and (max-width: 767px) {
  .btn-list--one {
    margin: 0 auto;
    padding: 0;
  }
  .btn-list--one + .btn-list--one {
    margin-top: 1rem;
  }
}

.btn-type--01.medium {
  width: 50%;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--01.medium {
    max-width: 33.5rem;
    width: 92%;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--01.medium {
    max-width: 33.5rem;
    width: 92%;
  }
}

.btn-type--01.large {
  width: 84%;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--01.large {
    max-width: 33.5rem;
    width: 92%;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--01.large {
    max-width: 33.5rem;
    width: 92%;
  }
}

.btn-type--01 .btn {
  width: 100%;
  height: 6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #06c755;
  border-radius: 3rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  font-weight: 700;
  font-size: 1.6rem;
  color: #fff;
  line-height: 1;
  text-align: center;
  position: relative;
}

.btn-type--01 .btn:hover {
  background: #07af4c;
}

.btn-type--01 .btn i {
  width: 2.7rem;
  height: 2.6rem;
  margin-right: 1.5rem;
  display: inline-block;
  background: url("/common/images/icn_line_01.png") no-repeat 0 0;
  background-size: 100% auto;
  vertical-align: middle;
}

.btn-type--01 .btn:disabled, .btn-type--01 .btn.disabled {
  background: #666;
  cursor: default;
}

.btn-type--01 .btn:disabled i, .btn-type--01 .btn.disabled i {
  background: url("/common/images/icn_line_01_off.png") no-repeat 0 0;
  background-size: 100% auto;
}

.btn-type--02.small {
  width: 30rem;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--02.small {
    width: 21rem;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--02.small {
    width: 21rem;
  }
}

.btn-type--02.medium {
  width: 50%;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--02.medium {
    max-width: 33.5rem;
    width: 92%;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--02.medium {
    max-width: 33.5rem;
    width: 92%;
  }
}

.btn-type--02.large {
  width: 30rem;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--02.large {
    width: 28rem;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--02.large {
    width: 28rem;
  }
}

.btn-type--02 .btn {
  width: 100%;
  height: 6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4e8ad9;
  border-radius: 3rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  font-weight: 700;
  font-size: 1.6rem;
  color: #fff;
  line-height: 1;
  text-align: center;
  position: relative;
}

.btn-type--02 .btn:hover {
  background: #4377ba;
}

.btn-type--02 .btn:disabled, .btn-type--02 .btn.disabled {
  background: #666;
}

.btn-type--02 .btn i {
  width: 1.4rem;
  margin-right: 1rem;
  display: inline-block;
  vertical-align: middle;
}

.btn-type--02 .btn small {
  font-size: 1.4rem;
}

.btn-type--03.small {
  width: 30rem;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--03.small {
    width: 21rem;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--03.small {
    width: 21rem;
  }
}

.btn-type--03.medium {
  width: 50%;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--03.medium {
    max-width: 33.5rem;
    width: 92%;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--03.medium {
    max-width: 33.5rem;
    width: 92%;
  }
}

.btn-type--03.large {
  width: 30rem;
  margin: 0 auto;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-type--03.large {
    width: 27.5rem;
  }
}

@media screen and (max-width: 767px) {
  .btn-type--03.large {
    width: 27.5rem;
  }
}

.btn-type--03 .btn {
  width: 100%;
  height: 6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: .2rem solid #4e8ad9;
  border-radius: 3rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  font-weight: 700;
  font-size: 1.6rem;
  color: #0b1d29;
  line-height: 1;
  text-align: center;
  position: relative;
}

.btn-type--03 .btn:hover {
  color: #4377ba;
}

.btn-type--03 .btn i {
  width: 2.5rem;
  margin-right: 1rem;
  display: inline-block;
  vertical-align: middle;
}

.btn-type--04 {
  max-width: 33.5rem;
  margin: 0 auto;
}

.btn-type--04 .btn {
  width: 100%;
  height: 6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: .1rem solid #2967Be;
  border-radius: 1.2rem;
  font-weight: 700;
  font-size: 1.6rem;
  color: #0866c4;
  line-height: 1;
  text-align: center;
  position: relative;
}

.btn-type--04 .btn:before {
  display: block;
  content: "";
  width: .8rem;
  height: 1rem;
  background: url(/common/images/icn_arrow_b_l_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  left: 2rem;
  transform: translateY(-50%);
}

.btn-fix--01 {
  width: 100%;
  padding: 1.5rem;
  background: rgba(255, 255, 255, 0.8);
  position: fixed;
  bottom: 0;
  left: 0;
}

.btn-fix--01 .btn {
  max-width: 34rem;
  width: 100%;
  height: 6rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4e8ad9;
  border-radius: 3rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  font-weight: 700;
  font-size: 1.6rem;
  color: #fff;
  line-height: 1;
  text-align: center;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .btn-fix--01 .btn {
    max-width: 33.5rem;
    width: 92%;
  }
}

@media screen and (max-width: 767px) {
  .btn-fix--01 .btn {
    max-width: 33.5rem;
    width: 92%;
  }
}

.btn-fix--01 .btn:hover {
  background: #4377ba;
}

.btn-fix--01 .btn:disabled, .btn-fix--01 .btn.disabled {
  background: #666;
}

.btn-fix--01 .btn i {
  width: 1.4rem;
  margin-right: 1rem;
  display: inline-block;
  vertical-align: middle;
}

.btn-fix--01 .btn small {
  font-size: 1.4rem;
}

.btn-todo-regist {
  margin: -1rem 0 2rem;
  display: flex;
  justify-content: flex-end;
}

.btn-todo-regist .btn {
  padding: 1rem 3.5rem 1rem 2rem;
  display: block;
  background: #4e8ad9;
  border-radius: 3rem;
  font-weight: 700;
  font-size: 1.4rem;
  color: #fff;
  line-height: 1;
  position: relative;
}

.btn-todo-regist .btn:before, .btn-todo-regist .btn:after {
  display: block;
  content: "";
  width: 1.2rem;
  position: absolute;
  border-top: .2rem solid #fff;
  top: 50%;
  right: 1.5rem;
}

.btn-todo-regist .btn:before {
  transform: translateY(-50%) rotate(134deg);
}

.btn-todo-regist .btn:after {
  transform: translateY(-50%) rotate(-134deg);
}

/**20250120 add start **/
.btn-todo-indication {
  margin: -1rem 0 2rem;
  display: flex;
  justify-content: flex-end;
}

.btn-todo-indication .btn {
  padding: 1rem 3.5rem 1rem 2rem;
  display: block;
  background: #4e8ad9;
  border-radius: 3rem;
  font-weight: 700;
  font-size: 1.4rem;
  color: #fff;
  line-height: 1;
  position: relative;
}

.btn-todo-indication .btn:before, .btn-todo-indication .btn:after {
  display: block;
  content: "";
  width: 1.2rem;
  position: absolute;
  border-top: .2rem solid #fff;
  top: 50%;
  right: 1.5rem;
}

.btn-todo-indication .btn:before {
  transform: translateY(-50%) rotate(134deg);
}

.btn-todo-indication .btn:after {
  transform: translateY(-50%) rotate(-134deg);
}

.btn-reindicate {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 0 1rem;
}

.btn-reindicate .btn {
  width: 100%;
  height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: .2rem solid #4e8ad9;
  border-radius: 3rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  font-weight: 700;
  font-size: 1.6rem;
  color: #0b1d29;
  line-height: 1;
  text-align: center;
  position: relative;
}

.btn-reindicate .btn:hover {
  color: #4377ba;
}
/**20250120 add end **/

.link-type--01 {
  font-weight: 700;
  font-size: 1.6rem;
  color: #4377ba;
}

.link-type--01 i {
  width: .6rem;
  margin-left: 1rem;
  display: inline-block;
  vertical-align: middle;
  line-height: 0;
}

.link-type--01:hover {
  text-decoration: underline;
}

.link-type--02 {
  font-weight: 400;
  font-size: 1.6rem;
  color: #4377ba;
  text-decoration: underline;
}

.link-type--02:hover {
  text-decoration: none;
}

.link-type--03 {
  font-weight: 400;
  font-size: 1.3rem;
  color: #4377ba;
  text-decoration: underline;
}

.link-type--03:hover {
  text-decoration: none;
}

.regist-slide {
  margin: 0 0 3rem;
  padding: 0 0 3rem;
  position: relative;
}

.regist-slide--inner-box {
  height: 34rem;
  position: relative;
  transition-property: left;
  transition-duration: .3s;
}

.regist-slide--one {
  width: 100%;
  max-width: 68rem;
  height: 34rem;
  padding: 2.5rem 2rem 2rem;
  background: #fff;
  border-radius: .6rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
}

.regist-slide--one + .regist-slide--one {
  display: none;
}

.regist-slide--one--ttl {
  margin: 0 0 1.5rem;
  font-weight: 700;
  font-size: 2.2rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .regist-slide--one--ttl {
    font-size: 1.8rem;
  }
}

@media screen and (max-width: 767px) {
  .regist-slide--one--ttl {
    font-size: 1.8rem;
  }
}

.regist-slide--one--txt {
  margin: 0 0 1rem;
  font-size: 1.6rem;
  line-height: 1.75;
}

.regist-slide--one--img {
  width: 32rem;
  margin: 0 auto;
  position: absolute;
  bottom: 4rem;
  left: 50%;
  transform: translateX(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .regist-slide--one--img {
    width: 24rem;
  }
}

@media screen and (max-width: 767px) {
  .regist-slide--one--img {
    width: 24rem;
  }
}

.regist-slide--one .more {
  width: 100%;
  font-weight: 700;
  font-size: 1.4rem;
  color: #4377ba;
  position: absolute;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
}

@media screen and (min-width: 960px) {
  .regist-slide--one .more {
    display: none;
  }
}

.regist-slide--one .more i {
  width: 2.6rem;
  margin: 0 0 0 .5rem;
  display: inline-block;
  vertical-align: middle;
}

.regist-slide--nav {
  display: flex;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.regist-slide--nav li {
  margin: 0 .5rem;
}

.regist-slide--nav li a {
  width: 1rem;
  height: 1rem;
  display: block;
  background: #ccc;
  border-radius: 100%;
  font-size: 0;
}

.regist-slide--nav li.is-active a {
  background: #4e8ad9;
}

.regist-slide--prev {
  width: 6rem;
  margin: -1.5rem 0 0;
  display: none;
  position: absolute;
  top: 50%;
  left: -3rem;
  transform: translateY(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .regist-slide--prev {
    left: -1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .regist-slide--prev {
    left: -1.5rem;
  }
}

.regist-slide--prev a {
  display: block;
}

.regist-slide--next {
  width: 6rem;
  margin: -1.5rem 0 0;
  position: absolute;
  top: 50%;
  right: -3rem;
  transform: translateY(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .regist-slide--next {
    right: -1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .regist-slide--next {
    right: -1.5rem;
  }
}

.regist-slide--next a {
  display: block;
}

.form-type--01 fieldset + fieldset {
  margin: 3rem 0 0;
}

.form-type--01--ttl {
  margin: 0 0 1rem;
  font-weight: 700;
  font-size: 1.6rem;
}

.form-type--01--desc {
  position: relative;
}

.form-type--01--desc.small {
  max-width: 35rem;
  width: 80%;
  margin: 0 auto;
}

.form-type--01--desc.small input[type="text"] {
  font-size: 2.2rem;
  text-align: center;
}

.form-type--01--desc input[type="text"],
.form-type--01--desc input[type="email"],
.form-type--01--desc input[type="password"] {
  width: 100%;
  height: 6.4rem;
  padding: 2rem;
  background: #fff;
  border: .1rem solid #c0c4c4;
  border-radius: 1rem;
  font-size: 1.6rem;
  outline: none;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .form-type--01--desc input[type="text"],
  .form-type--01--desc input[type="email"],
  .form-type--01--desc input[type="password"] {
    height: 5.6rem;
    padding: 2rem;
  }
}

@media screen and (max-width: 767px) {
  .form-type--01--desc input[type="text"],
  .form-type--01--desc input[type="email"],
  .form-type--01--desc input[type="password"] {
    height: 5.6rem;
    padding: 2rem;
  }
}

.form-type--01--desc input[type="text"]::-webkit-contacts-auto-fill-button, .form-type--01--desc input[type="text"]::-webkit-credentials-auto-fill-button,
.form-type--01--desc input[type="email"]::-webkit-contacts-auto-fill-button,
.form-type--01--desc input[type="email"]::-webkit-credentials-auto-fill-button,
.form-type--01--desc input[type="password"]::-webkit-contacts-auto-fill-button,
.form-type--01--desc input[type="password"]::-webkit-credentials-auto-fill-button {
  visibility: hidden;
  pointer-events: none;
  position: absolute;
  right: 0;
}

.form-type--01--desc input[type="text"]::-moz-placeholder,
.form-type--01--desc input[type="email"]::-moz-placeholder,
.form-type--01--desc input[type="password"]::-moz-placeholder {
  color: #666;
}

.form-type--01--desc input[type="text"]::-moz-placeholder, .form-type--01--desc input[type="email"]::-moz-placeholder, .form-type--01--desc input[type="password"]::-moz-placeholder {
  color: #666;
}

.form-type--01--desc input[type="text"]::placeholder,
.form-type--01--desc input[type="email"]::placeholder,
.form-type--01--desc input[type="password"]::placeholder {
  color: #666;
}

.is-error .form-type--01--desc input[type="text"], .is-error
.form-type--01--desc input[type="email"], .is-error
.form-type--01--desc input[type="password"] {
  background: #ffefef;
  border: .2rem solid #cc0000;
}

.form-type--01--desc select {
  width: 100%;
  height: 6.4rem;
  padding: 2rem;
  background: #fff;
  border: .1rem solid #c0c4c4;
  border-radius: 1rem;
  font-size: 1.6rem;
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .form-type--01--desc select {
    height: 5.6rem;
    padding: 1.5rem;
    text-align: center;
  }
}

@media screen and (max-width: 767px) {
  .form-type--01--desc select {
    height: 5.6rem;
    padding: 1.5rem;
    text-align: center;
  }
}

.is-error .form-type--01--desc select {
  background: #ffefef;
  border: .2rem solid #cc0000;
}

.form-type--01--desc .icn-secret {
  width: 2.2rem;
  height: 1.5rem;
  background: url(../images/img_secret_01_n.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 2.55rem;
  right: 3rem;
  cursor: pointer;
  input::-ms-reveal { display: none; };
}

::-ms-reveal {
    display: none;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .form-type--01--desc .icn-secret {
    top: 2rem;
    right: 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .form-type--01--desc .icn-secret {
    top: 2rem;
    right: 1.5rem;
  }
}

.form-type--01--desc .icn-secret.is-active {
  background: url(../images/img_secret_01_on.png) no-repeat 0 0;
  background-size: 100% auto;
}

.form-type--01--desc .place-sm::-moz-placeholder {
  font-size: 1.4rem;
}

.form-type--01--desc .place-sm::placeholder {
  font-size: 1.4rem;
}

.form-type--01--desc .select-row--01 {
  margin: 0 -.5rem;
  display: flex;
}

.form-type--01--desc .select-row--01--one {
  width: 23.5%;
  padding: 0 .25rem;
  display: flex;
  flex-shrink: 1;
  align-items: flex-end;
}

.form-type--01--desc .select-row--01--one:nth-of-type(1) {
  width: 30%;
}

.form-type--01--desc .select-row--01--one:nth-of-type(4) {
  width: 23%;
}

.form-type--01--desc .select-row--01--one--txt {
  margin: 0 0 0 .5rem;
  font-size: 1.5rem;
}

@media screen and (max-width: 767px) {
  .form-type--01--desc .select-row--01--one select {
    padding: 0.5rem;
  }
}

.form-type--01--desc .suggest-list {
  display: none;
  margin: .1rem 0 0;
  max-height: 25rem;
  background: #fff;
  border-radius: .6rem;
  box-shadow: 0 0.2rem 0.6rem 0.1rem rgba(0, 0, 0, 0.16);
  overflow-y: scroll;
}

.form-type--01--desc .suggest-list li {
  padding: 1rem 1.5rem;
  font-size: 1.6rem;
  cursor: pointer;
}

.form-type--01--desc .suggest-list li:hover {
  background: #dbf0ff;
}

.form-type--01--error-txt-01 {
  display: none;
  margin-top: 1.5rem;
  font-size: 1.6rem;
  color: #cc0000;
}

.is-error .form-type--01--error-txt-01 {
  display: block;
}

.form-type--01--label-01 {
  display: flex;
  align-items: center;
  font-size: 1.6rem;
  position: relative;
  cursor: pointer;
}

.form-type--01--label-01 > * {
  flex-shrink: 0;
}

.form-type--01--label-01 input {
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 1rem;
  background: #fff;
  border: .1rem solid #707070;
  cursor: pointer;
}

.is-error .form-type--01--label-01 input {
  background: #ffefef;
  border: .2rem solid #cc0000;
}

.form-type--01--label-02 {
  width: 100%;
  height: 6.4rem;
  padding: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: .1rem solid #c0c4c4;
  border-radius: .6rem;
  font-size: 1.6rem;
  outline: none;
  position: relative;
  cursor: pointer;
}

.form-type--01--label-02 span {
  padding: 0 2.5rem;
  white-space: nowrap;
  position: relative;
}

.form-type--01--label-02 i {
  width: 1.6rem;
  display: none;
  line-height: 1;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .form-type--01--label-02 {
    height: 5.6rem;
    padding: 1rem;
  }
}

@media screen and (max-width: 767px) {
  .form-type--01--label-02 {
    height: 5.6rem;
    padding: 1rem;
  }
}

.form-type--01--label-02 input {
  display: none;
}

.is-error .form-type--01--label-02 {
  background: #ffefef;
  border: .2rem solid #cc0000;
}

.form-type--01--label-02.is-active {
  background: #dbf0ff;
  border: .2rem solid #4e8ad9;
}

.form-type--01--label-02.is-active i {
  display: block;
}

.form-type--01--label-03 {
  width: 100%;
  height: 6.4rem;
  padding: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: .1rem solid #c0c4c4;
  border-radius: .6rem;
  font-size: 1.6rem;
  outline: none;
  position: relative;
  cursor: pointer;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .form-type--01--label-03 {
    height: 5.6rem;
    padding: 1rem;
  }
}

@media screen and (max-width: 767px) {
  .form-type--01--label-03 {
    height: 5.6rem;
    padding: 1rem;
  }
}

.form-type--01--label-03 input {
  width: 1.6rem;
  height: 1.6rem;
  margin-right: .5rem;
  background: #fff;
  border: .2rem solid #c0c4c4;
  flex-shrink: 0;
  border-radius: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.is-error .form-type--01--label-03 {
  background: #ffefef;
  border: .2rem solid #cc0000;
}

.form-type--01--label-03.is-active {
  background: #dbf0ff;
  border: .2rem solid #4e8ad9;
}

.form-type--01--label-03.is-active input {
  background: #4e8ad9;
  border: 0.3rem solid #fff;
}

.form-type--01 .label-select {
  display: block;
  position: relative;
}

.form-type--01 .label-select:after {
  display: block;
  content: "";
  width: 1.2rem;
  height: .6rem;
  background: url(/common/images/icn_arrow_g_b_01.png) no-repeat 0 0;
  background-size: 100% auto;
  pointer-events: none;
  position: absolute;
  top: 50%;
  right: 2rem;
  transform: translateY(-50%);
}

.error-area {
  margin: 0 0 4rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .error-area {
    margin: 0 0 3rem;
  }
}

@media screen and (max-width: 767px) {
  .error-area {
    margin: 0 0 3rem;
  }
}

.error-area p {
  font-size: 1.6rem;
  color: #cc0000;
}

.error-area p + p {
  margin-top: 2rem;
}

.terms-box {
  height: 15rem;
  padding: 2rem;
  background: #fff;
  overflow-y: scroll;
}

.step-nav--01 {
  margin: 0 0 7rem;
  padding: 0;
  display: flex;
  justify-content: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--01 {
    margin: 0 0 5rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--01 {
    margin: 0 0 5rem;
  }
}

.step-nav--01 li {
  padding: 2.5rem 0 0;
  position: relative;
}

.step-nav--01 li i {
  width: 1.8rem;
  height: 1.8rem;
  display: block;
  background: #ccc;
  border-radius: 100%;
  position: absolute;
  top: -.8rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}

.step-nav--01 li i img {
  display: none;
}

.step-nav--01 li + li {
  margin-left: 15rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--01 li + li {
    margin-left: 5rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--01 li + li {
    margin-left: 5rem;
  }
}

.step-nav--01 li + li:after {
  display: block;
  content: "";
  width: 24rem;
  height: .3rem;
  background: #ccc;
  position: absolute;
  top: 0;
  right: 4rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--01 li + li:after {
    width: 12rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--01 li + li:after {
    width: 12rem;
  }
}

.step-nav--01 li + li.is-current:after, .step-nav--01 li + li.is-complete:after {
  background: #4e8ad9;
}

.step-nav--01 li.is-current i {
  width: 3rem;
  height: 3rem;
  display: block;
  background: #fff;
  border: .3rem solid #4e8ad9;
  top: -1.5rem;
  box-sizing: border-box;
}

.step-nav--01 li.is-complete i {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4e8ad9;
  border: .3rem solid #4e8ad9;
  top: -1.5rem;
  box-sizing: border-box;
}

.step-nav--01 li.is-complete i img {
  width: 1rem;
  display: block;
}

.step-nav--01 li strong.step-nav--01--txt {
  color: #4377ba;
}

.step-nav--01 li .step-nav--01--txt {
  display: inline-block;
  font-weight: 700;
  font-size: 1.8rem;
  color: #666;
  text-align: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--01 li .step-nav--01--txt {
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--01 li .step-nav--01--txt {
    font-size: 1.5rem;
  }
}

.step-nav--01 li .step-nav--01--txt small {
  font-weight: 700;
  font-size: 1.4rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--01 li .step-nav--01--txt small {
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--01 li .step-nav--01--txt small {
    font-size: 1.2rem;
  }
}

.step-nav--02 {
  margin: 0 0 3.5rem;
  padding: 0;
  display: flex;
  justify-content: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--02 {
    margin: 0 0 5rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--02 {
    margin: 0 0 5rem;
  }
}

.step-nav--02 li {
  padding: 2.5rem 0 0;
  position: relative;
}

.step-nav--02 li i {
  width: 1.8rem;
  height: 1.8rem;
  display: block;
  background: #ccc;
  border-radius: 100%;
  position: absolute;
  top: -.8rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}

.step-nav--02 li i img {
  display: none;
}

.step-nav--02 li + li {
  margin-left: 12rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--02 li + li {
    margin-left: 9rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--02 li + li {
    margin-left: 9rem;
  }
}

.step-nav--02 li + li:after {
  display: block;
  content: "";
  width: 12rem;
  height: .3rem;
  background: #ccc;
  position: absolute;
  top: 0;
  right: 0rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--02 li + li:after {
    width: 9rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--02 li + li:after {
    width: 9rem;
  }
}

.step-nav--02 li + li.is-current:after, .step-nav--02 li + li.is-complete:after {
  background: #4e8ad9;
}

.step-nav--02 li.is-current i {
  width: 3rem;
  height: 3rem;
  display: block;
  background: #fff;
  border: .3rem solid #4e8ad9;
  top: -1.5rem;
  box-sizing: border-box;
}

.step-nav--02 li.is-complete i {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4e8ad9;
  border: .3rem solid #4e8ad9;
  top: -1.5rem;
  box-sizing: border-box;
}

.step-nav--02 li.is-complete i img {
  width: 1rem;
  display: block;
}

.step-nav--03 {
  margin: 0 0 7rem;
  padding: 0;
  display: flex;
  justify-content: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--03 {
    margin: 0 0 5rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--03 {
    margin: 0 0 5rem;
  }
}

.step-nav--03 li {
  padding: 2.5rem 0 0;
  position: relative;
}

.step-nav--03 li i {
  width: 1.8rem;
  height: 1.8rem;
  display: block;
  background: #ccc;
  border-radius: 100%;
  position: absolute;
  top: -.8rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
}

.step-nav--03 li i img {
  display: none;
}

.step-nav--03 li + li {
  margin-left: 15rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--03 li + li {
    margin-left: 5rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--03 li + li {
    margin-left: 5rem;
  }
}

.step-nav--03 li + li:after {
  display: block;
  content: "";
  width: 27rem;
  height: .3rem;
  background: #ccc;
  position: absolute;
  top: 0;
  right: 4rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--03 li + li:after {
    width: 14rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--03 li + li:after {
    width: 14rem;
  }
}

.step-nav--03 li + li.is-current:after, .step-nav--03 li + li.is-complete:after {
  background: #4e8ad9;
}

.step-nav--03 li.is-current i {
  width: 3rem;
  height: 3rem;
  display: block;
  background: #fff;
  border: .3rem solid #4e8ad9;
  top: -1.5rem;
  box-sizing: border-box;
}

.step-nav--03 li.is-complete i {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4e8ad9;
  border: .3rem solid #4e8ad9;
  top: -1.5rem;
  box-sizing: border-box;
}

.step-nav--03 li.is-complete i img {
  width: 1rem;
  display: block;
}

.step-nav--03 li strong.step-nav--01--txt {
  color: #4377ba;
}

.step-nav--03 li .step-nav--03--txt {
  display: inline-block;
  font-weight: 700;
  font-size: 1.8rem;
  color: #666;
  text-align: center;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--03 li .step-nav--03--txt {
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--03 li .step-nav--03--txt {
    font-size: 1.5rem;
  }
}

.step-nav--03 li .step-nav--03--txt small {
  font-weight: 700;
  font-size: 1.4rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .step-nav--03 li .step-nav--03--txt small {
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 767px) {
  .step-nav--03 li .step-nav--03--txt small {
    font-size: 1.2rem;
  }
}

.box-type--01 {
  padding: 3rem;
  background: #fff;
  border: .2rem solid #b8d5e2;
}

.box-type--02 {
  padding: 2rem;
  background: #fff;
  border-radius: 1.2rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .box-type--02 {
    padding: 1.8rem 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .box-type--02 {
    padding: 1.8rem 1.5rem;
  }
}

.box-type--02 + .box-type--02 {
  margin-top: 2rem;
}

@media screen and (min-width: 960px) {
  .dialog-box {
    position: relative;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .dialog-box {
    position: relative;
  }
}

.dialog-box--btn {
  position: relative;
}

.dialog-box--btn.is-pop:after {
  display: block;
  content: "";
  border: solid transparent;
  border-bottom-color: #fffbcb;
  border-width: 1rem .7rem;
  filter: drop-shadow(0 0.3rem 0.6rem rgba(0, 0, 0, 0.16));
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.is-comp .dialog-box--btn.is-pop:after {
  display: none;
}

.dialog-box--pop {
  width: 30.5rem;
  margin: 0 0 1rem;
  padding: 1.5rem 4rem 1.5rem 2rem;
  display: none;
  background: #fffbcb;
  border-radius: .8rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  position: absolute;
  left: 50%;
  z-index: 10;
}

@media screen and (min-width: 960px) {
  .dialog-box--pop {
    top: 100%;
    transform: translateX(-50%);
  }
  .is-comp .dialog-box--pop {
    width: 100%;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .dialog-box--pop {
    top: 100%;
    transform: translateX(-50%);
  }
  .is-comp .dialog-box--pop {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .dialog-box--pop {
    max-width: 33rem;
    width: calc(100vw - 3rem);
    left: 0;
  }
  .is-comp .dialog-box--pop {
    max-width: 100%;
    width: calc(100vw - 3rem);
    left: 1.5rem;
  }
}

.dialog-box--pop.is-pop {
  display: block;
}

.dialog-box--pop--btn {
  width: 2.5rem;
  position: absolute;
  top: 1.25rem;
  right: 1rem;
}

.dialog-box--pop--txt {
  font-size: 1.5rem;
  text-align: left;
}

.chara--01--bullun {
  width: 34.4rem;
  margin: 5rem auto 2.4rem;
  padding: 1.8rem;
  background: #fff;
  border: .2rem solid #b8d5e2;
  border-radius: 1rem;
  text-align: center;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .chara--01--bullun {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .chara--01--bullun {
    width: 100%;
  }
}

.chara--01--bullun:before, .chara--01--bullun:after {
  display: block;
  content: "";
  border: solid transparent;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}

.chara--01--bullun:before {
  border-top-color: #b8d5e2;
  border-width: 1.7rem 1.5rem;
}

.chara--01--bullun:after {
  border-top-color: #fff;
  border-width: 1.5rem 1.3rem;
  z-index: 1;
}

.chara--01--bullun--ttl {
  margin: 0 0 1rem;
  font-weight: 700;
  font-size: 1.8rem;
}

.chara--01--bullun--txt {
  font-size: 1.6rem;
}

.chara--01--img {
  width: 12.7rem;
  margin: 0 auto;
}

.chara--02 {
  margin: 0 0 5rem;
  display: flex;
  align-items: center;
}

.chara--02--img {
  width: 7.4rem;
}

.chara--02--bullun {
  min-height: 7rem;
  flex: 1;
  margin: 0 0 0 1rem;
  padding: 1.2rem 1.5rem;
  display: flex;
  align-items: center;
  background: #fff;
  border: .2rem solid #b8d5e2;
  border-radius: 1rem;
  position: relative;
}

.chara--02--bullun:before, .chara--02--bullun:after {
  display: block;
  content: "";
  border: solid transparent;
  position: absolute;
  bottom: 2rem;
  right: 100%;
}

.chara--02--bullun:before {
  border-right-color: #b8d5e2;
  border-width: 1rem 1.2rem;
}

.chara--02--bullun:after {
  margin: 0 -0.3rem 0 0;
  border-right-color: #fff;
  border-width: 1rem 1.2rem;
  z-index: 1;
}

.chara--02--bullun--ttl {
  margin: 0 0 1rem;
  font-weight: 700;
  font-size: 1.8rem;
}

.chara--02--bullun--txt {
  font-size: 1.6rem;
}

.cation-box--01 {
  padding: 2rem 2rem 2rem 5rem;
  background: #faf3d4;
  border-radius: 1.2rem;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .cation-box--01 {
    padding: 1.2rem 2rem 1.2rem 4rem;
  }
}

@media screen and (max-width: 767px) {
  .cation-box--01 {
    padding: 1.2rem 2rem 1.2rem 4rem;
  }
}

.cation-box--01:before {
  display: block;
  content: "";
  width: 1.8rem;
  height: 1.8rem;
  background: url(/common/images/icn_cation_02.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 2rem;
  left: 2rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .cation-box--01:before {
    top: 1.5rem;
    left: 1.2rem;
  }
}

@media screen and (max-width: 767px) {
  .cation-box--01:before {
    top: 1.5rem;
    left: 1.2rem;
  }
}

.cation-box--01--txt {
  font-size: 1.3rem;
}

.cation-box--01--link {
  padding-right: 1.2rem;
  display: block;
  position: relative;
}

.cation-box--01--link:hover {
  text-decoration: underline;
}

.cation-box--01--link:after {
  display: block;
  content: "";
  width: 1rem;
  height: 1.7rem;
  background: url(/common/images/icn_arrow_b_r_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: none;
}

.cation-box--02 {
  padding: 2rem;
  background: rgba(255, 255, 255, 0.9);
  border: .2rem solid #4e8ad9;
  border-radius: 1.2rem;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .cation-box--02 {
    padding: 2rem;
  }
}

@media screen and (max-width: 767px) {
  .cation-box--02 {
    padding: 2rem;
  }
}

.cation-box--02--ttl {
  margin: 0 0 1rem;
  font-weight: 700;
  font-size: 1.6rem;
}

.cation-box--02--txt {
  font-size: 1.3rem;
}

.cation-box--02--txt + .cation-box--02--txt {
  margin-top: 1rem;
}

.todo-list--01 {
  padding: 2.5rem 2rem;
  background: rgba(255, 255, 255, 0.9);
}

@media screen and (min-width: 960px) {
  .todo-list--01 {
    border-radius: 1.2rem;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01 {
    margin: 0 -1.5rem;
    padding: 3rem 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01 {
    margin: 0 -1.5rem;
    padding: 3rem 1.5rem;
  }
}

.todo-list--01--one {
  padding: 2rem 1.5rem 1.5rem;
  background: #e8f8ff;
  border-radius: 1.2rem;
  position: relative;
}

.todo-list--01--one + .todo-list--01--one {
  margin-top: 2rem;
}

.todo-list--01--one .ttl {
  margin: 0 0 2rem;
  padding-right: 22rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .ttl {
    margin: 0 0 1rem;
    padding-right: 4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .ttl {
    margin: 0 0 1rem;
    padding-right: 4rem;
  }
}

.todo-list--01--one .ttl a {
  min-height: 4rem;
  display: inline-block;
  font-weight: 700;
  font-size: 1.8rem;
  position: relative;
}

@media screen and (min-width: 960px) {
  .todo-list--01--one .ttl a:hover {
    text-decoration: underline;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .ttl a {
    min-height: 3.4rem;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .ttl a {
    min-height: 3.4rem;
    font-size: 1.6rem;
  }
}

.todo-list--01--one .ttl a:after {
  content: "";
  width: 1rem;
  height: 1.6rem;
  margin: 0 0 0 1.2rem;
  display: inline-block;
  background: url(/common/images/icn_arrow_b_r_01.png) no-repeat 0 0;
  background-size: 100% auto;
  vertical-align: middle;
}

.todo-list--01--one .icn {
  width: 20.6rem;
  position: absolute;
  top: 2rem;
  right: 2rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .icn {
    width: 3.4rem;
    height: 3.4rem;
    top: 1.5rem;
    right: 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .icn {
    width: 3.4rem;
    height: 3.4rem;
    top: 1.5rem;
    right: 1.5rem;
  }
}

.todo-list--01--one .icn a {
  height: 4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 0 0 2.6rem;
  background: #fff;
  border-radius: 3rem;
  font-weight: 700;
  font-size: 1.5rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .icn a {
    width: 3.4rem;
    height: 3.4rem;
    padding: 0;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .icn a {
    width: 3.4rem;
    height: 3.4rem;
    padding: 0;
  }
}

.todo-list--01--one .icn a:after {
  content: "";
  width: 1.8rem;
  height: 2rem;
  display: block;
  background: url(/common/images/img_todo_01_off.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  left: 2rem;
  transform: translateY(-50%);
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .icn a:after {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .icn a:after {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

.todo-list--01--one .icn a.is-active:after {
  background: url(/common/images/img_todo_01_on.png) no-repeat 0 0;
  background-size: 100% auto;
}

@media screen and (min-width: 960px) {
  :not(.is-touch) .todo-list--01--one .icn a:hover:after {
    background: url(/common/images/img_todo_01_on_hv.png) no-repeat 0 0;
    background-size: 100% auto;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .icn a span {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .icn a span {
    display: none;
  }
}

.todo-list--01--one .label {
  margin: 0 0 1rem;
  padding: .3rem .7rem;
  display: inline-block;
  background: #fff;
  border-radius: 1.3rem;
  font-size: 1.4rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .label {
    padding: .2rem .7rem;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .label {
    padding: .2rem .7rem;
    font-size: 1.2rem;
  }
}

.todo-list--01--one .date {
  margin: 0 0 1.5rem;
  font-size: 1.6rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .date {
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .date {
    font-size: 1.4rem;
  }
}

.todo-list--01--one .txt {
  font-size: 1.6rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .txt {
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .txt {
    font-size: 1.4rem;
  }
}

.todo-list--01--one .btn-list--one {
  width: 50%;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .btn-list--one {
    width: 100%;
  }
  .todo-list--01--one .btn-list--one + .btn-list--one {
    margin-top: 1rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .btn-list--one {
    width: 100%;
  }
  .todo-list--01--one .btn-list--one + .btn-list--one {
    margin-top: 1rem;
  }
}

.todo-list--01--one .btn-list--one .btn i {
  margin-right: 1rem;
  display: inline-block;
  vertical-align: middle;
}

.todo-list--01--one .btn-list--one .btn i.online {
  width: 8.7rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .btn-list--one .btn i.online {
    width: 8.4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .btn-list--one .btn i.online {
    width: 8.4rem;
  }
}

.todo-list--01--one .btn-list--one .btn i.process {
  width: 6.9rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--01--one .btn-list--one .btn i.process {
    width: 6.6rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--01--one .btn-list--one .btn i.process {
    width: 6.6rem;
  }
}

.todo-list--02 {
  padding: 2.5rem 2rem;
  background: rgba(255, 255, 255, 0.9);
}

@media screen and (min-width: 960px) {
  .todo-list--02 {
    border-radius: 1.2rem;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02 {
    margin: 0 -1.5rem;
    padding: 3rem 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02 {
    margin: 0 -1.5rem;
    padding: 3rem 1.5rem;
  }
}

.todo-list--02--one {
  padding: 2rem 1.5rem 1.5rem;
  background: #e8f8ff;
  border-radius: 1.2rem;
  position: relative;
}

.todo-list--02--one + .todo-list--02--one {
  margin-top: 2rem;
}

.todo-list--02--one .ttl {
  margin: 0 0 2rem;
  padding-right: 22rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .ttl {
    margin: 0 0 1rem;
    padding-right: 4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .ttl {
    margin: 0 0 1rem;
    padding-right: 4rem;
  }
}

.todo-list--02--one .ttl a {
  display: inline-block;
  font-weight: 700;
  font-size: 1.8rem;
  position: relative;
}

@media screen and (min-width: 960px) {
  .todo-list--02--one .ttl a:hover {
    text-decoration: underline;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .ttl a {
    min-height: 3.4rem;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .ttl a {
    min-height: 3.4rem;
    font-size: 1.6rem;
  }
}

.todo-list--02--one .ttl a:after {
  content: "";
  width: 1rem;
  height: 1.6rem;
  margin: 0 0 0 1.2rem;
  display: inline-block;
  background: url(/common/images/icn_arrow_b_r_01.png) no-repeat 0 0;
  background-size: 100% auto;
  vertical-align: middle;
}

.todo-list--02--one .regist a.is-active:after {
  background: url(/common/images/img_todo_01_on.png) no-repeat 0 0;
  background-size: 100% auto;
}

@media screen and (min-width: 960px) {
  :not(.is-touch) .todo-list--02--one .regist a:hover:after {
    background: url(/common/images/img_todo_01_on_hv.png) no-repeat 0 0;
    background-size: 100% auto;
  }
}

/** 20250121 add start **/
.todo-list--02--one .plus {
  width: 20.6rem;
  padding-bottom: 1rem;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .plus {
    width: 3.4rem;
    height: 3.4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .plus {
    width: 3.4rem;
    height: 3.4rem;
  }
}

.todo-list--02--one .plus a {
  height: 4rem;
  padding: 0 0 0 2.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 3rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  font-size: 1.5rem;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .plus a {
    height: 3.4rem;
    border-radius: 100%;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .plus a {
    height: 3.4rem;
    border-radius: 100%;
  }
}

.todo-list--02--one .plus i.plus {
  width: 1.8rem;
  height: 2rem;
  display: block;
  background: url(/common/images/img_todo_01_off.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  left: 2rem;
  transform: translateY(-50%);
}

/** アイコン：画面サイズが大きめの時 **/
@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .plus i.plus {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

/** アイコン：画面サイズが小さめの時 **/
@media screen and (max-width: 767px) {
  .todo-list--02--one .plus i.plus {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

.todo-list--02--one .plus a.is-active i.plus {
  background: url(/common/images/img_todo_01_on.png) no-repeat 0 0;
  background-size: 100% auto;
}

@media screen and (min-width: 960px) {
  :not(.is-touch) .todo-list--02--one .plus a:hover i.plus {
    background: url(/common/images/img_todo_01_on_hv.png) no-repeat 0 0;
    background-size: 100% auto;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .plus a span {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .plus a span {
    display: none;
  }
}

/** 20250121 add end **/

/** 20250120 add start 健康情報・手続きの各情報右上に表示するごみ箱アイコン設置場所 **/
.todo-list--02--one .indication {
  width: 3.4rem;
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
}

/** 設置場所：画面サイズが大きめの時 **/
@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .indication {
    width: 3.4rem;
    height: 3.4rem;
  }
}

/** 設置場所：画面サイズが小さめの時 **/
@media screen and (max-width: 767px) {
  .todo-list--02--one .indication {
    width: 3.4rem;
    height: 3.4rem;
  }
}

/** アイコン背景の白丸 **/
.todo-list--02--one .indication a {
  height: 3.4rem;
  padding: 0 0 0 2.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 100%;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
  font-size: 1.5rem;
  position: relative;
}

/** 白丸：画面サイズが大きめの時 **/
@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .indication a {
    height: 3.4rem;
    padding: 0;
    border-radius: 100%;
  }
}

/** 白丸：画面サイズが小さめの時 **/
@media screen and (max-width: 767px) {
  .todo-list--02--one .indication a {
    height: 3.4rem;
    padding: 0;
    border-radius: 100%;
  }
}

/** アイコン配置 **/
.todo-list--02--one .indication i.garbage {
  width: 2.2rem;
  height: 2.4rem;
  display: block;
  background: url(/common/images/icn_garbage_01_empty.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/** アイコン：画面サイズが大きめの時 **/
@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .indication i.garbage {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

/** アイコン：画面サイズが小さめの時 **/
@media screen and (max-width: 767px) {
  .todo-list--02--one .indication i.garbage {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

/** active時ごみ箱アイコン切替 **/
.todo-list--02--one .indication a.is-active i.garbage {
  width: 1.8rem;
  height: 2rem;
  display: block;
  background: url(/common/images/icn_garbage_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/** アイコン：画面サイズが大きめの時 **/
@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .indication a.is-active i.garbage {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

/** アイコン：画面サイズが小さめの時 **/
@media screen and (max-width: 767px) {
  .todo-list--02--one .indication a.is-active i.garbage {
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
/** 20250121 add **/

.todo-list--02--one .label {
  margin: 0 0 1rem;
  padding: .3rem .7rem;
  display: inline-block;
  background: #fff;
  border-radius: 1.3rem;
  font-size: 1.4rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .label {
    padding: .2rem .7rem;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .label {
    padding: .2rem .7rem;
    font-size: 1.2rem;
  }
}

.todo-list--02--one .date {
  margin: 0 0 1.5rem;
  font-size: 1.6rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .date {
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .date {
    font-size: 1.4rem;
  }
}

.todo-list--02--one .txt {
  font-size: 1.6rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .txt {
    font-size: 1.4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .txt {
    font-size: 1.4rem;
  }
}

.todo-list--02--one .btn-list--one {
  width: 50%;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .btn-list--one {
    width: 100%;
  }
  .todo-list--02--one .btn-list--one + .btn-list--one {
    margin-top: 1rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .btn-list--one {
    width: 100%;
  }
  .todo-list--02--one .btn-list--one + .btn-list--one {
    margin-top: 1rem;
  }
}

.todo-list--02--one .btn-list--one .btn i {
  margin-right: 1rem;
  display: inline-block;
  vertical-align: middle;
}

.todo-list--02--one .btn-list--one .btn i.online {
  width: 8.7rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .btn-list--one .btn i.online {
    width: 8.4rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .btn-list--one .btn i.online {
    width: 8.4rem;
  }
}

.todo-list--02--one .btn-list--one .btn i.process {
  width: 6.9rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .todo-list--02--one .btn-list--one .btn i.process {
    width: 6.6rem;
  }
}

@media screen and (max-width: 767px) {
  .todo-list--02--one .btn-list--one .btn i.process {
    width: 6.6rem;
  }
}

.todo-list--02--one .btn-list--one .btn i.confirm {
  width: 1.8rem;
}

/** 20250121 add start **/
.todo-list--02--one .btn-list--one .btn i.regist {
  width: 1.8rem;
}
/** 20250121 add end **/

.guid-list {
  margin: 0 0 6rem;
}

.guid-list--one {
  background: #fff;
  border-radius: 1.2rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
}

.guid-list--one + .guid-list--one {
  margin-top: 3rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .guid-list--one + .guid-list--one {
    margin-top: 2rem;
  }
}

@media screen and (max-width: 767px) {
  .guid-list--one + .guid-list--one {
    margin-top: 2rem;
  }
}

.guid-list--one--ttl a {
  padding: 2rem 3rem 2.5rem;
  display: block;
  font-weight: 700;
  font-size: 1.8rem;
  line-height: 1;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .guid-list--one--ttl a {
    padding: 2rem;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 767px) {
  .guid-list--one--ttl a {
    padding: 2rem;
    font-size: 1.6rem;
  }
}

.guid-list--one--ttl a:after {
  display: block;
  content: "";
  width: 1.6rem;
  height: 1rem;
  background: url(/common/images/icn_arrow_b_b_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  right: 3rem;
  transform: translateY(-50%);
}

.guid-list--one--ttl a.is-active:after {
  transform: translateY(-50%) rotate(180deg);
}

.guid-list--one--inner {
  height: 0;
  display: flex;
  padding: 0 3rem;
  transition-duration: .15s;
  overflow: hidden;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .guid-list--one--inner {
    display: block;
    padding: 0 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .guid-list--one--inner {
    display: block;
    padding: 0 1.5rem;
  }
}

.guid-list--one--inner.is-active {
  height: 100%;
  opacity: 1;
}

@media screen and (min-width: 960px) {
  .guid-list--one--inner.is-active {
    padding: 0 3rem 2.5rem;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .guid-list--one--inner.is-active {
    padding: 0 1.5rem 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  .guid-list--one--inner.is-active {
    padding: 0 1.5rem 2.5rem;
  }
}

.guid-list--one--txt {
  flex: 1;
  font-size: 1.6rem;
  line-height: 1.75;
}

.guid-list--one--img {
  width: 30.7rem;
  margin: 0 0 0 2rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .guid-list--one--img {
    width: 100%;
    margin: 2rem 0 0;
  }
}

@media screen and (max-width: 767px) {
  .guid-list--one--img {
    width: 100%;
    margin: 2rem 0 0;
  }
}

.setting-list--ttl a {
  padding: .3rem 0;
  display: block;
  font-weight: 700;
  font-size: 1.8rem;
  line-height: 1;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .setting-list--ttl a {
    padding: .3rem 2rem .3rem 0;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 767px) {
  .setting-list--ttl a {
    padding: .3rem 2rem .3rem 0;
    font-size: 1.6rem;
  }
}

.setting-list--ttl a:after {
  display: block;
  content: "";
  width: 1.6rem;
  height: 1rem;
  background: url(/common/images/icn_arrow_b_b_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.setting-list--ttl a.is-active:after {
  transform: translateY(-50%) rotate(180deg);
}

.setting-list--inner {
  height: 0;
  padding: 0;
  transition-duration: .15s;
  overflow: hidden;
}

.setting-list--inner.is-active {
  height: 100%;
  opacity: 1;
}

@media screen and (min-width: 960px) {
  .setting-list--inner.is-active {
    padding: 1.5rem 0 2.5rem;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .setting-list--inner.is-active {
    padding: 1.5rem 0 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  .setting-list--inner.is-active {
    padding: 1.5rem 0 2.5rem;
  }
}

.link-list {
  margin: 0 0 6rem;
}

.link-list--one {
  background: #fff;
  border-radius: 1.2rem;
  box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);
}

.link-list--one + .link-list--one {
  margin-top: 3rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .link-list--one + .link-list--one {
    margin-top: 2rem;
  }
}

@media screen and (max-width: 767px) {
  .link-list--one + .link-list--one {
    margin-top: 2rem;
  }
}

.link-list--one a {
  padding: 2.3rem 3rem;
  display: block;
  font-weight: 700;
  font-size: 1.8rem;
  line-height: 1;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .link-list--one a {
    padding: 2rem;
    font-size: 1.6rem;
  }
}

@media screen and (max-width: 767px) {
  .link-list--one a {
    padding: 2rem;
    font-size: 1.6rem;
  }
}

.link-list--one a:after {
  display: block;
  content: "";
  width: 1rem;
  height: 1.7rem;
  background: url(/common/images/icn_arrow_b_r_01.png) no-repeat 0 0;
  background-size: 100% auto;
  position: absolute;
  top: 50%;
  right: 3rem;
  transform: translateY(-50%);
}

.link-list--one a.is-active:after {
  transform: translateY(-50%) rotate(180deg);
}

.order-list {
  display: flex;
}

.order-list li a {
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4e8ad9;
  border-radius: 100%;
}

.order-list li a.is-disable {
  background: #ccc;
}

.order-list li a img {
  width: 1.4rem;
}

.order-list li + li {
  margin: 0 0 0 1.9rem;
  padding: 0 0 0 1.9rem;
  border-left: .1rem solid #d6d9da;
}

.order-list li + li a img {
  transform: rotate(180deg);
}

.uni-modal {
  width: 100%;
  height: 100%;
  padding: 4.5rem 0 6rem;
  display: none;
  background: rgba(0, 0, 0, 0.5);
  overflow-y: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1001;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .uni-modal {
    padding: 2rem 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .uni-modal {
    padding: 2rem 1.5rem;
  }
}

.uni-modal.is-active {
  display: block;
}

.uni-modal--close {
  max-width: 50rem;
  margin: 0 auto 1rem;
  text-align: right;
}

.uni-modal--close a {
  width: 2.5rem;
  display: inline-block;
}

.uni-modal--ttl {
  margin: -4rem -2.5rem 4rem;
  padding: 1.2rem;
  background: #4e8ad9;
  border-top-right-radius: 1.2rem;
  border-top-left-radius: 1.2rem;
  font-weight: 700;
  font-size: 1.8rem;
  color: #fff;
  text-align: center;
  position: relative;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .uni-modal--ttl {
    margin: -2.5rem -1.5rem 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  .uni-modal--ttl {
    margin: -2.5rem -1.5rem 2.5rem;
  }
}

.uni-modal--content {
  max-width: 50rem;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}

.uni-modal--content--inner {
  padding: 4rem 2.5rem 2.5rem;
  background: #fff;
  border-radius: 1.2rem;
  position: relative;
  overflow: hidden;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .uni-modal--content--inner {
    padding: 2.5rem 1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .uni-modal--content--inner {
    padding: 2.5rem 1.5rem;
  }
}

.uni-modal--content--inner .print-btn {
  width: 13.2rem;
  position: absolute;
  top: 8rem;
  right: 2.5rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .uni-modal--content--inner .print-btn {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .uni-modal--content--inner .print-btn {
    display: none;
  }
}

.uni-modal--content--inner .print-btn .btn {
  height: 4.2rem;
  font-size: 1.5rem;
}

.uni-modal--content--inner .print-btn .btn i {
  width: 2rem;
}

.uni-modal--content--inner--ttl {
  margin: 0 0 3rem;
  font-size: 2rem;
}

.uni-modal--content .txt {
  margin: 0 0 2rem;
  font-size: 1.6rem;
  text-align: center;
}

.uni-modal--content .defin dt {
  margin: 0 0 1rem;
  font-weight: 700;
  font-size: 1.6rem;
}

.uni-modal--content .defin dd {
  font-size: 1.6rem;
}

.uni-modal .close-btn {
  max-width: 14rem;
  margin: 0 auto;
}

.uni-modal .close-btn .btn {
  height: 4.2rem;
  font-size: 1.5rem;
}

.birth-add {
  margin: 0 0 4rem;
  padding: 0 0 2rem;
  display: none;
  border-bottom: .1rem solid #d5e2e8;
}

.birth-add--ttl {
  width: 100%;
  margin: 0 0 2rem;
  font-weight: 700;
  font-size: 1.4rem;
}

.birth-add--ttl:after {
  display: block;
  content: "";
  clear: both;
}

.birth-add--ttl a {
  padding: 0 0 0 1.6rem;
  float: right;
  display: block;
  font-weight: 700;
  font-size: 1.3rem;
  color: #666;
  position: relative;
}

.birth-add--ttl a:before, .birth-add--ttl a:after {
  display: block;
  content: "";
  width: 1.2rem;
  height: .2rem;
  background: #4e8ad9;
  position: absolute;
  top: 50%;
  left: 0;
}

.birth-add--ttl a:before {
  transform: translateY(-50%) rotate(45deg);
}

.birth-add--ttl a:after {
  transform: translateY(-50%) rotate(135deg);
}

.birth-add--one {
  margin: 1.5rem 0 0;
  padding: 1.5rem 0 0;
  border-top: .1rem solid #d5e2e8;
}

#modal-howto .uni-modal--ttl {
  margin: -2rem -9.5rem 2rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  #modal-howto .uni-modal--ttl {
    margin: -2.5rem -1.5rem 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  #modal-howto .uni-modal--ttl {
    margin: -2.5rem -1.5rem 2.5rem;
  }
}

#modal-howto .uni-modal--content--inner {
  padding: 2rem 9.5rem 2.5rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  #modal-howto .uni-modal--content--inner {
    padding: 2.5rem 1.5rem 2.5rem;
  }
}

@media screen and (max-width: 767px) {
  #modal-howto .uni-modal--content--inner {
    padding: 2.5rem 1.5rem 2.5rem;
  }
}

#modal-howto .bullun {
  width: 100%;
  margin: 0 0 1rem;
  padding: 1.4rem;
  background: #e8f8ff;
  border: .2rem solid #b8d5e2;
  border-radius: 1rem;
  font-weight: 700;
  font-size: 1.5rem;
  text-align: center;
  position: relative;
}

#modal-howto .bullun:before, #modal-howto .bullun:after {
  display: block;
  content: "";
  border: solid transparent;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}

#modal-howto .bullun:before {
  border-top-color: #e8f8ff;
  border-width: 1.6rem .8rem;
  z-index: 1;
}

#modal-howto .bullun:after {
  border-top-color: #b8d5e2;
  border-width: 1.8rem 1rem;
}

#modal-howto .img {
  margin: 0 0 2rem;
  border: .2rem solid #f2f2f2;
}

#modal-howto .btn-type--02 {
  max-width: 21rem;
  margin: 0 auto 2.5rem;
}

.unite-type--01 {
  margin: 0 0 3rem;
  padding: 0 0 3rem;
  border-bottom: .1rem solid #d9d9d9;
}

.js-switch {
  position: relative;
}

.js-switch--content {
  display: none;
  transition-duration: 1s;
}

.js-switch--content.is-active {
  display: block;
}

.js-accdion-content {
  display: none;
}

.js-accdion-content.is-active {
  display: block;
}

.row {
  margin: 0 -1rem -1.5rem;
  display: flex;
  flex-wrap: wrap;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row {
    margin: 0 -.75rem -1.5rem;
  }
}

@media screen and (max-width: 767px) {
  .row {
    margin: 0 -.75rem -1.5rem;
  }
}

.row .col-auto {
  width: auto;
  margin: 0 0 1.5rem;
  padding: 0 1rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row .col-auto {
    padding: 0 .75rem;
  }
}

@media screen and (max-width: 767px) {
  .row .col-auto {
    padding: 0 .75rem;
  }
}

.row .col-20 {
  width: 20%;
  margin: 0 0 1.5rem;
  padding: 0 1rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row .col-20 {
    padding: 0 .75rem;
  }
}

@media screen and (max-width: 767px) {
  .row .col-20 {
    padding: 0 .75rem;
  }
}

.row .col-30 {
  width: 30%;
  margin: 0 0 1.5rem;
  padding: 0 1rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row .col-30 {
    padding: 0 .75rem;
  }
}

@media screen and (max-width: 767px) {
  .row .col-30 {
    padding: 0 .75rem;
  }
}

.row .col-50 {
  width: 50%;
  margin: 0 0 1.5rem;
  padding: 0 1rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row .col-50 {
    padding: 0 .75rem;
  }
}

@media screen and (max-width: 767px) {
  .row .col-50 {
    padding: 0 .75rem;
  }
}

.row .col-70 {
  width: 70%;
  margin: 0 0 1.5rem;
  padding: 0 1rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row .col-70 {
    padding: 0 .75rem;
  }
}

@media screen and (max-width: 767px) {
  .row .col-70 {
    padding: 0 .75rem;
  }
}

.row .col-80 {
  width: 80%;
  margin: 0 0 1.5rem;
  padding: 0 1rem;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row .col-80 {
    padding: 0 .75rem;
  }
}

@media screen and (max-width: 767px) {
  .row .col-80 {
    padding: 0 .75rem;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .row .col-100-sp {
    width: calc(100% - 1.5rem);
    margin: 0 auto 1.5rem;
    padding: 0;
  }
}

@media screen and (max-width: 767px) {
  .row .col-100-sp {
    width: calc(100% - 1.5rem);
    margin: 0 auto 1.5rem;
    padding: 0;
  }
}

.txt-type--01 {
  font-size: 1.6rem;
  word-break: break-all;
}

.txt-type--02 {
  font-size: 2.2rem;
  word-break: break-all;
}

.txt-type--03 {
  font-weight: 700;
  font-size: 1.2rem;
  word-break: break-all;
}

.link-more a {
  padding: 0 1.6rem 0 0;
  font-weight: 700;
  font-size: 1.3rem;
  color: #666;
  position: relative;
}

.link-more a i {
  width: .6rem;
  display: inline-block;
  line-height: 0;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.img-fix {
  width: 100%;
  height: auto;
}

.w-50 {
  width: 50%;
}

.text-left {
  text-align: left !important;
}

.text-center {
  text-align: center !important;
}

.text-right {
  text-align: right !important;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .text-left-sp {
    text-align: left !important;
  }
}

@media screen and (max-width: 767px) {
  .text-left-sp {
    text-align: left !important;
  }
}

.align-base {
  align-items: flex-start !important;
}

.align-base .dialog-box {
  margin-top: .5em;
}

.align-center {
  align-items: center !important;
}

.content-center {
  justify-content: center !important;
}

.mt-1 {
  margin-top: 1rem !important;
}

.mt-2 {
  margin-top: 2rem !important;
}

.mt-2_5 {
  margin-top: 2.5rem !important;
}

.mt-3 {
  margin-top: 3rem !important;
}

.mt-4 {
  margin-top: 4rem !important;
}

.mt-6 {
  margin-top: 6rem !important;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .mt-2-sp {
    margin-top: 2rem !important;
  }
}

@media screen and (max-width: 767px) {
  .mt-2-sp {
    margin-top: 2rem !important;
  }
}

.mb-0 {
  margin-bottom: 0rem !important;
}

.mb-1 {
  margin-bottom: 1rem !important;
}

.mb-3 {
  margin-bottom: 3rem !important;
}

.mb-4 {
  margin-bottom: 4rem !important;
}

.mb-4_5 {
  margin-bottom: 4.5rem !important;
}

.mb-6 {
  margin-bottom: 6rem !important;
}

.mb-9 {
  margin-bottom: 9rem !important;
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .p-0-sp {
    padding: 0 !important;
  }
}

@media screen and (max-width: 767px) {
  .p-0-sp {
    padding: 0 !important;
  }
}

.ml-auto {
  margin-left: auto !important;
}

@media screen and (min-width: 960px) {
  .is-pc-hide {
    display: none;
  }
}

@media screen and (min-width: 768px) and (max-width: 959px) {
  .is-pc-hide {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .is-sp-hide {
    display: none;
  }
}

.hdTypeA01 {
  width: 100%;
  margin: 0 0 2.4rem;
  font-weight: 700;
  font-size: 2.1rem;
}

.hdTypeB01 {
  margin: 0 0 2.4rem;
  font-weight: 700;
  font-size: 2.8rem;
  color: #5fc4fe;
  text-align: center;
}

.hdTypeB02 {
  margin: 0 0 2.4rem;
  font-weight: 700;
  font-size: 2.1rem;
  color: #5fc4fe;
}