@import url("reset.css");

body {
  min-width: 1040px;
}

/* Header
--------------------------------------------------------*/

header,
#head-Main {
  width: 100%;
  min-width: 1040px;
  -webkit-transition: .3s;
  transition: .3s;
  background: #eff8ff;
}

header .logo img,
#head-Main .logo img {
  width: 120px;
  margin-right: 10px;
}

header .logo a,
#head-Main .logo a {
  font-size: 1.5rem;
  font-weight: normal;
  text-decoration: none;
  color: #1b76be;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

header {
  position: static;
  top: -30px;
  -webkit-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}

#top header {
  display: none;
}

#top header.is-Fixed {
  display: block;
}

.top-Header {
  padding-bottom: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
}

.top-Header .blue-Btn {
  margin-bottom: auto;
  margin-left: auto;
}

.wrapper {
  width: 940px;
  margin: 0 auto;
  padding-top: 20px;
}

header .wrapper,
#head-Main .wrapper {
  width: 1040px;
}

.form-Area {
  width: 500px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.form-Area h2 {
  font-size: 2.7rem;
  margin-bottom: 20px;
  color: #1b76be;
}

.is-Fixed {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
}

.is-Hide {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}

header .wrapper {
  padding-top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
}

header .wrapper .logo a {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
}

header .wrapper form {
  margin-top: 20px;
  margin-right: 20px;
  margin-left: 20px;
}

header .wrapper form input[type='text'] {
  height: 50px;
  padding: 10px 70px 10px 10px;
  background: #fff;
}

header .global-Navi {
  width: 40%;
  margin-top: 10px;
  margin-right: 20px;
  margin-bottom: auto;
}

header .global-Navi li a {
  font-size: 1rem;
  padding-top: 10px;
  padding-bottom: 10px;
}

header .global-Navi li a img {
  width: 40px;
  margin-bottom: 5px;
}

.blue-Btn.top-Btn {
  width: 170px;
  margin-top: auto;
  margin-bottom: auto;
  padding-right: 20px;
  padding-left: 50px;
}

/* Form
--------------------------------------------------------*/

.search-Form {
  position: relative;
}

.search-Form input[type='text'] {
  width: 100%;
  height: 56px;
  padding: 10px 70px 10px 20px;
  border: 2px solid #1b76be;
  border-radius: 25px;
  background: #fff;
}

.search-Form input[type='text']:focus {
  border: 4px solid #009cd9;
  outline: 0;
  background: #eff8ff;
}

.search-Form button[type='submit'] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  width: 70px;
  margin: auto;
  cursor: pointer;
  text-indent: -9999px;
  color: #3879d9;
  border-radius: 0 25px 25px 0;
  outline: none;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%20fill%3D%22%231274c1%22%2F%3E%3C%2Fsvg%3E") no-repeat center center;
  background-size: 35%;
}

.search-Form button[type='submit']:hover {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%20fill%3D%22%23ffffff%22%2F%3E%3C%2Fsvg%3E") #1b76be no-repeat center center;
  background-size: 35%;
}

.search-Form + p {
  margin-top: 10px;
}

/* Top navigation
--------------------------------------------------------*/

.global-Navi {
  margin: 20px auto auto;
}

.global-Navi ul {
  margin-right: auto;
  margin-left: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
}

.global-Navi ul li {
  width: 25%;
}

.global-Navi ul li a {
  display: block;
  text-align: center;
  text-decoration: none;
  border: 2px solid #eff8ff;
}

.global-Navi ul li a img {
  margin: 0 auto 5px;
}

.global-Navi ul li a:hover {
  position: relative;
  border: 2px solid #1b76be;
  background: #fff;
}

.global-Navi ul li a:hover::before {
  position: absolute;
  z-index: 2;
  bottom: -24px;
  left: 53%;
  margin-left: -15px;
  content: '';
  border: 12px solid transparent;
  border-top: 12px solid #fff;
}

.global-Navi ul li a:hover::after {
  position: absolute;
  z-index: 1;
  bottom: -29px;
  left: 53%;
  margin-left: -17px;
  content: '';
  border: 14px solid transparent;
  border-top: 14px solid #1b76be;
}

.index-Page#guide .guide-Navi a,
.index-Page#operation .operation-Navi a,
.index-Page#faq .faq-Navi a,
.index-Page#sample .sample-Navi a,
.article-Page#guide .guide-Navi a,
.article-Page#operation .operation-Navi a,
.article-Page#faq .faq-Navi a,
.article-Page#sample .sample-Navi a {
  position: relative;
  border: 2px solid #1b76be;
  background: #fff;
}

.index-Page#guide .guide-Navi a::before,
.index-Page#operation .operation-Navi a::before,
.index-Page#faq .faq-Navi a::before,
.index-Page#sample .sample-Navi a::before,
.article-Page#guide .guide-Navi a::before,
.article-Page#operation .operation-Navi a::before,
.article-Page#faq .faq-Navi a::before,
.article-Page#sample .sample-Navi a::before {
  position: absolute;
  z-index: 2;
  bottom: -24px;
  left: 53%;
  margin-left: -15px;
  content: '';
  border: 12px solid transparent;
  border-top: 12px solid #fff;
}

.index-Page#guide .guide-Navi a::after,
.index-Page#operation .operation-Navi a::after,
.index-Page#faq .faq-Navi a::after,
.index-Page#sample .sample-Navi a::after,
.article-Page#guide .guide-Navi a::after,
.article-Page#operation .operation-Navi a::after,
.article-Page#faq .faq-Navi a::after,
.article-Page#sample .sample-Navi a::after {
  position: absolute;
  z-index: 1;
  bottom: -29px;
  left: 53%;
  margin-left: -17px;
  content: '';
  border: 14px solid transparent;
  border-top: 14px solid #1b76be;
}

#head-Main .global-Navi {
  width: 600px;
}

#head-Main .global-Navi a {
  font-size: 1.6rem;
  padding-top: 20px;
  padding-bottom: 20px;
}

#head-Main .global-Navi img {
  width: 52px;
  margin: 0 auto 10px;
}

/* Button
--------------------------------------------------------*/

.blue-Btn {
  position: relative;
  z-index: 9;
  display: inline-block;
  overflow: hidden;
  padding-top: 10px;
  padding-right: 4rem;
  padding-bottom: 10px;
  padding-left: 6rem;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  text-decoration: none;
  text-indent: -6rem;
  color: #fff;
  border: 2px solid #1b76be;
  border-radius: 50px;
  background: #1b76be;
}

.blue-Btn::before,
.blue-Btn::after {
  position: absolute;
  z-index: 10;
  top: 50%;
  width: 20px;
  height: 20px;
  content: '';
  border-radius: 50%;
  background-color: #fff;
}

.blue-Btn::before {
  left: -20px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.blue-Btn::after {
  right: -20px;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
}

.blue-Btn:hover {
  color: #1b76be;
  border: 2px solid #1b76be;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.blue-Btn:hover span {
  position: relative;
  z-index: 11;
}

.blue-Btn:hover::before {
  -webkit-animation: criss-cross-left .8s both;
  animation: criss-cross-left .8s both;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

.blue-Btn:hover::after {
  -webkit-animation: criss-cross-right .8s both;
  animation: criss-cross-right .8s both;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

.blue-Btn .contact-Icon {
  position: relative;
  padding-left: 60px;
}

.blue-Btn .contact-Icon::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 23px;
  width: 23px;
  height: 23px;
  margin-top: auto;
  margin-bottom: auto;
  content: '';
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M20%204H4c-1.1%200-2%20.9-2%202v12c0%201.1.9%202%202%202h16c1.1%200%202-.9%202-2V6c0-1.1-.9-2-2-2zm0%2014H4V8l8%205%208-5v10zm-8-7L4%206h16l-8%205z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E") no-repeat;
  background-size: 100% auto;
}

.blue-Btn:hover .contact-Icon::before {
  top: -6px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%203h24v24H0V3z%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M20%207H4c-1.1%200-2%20.9-2%202v12c0%201.1.9%202%202%202h16c1.1%200%202-.9%202-2V9c0-1.1-.9-2-2-2zm0%2014H4V11l8%205%208-5v10z%22%20fill%3D%22%231b76be%22%2F%3E%3Cpath%20d%3D%22M21.1%208.4H2.9L12%201.8l9.1%206.6z%22%20fill%3D%22none%22%20stroke%3D%22%231b76be%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-miterlimit%3D%2210%22%2F%3E%3C%2Fsvg%3E") no-repeat;
}

@-webkit-keyframes criss-cross-left {
  0% {
    left: -20px;
  }

  50% {
    left: 50%;
    width: 20px;
    height: 20px;
  }

  100% {
    left: 50%;
    width: 100vw;
    height: 100vh;
  }
}

@keyframes criss-cross-left {
  0% {
    left: -20px;
  }

  50% {
    left: 50%;
    width: 20px;
    height: 20px;
  }

  100% {
    left: 50%;
    width: 100vw;
    height: 100vh;
  }
}

@-webkit-keyframes criss-cross-right {
  0% {
    right: -20px;
  }

  50% {
    right: 50%;
    width: 20px;
    height: 20px;
  }

  100% {
    right: 50%;
    width: 100vw;
    height: 100vh;
  }
}

@keyframes criss-cross-right {
  0% {
    right: -20px;
  }

  50% {
    right: 50%;
    width: 20px;
    height: 20px;
  }

  100% {
    right: 50%;
    width: 100vw;
    height: 100vh;
  }
}

.white-Btn {
  position: relative;
  z-index: 9;
  display: inline-block;
  overflow: hidden;
  padding-top: 15px;
  padding-right: 30px;
  padding-bottom: 15px;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  text-decoration: none;
  color: #1b76be;
  border: 2px solid #1b76be;
  border-radius: 50px;
  background: #fff;
}

.white-Btn::before,
.white-Btn::after {
  position: absolute;
  z-index: 10;
  top: 50%;
  width: 20px;
  height: 20px;
  content: '';
  border-radius: 50%;
  background-color: #1b76be;
}

.white-Btn::before {
  left: -20px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.white-Btn::after {
  right: -20px;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
}

.white-Btn:hover {
  color: #fff;
}

.white-Btn:hover span {
  position: relative;
  z-index: 11;
}

.white-Btn:hover::before {
  -webkit-animation: criss-cross-left .8s both;
  animation: criss-cross-left .8s both;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

.white-Btn:hover::after {
  -webkit-animation: criss-cross-right .8s both;
  animation: criss-cross-right .8s both;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

.white-Btn .arrow-Icon {
  position: relative;
  padding-right: 20px;
  padding-left: 30px;
}

.white-Btn .arrow-Icon::before {
  position: absolute;
  top: 0;
  right: -10px;
  bottom: 0;
  width: 25px;
  height: 25px;
  margin: auto;
  content: '';
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h24v24H0V0z%22%2F%3E%3Cpath%20fill%3D%22%231b76be%22%20d%3D%22M22%2012l-4-4v3H3v2h15v3l4-4z%22%2F%3E%3C%2Fsvg%3E") no-repeat;
  background-size: 100% auto;
}

.white-Btn:hover .arrow-Icon::before {
  z-index: 11;
  -webkit-animation: arrowMove 1S ease 0s infinite;
  animation: arrowMove 1S ease 0s infinite;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h24v24H0V0z%22%2F%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M22%2012l-4-4v3H3v2h15v3l4-4z%22%2F%3E%3C%2Fsvg%3E") no-repeat;
}

@-webkit-keyframes arrowMove {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes arrowMove {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* Box
--------------------------------------------------------*/

.bg-Graybox {
  margin-top: 40px;
  padding: 30px;
  border: 1px solid #f3f3f3;
  border-radius: 25px;
  background: #f3f3f3;
}

.bg-Graybox h3 {
  font-size: 2.5rem;
  font-weight: bold;
  position: relative;
  padding-bottom: 20px;
  text-align: center;
  color: #1b76be;
}

.bg-Graybox h3::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 60px;
  height: 5px;
  margin: auto;
  content: '';
  background: #1b76be;
}

.bg-Graybox .link-Btnx1,
.bg-Graybox .link-Btnx2 {
  background: #fff;
}

.bg-Graybox .link-Btnx1 a,
.bg-Graybox .link-Btnx2 a {
  display: block;
  padding: 20px 40px 20px 20px;
  text-decoration: none;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M256%208c137%200%20248%20111%20248%20248S393%20504%20256%20504%208%20393%208%20256%20119%208%20256%208zm-28.9%20143.6l75.5%2072.4H120c-13.3%200-24%2010.7-24%2024v16c0%2013.3%2010.7%2024%2024%2024h182.6l-75.5%2072.4c-9.7%209.3-9.9%2024.8-.4%2034.3l11%2010.9c9.4%209.4%2024.6%209.4%2033.9%200L404.3%20273c9.4-9.4%209.4-24.6%200-33.9L271.6%20106.3c-9.4-9.4-24.6-9.4-33.9%200l-11%2010.9c-9.5%209.6-9.3%2025.1.4%2034.4z%22%20fill%3D%22%231274c0%22%2F%3E%3C%2Fsvg%3E") no-repeat 98% center;
  background-size: 20px;
}

.bg-Graybox .link-Btnx1 a:hover,
.bg-Graybox .link-Btnx2 a:hover {
  color: #1b76be;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M256%208c137%200%20248%20111%20248%20248S393%20504%20256%20504%208%20393%208%20256%20119%208%20256%208zm-28.9%20143.6l75.5%2072.4H120c-13.3%200-24%2010.7-24%2024v16c0%2013.3%2010.7%2024%2024%2024h182.6l-75.5%2072.4c-9.7%209.3-9.9%2024.8-.4%2034.3l11%2010.9c9.4%209.4%2024.6%209.4%2033.9%200L404.3%20273c9.4-9.4%209.4-24.6%200-33.9L271.6%20106.3c-9.4-9.4-24.6-9.4-33.9%200l-11%2010.9c-9.5%209.6-9.3%2025.1.4%2034.4z%22%20fill%3D%22%231274c0%22%2F%3E%3C%2Fsvg%3E") no-repeat 98% center #eff8ff;
  background-size: 20px;
}

.bg-Graybox .link-Btnx1 li,
.bg-Graybox .link-Btnx2 li {
  border-bottom: 1px solid #e0dede;
}

.bg-Graybox .link-Btnx1 li:last-child,
.bg-Graybox .link-Btnx2 li:last-child {
  border-bottom: none;
}

.bg-Graybox .link-Btnx2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.bg-Graybox .link-Btnx2 li {
  width: 50%;
}

.bg-Graybox .link-Btnx2 li:nth-child(odd) {
  border-right: 1px solid #e0dede;
}

.bg-Graybox .white-Btn {
  margin: 30px auto 0;
}

.index-Page .bg-Graybox:nth-child(n + 3) {
  margin-top: 40px;
}

.flx-Center {
  margin: 20px 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.flx-Left {
  margin: 20px 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
}

.flx-Right {
  margin: 20px 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

/* Main
--------------------------------------------------------*/

main {
  padding-bottom: 250px;
}

.bread-Crumb {
  width: 100%;
  margin: 0 auto;
}

.bread-Crumb ul li {
  position: relative;
  display: inline;
  margin-right: 16px;
}

.bread-Crumb ul li:first-child::before {
  width: 0;
  height: 0;
  border: none;
}

.bread-Crumb ul li::before {
  position: absolute;
  top: 5px;
  left: -15px;
  width: 6px;
  height: 6px;
  content: '';
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  border-top: 1px solid #1b76be;
  border-right: 1px solid #1b76be;
}

.title-Area {
  color: #fff;
}

.title-Area h1 {
  font-size: 25px;
  line-height: 1.4;
  width: 75%;
}

.title-Area h1.icon-Title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.title-Area h1.icon-Title img {
  width: 50px;
  margin-right: 10px;
}

.index-Page .title-Area h1 {
  width: 100%;
}

.index-Page .title-Area {
  background: #1b76be;
}

.article-Page .title-Area {
  background: #009cd9;
}

.title-Area .wrapper {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  padding: 25px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.title-Area .wrapper p {
  margin-left: auto;
}

.article-Area h2 {
  font-size: 2.4rem;
  margin-top: 40px;
  color: #009cd9;
}

.article-Area h3:not(.title-txt) {
  font-size: 2rem;
  margin-top: 40px;
  padding-left: 13px;
  border-left: 5px solid #009cd9;
}

.article-Area h4 {
  font-size: 1.9rem;
  margin-top: 30px;
  padding-bottom: 5px;
  border-bottom: 1px solid #009cd9;
}

.article-Area h5 {
  font-size: 1.8rem;
  position: relative;
  margin-top: 30px;
  padding-left: 20px;
}

.article-Area h5::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 12px;
  height: 5px;
  margin: auto;
  content: '';
  background: #009cd9;
}

.article-Area h6 {
  font-size: 1.7rem;
  margin-top: 30px;
}

.article-Area p {
  margin-top: 20px;
}

.article-Area ol.num-List01 {
  display: table;
  margin-top: 20px;
  padding: 0;
  list-style: none;
  counter-reset: my-counter;
}

.article-Area ol.num-List01 li {
  margin-bottom: 5px;
  margin-left: 10px;
}

.article-Area ol.num-List01 li::before {
  line-height: 22px;
  display: block;
  float: left;
  width: 22px;
  height: 22px;
  margin-left: -30px;
  content: counter(my-counter);
  counter-increment: my-counter;
  text-align: center;
  color: #fff;
  border-radius: 50%;
  background: #009cd9;
}

.article-Area ol.num-List01 img {
  margin-top: 20px;
  margin-left: -25px;
}

.article-Area ol.num-List02 {
  display: table;
  margin-top: 20px;
  margin-left: 5px;
  padding: 0;
  counter-reset: my-counter;
}

.article-Area ol.num-List02 li {
  display: table-row;
  padding: 0;
  list-style-type: decimal;
  counter-increment: my-counter;
}

.article-Area ol.num-List02 li::before {
  font-size: 1.7rem;
  font-weight: bold;
  display: table-cell;
  padding-right: .4em;
  content: counter(my-counter) ".";
  color: #009cd9;
}

.article-Area ol.num-List02 li:last-of-type:after {
  margin-bottom: 0;
}

.article-Area ol.num-List03 {
  display: table;
  margin-top: 20px;
  margin-left: 5px;
  counter-reset: table-ol;
}

.article-Area ol.num-List03 li {
  display: table-row;
  margin: 0;
  padding: 0;
  list-style-type: decimal;
  counter-increment: table-ol;
}

.article-Area ol.num-List03 li::before {
  font-size: 1.7rem;
  display: marker;
  display: table-cell;
  padding-right: .4em;
  content: "(" counter(table-ol) ") ";
  text-align: right;
  color: #009cd9;
}

.article-Area ol.num-List03 li::after {
  display: block;
  margin-bottom: 5px;
  content: '';
}

.article-Area ol.num-List03 li:last-of-type:after {
  margin-bottom: 0;
}

.article-Area .no-Style {
  margin-left: 0;
  counter-reset: my-counter;
}

.article-Area .no-Style li::before {
  padding-right: 0;
  content: none !important;
}

.article-Area li ol,
.article-Area li ul {
  margin-top: 10px !important;
  margin-bottom: 20px;
}

.article-Area .dot-List {
  margin-top: 20px;
}

.article-Area .dot-List li {
  position: relative;
  display: block;
  margin-bottom: 5px;
  margin-left: 5px;
  padding-left: 13px;
}

.article-Area .dot-List li::before {
  position: absolute;
  top: 8px;
  left: 0;
  width: 6px;
  height: 6px;
  content: '';
  border-radius: 100%;
  background: #838383;
}

.article-Area .dot-List li img {
  margin-top: 20px;
  margin-left: -13px;
}

.article-Area > p:first-child,
.article-Area > ul:first-child,
.article-Area > ol:first-child {
  margin-top: 40px;
}

.link-Title {
  font-size: 2rem;
  padding-left: 13px;
  border-left: 5px solid #009cd9;
}

.link-Title a {
  text-decoration: none;
}

.link-Title a:hover {
  text-decoration: underline;
  color: #009cd9;
}

.link-Title + .link-Btnx1 {
  margin-top: 20px;
}

.notice-Box {
  margin-top: 40px;
  padding: 20px;
  border: 2px solid #f00;
}

.notice-Box .title-txt {
  font-size: 1.5rem;
  position: relative;
  padding-left: 30px;
  color: #f00;
}

.notice-Box .title-txt::before {
  position: absolute;
  left: 0;
  width: 24px;
  height: 24px;
  content: '';
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20576%20512%22%3E%3Cpath%20d%3D%22M53.7%20454.5l229.6-398c2.3-4%208.1-4%2010.4%200l229.6%20398c2.3%204-.6%209-5.2%209H58.9c-4.6%200-7.5-5-5.2-9%22%20fill%3D%22%23ffe000%22%2F%3E%3Cpath%20d%3D%22M248.7%20189.7l6.6%20127c.4%206.3%205.6%2011.3%2012%2011.3h41.4c6.4%200%2011.6-5%2012-11.3l6.6-127c.4-6.9-5.1-12.7-12-12.7h-54.5c-7%200-12.5%205.8-12.1%2012.7zM330%20403c0%2023.2-18.8%2042-42%2042s-42-18.8-42-42%2018.8-42%2042-42%2042%2018.8%2042%2042zm-.4-379c-18.4-32-64.7-32-83.2%200L6.5%20440c-18.4%2031.9%204.6%2072%2041.6%2072H528c36.9%200%2060-40%2041.6-72l-240-416zM53.2%20455L282.8%2057c2.3-4%208.1-4%2010.4%200l229.6%20398c2.3%204-.6%209-5.2%209H58.4c-4.6%200-7.5-5-5.2-9z%22%20fill%3D%22red%22%2F%3E%3C%2Fsvg%3E") no-repeat top center;
}

.notice-Box p:first-child,
.notice-Box h3:first-child,
.notice-Box h4:first-child,
.notice-Box h5:first-child,
.notice-Box h6:first-child {
  margin-top: 0;
}

.point-Box {
  margin-top: 40px;
  padding: 20px;
  border: 2px solid #9ce3ff;
}

.point-Box .title-txt {
  font-size: 2rem;
  position: relative;
  margin-top: 0 !important;
  padding-left: 30px;
  color: #1b76be;
}

.point-Box .title-txt::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 26px;
  height: 27px;
  margin: auto;
  content: '';
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20512%22%3E%3Cpath%20d%3D%22M320%200C217.1%200%20143.9%2083.6%20144%20176.2c0%2042.5%2015.5%2083.6%2043.6%20115.6%2025.7%2029.2%2050.3%2076.9%2052.4%2092.2l.1%2075.2c0%203.1.9%206.2%202.7%208.8l24.5%2036.8c3%204.5%208%207.1%2013.3%207.1h78.9c5.4%200%2010.4-2.7%2013.3-7.1l24.5-36.9c1.7-2.6%202.7-5.7%202.7-8.8V384c2.2-15.7%2027-63.2%2052.4-92.2%2064-73.1%2056.6-184.2-16.5-248.2C403.9%2015.5%20362.7%200%20320%200zm47.9%20454.3L350.8%20480h-61.7L272%20454.3V448h96l-.1%206.3zm.1-38.3h-96l-.1-32H368v32zm60.4-145.3c-14%2016-36.3%2048.1-50.6%2081.3H262.2c-14.3-33.2-36.6-65.3-50.6-81.3-23-26.2-35.6-59.9-35.6-94.7-.1-77%2060.4-144%20144-144%2079.4%200%20144%2069.9%20144%20144%200%2034.8-12.7%2068.5-35.6%2094.7zM96%20176c0-8.8-7.2-16-16-16H26c-8.8%200-16%207.2-16%2016s7.2%2016%2016%2016h54c8.8%200%2016-7.2%2016-16zM528%2064c2.5%200%204.9-.6%207.2-1.7l54-32c7.9-4%2011.1-13.6%207.2-21.5s-13.6-11.1-21.5-7.2l-54%2032c-7.9%204-11.1%2013.6-7.2%2021.5%202.7%205.5%208.2%208.9%2014.3%208.9zm86%2096h-54c-8.8%200-16%207.2-16%2016s7.2%2016%2016%2016h54c8.8%200%2016-7.2%2016-16s-7.2-16-16-16zM119.2%2033.7l-54-32c-7.9-4-17.5-.8-21.5%207.1s-.8%2017.5%207.1%2021.5l54%2032c2.2%201.1%204.7%201.7%207.2%201.7%208.8%200%2016-7.2%2016-16%200-6.1-3.4-11.6-8.8-14.3zm470%20288l-54-32c-7.9-4-17.5-.8-21.5%207.2-4%207.9-.8%2017.5%207.2%2021.5l54%2032c7.9%204%2017.5.8%2021.5-7.2%203.9-7.9.7-17.6-7.2-21.5zM112%20288c-2.5%200-4.9.6-7.2%201.7l-54%2032c-7.9%204-11.1%2013.6-7.2%2021.5%204%207.9%2013.6%2011.1%2021.5%207.2l54-32c7.9-3.9%2011.1-13.5%207.2-21.5-2.7-5.5-8.2-8.9-14.3-8.9z%22%20fill%3D%22%23009cd9%22%2F%3E%3Cpath%20d%3D%22M428%20270.7c-14%2016-36.3%2048.1-50.6%2081.3H261.8c-14.3-33.2-36.6-65.3-50.6-81.3-23-26.2-35.6-59.9-35.6-94.7-.1-77%2060.4-144%20144-144%2079.4%200%20144%2069.9%20144%20144%200%2034.8-12.7%2068.5-35.6%2094.7%22%20fill%3D%22%23fff800%22%2F%3E%3C%2Fsvg%3E") no-repeat top center;
}

.point-Box p:first-child,
.point-Box h3:first-child,
.point-Box h4:first-child,
.point-Box h5:first-child,
.point-Box h6:first-child {
  margin-top: 0;
}

.point-Box h3,
.point-Box h4,
.point-Box h5 {
  font-size: 1.8rem !important;
  margin-top: 20px !important;
}

.gray-Box {
  margin-top: 40px;
  padding: 20px;
  background: #f3f3f3;
}

.gray-Box p:first-child,
.gray-Box h3:first-child,
.gray-Box h4:first-child,
.gray-Box h5:first-child,
.gray-Box h6:first-child {
  margin-top: 0;
}

figure {
  margin-top: 40px;
}

figure figcaption {
  margin-top: 10px;
}

figure img {
  width: auto;
  max-width: 940px;
}

.imgtxt-Box {
  margin-top: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
}

.imgtxt-Box figure {
  width: 50%;
  margin-top: 0;
}

.imgtxt-Box figure img {
  width: 100%;
}

.imgtxt-Box p:first-child {
  margin-top: 0;
}

.imgtxt-Box .txt-Area {
  width: 50%;
  padding-right: 30px;
}

.imgtxt-Box.img-Left {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.imgtxt-Box.img-Left .txt-Area {
  padding-right: 0;
  padding-left: 30px;
}

.wp-pagenavi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  margin-top: 60px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.wp-pagenavi a {
  display: block;
  margin: 0 3px;
  padding: 3px 7px;
  text-decoration: none;
  color: #1b76be;
  border: 1px solid #1b76be;
}

.wp-pagenavi a:hover {
  color: #fff;
  background: #1b76be;
}

.wp-pagenavi .current {
  margin: 0 3px;
  padding: 4px 9px;
  color: #fff;
  background: #1b76be;
}

.wp-pagenavi .pages {
  margin-right: 10px;
}

.boxx2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.boxx2 .box {
  width: 48%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
}

.txt-Link {
  position: relative;
  display: inline-block;
  margin-top: 20px;
  padding-right: 28px;
}

.txt-Link::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 25px;
  height: 25px;
  margin: auto;
  content: '';
  content: '';
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h24v24H0V0z%22%2F%3E%3Cpath%20fill%3D%22%231b76be%22%20d%3D%22M22%2012l-4-4v3H3v2h15v3l4-4z%22%2F%3E%3C%2Fsvg%3E") no-repeat;
  background-size: 100% auto;
}

.txt-Link:hover::before {
  right: -10px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h24v24H0V0z%22%2F%3E%3Cpath%20fill%3D%22%231b76be%22%20d%3D%22M22%2012l-4-4v3H3v2h15v3l4-4z%22%2F%3E%3C%2Fsvg%3E") no-repeat;
}

.flex-Col {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.search-Highlight {
  background: #9cf0ff;
}

.blue-Txt {
  color: #009cd9;
}

.red-Txt {
  color: #f00;
}

.txt-Marker {
  background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0%, #fdff46));
  background: linear-gradient(transparent 0%, #fdff46 0%);
}

table {
  width: 100%;
  border-top: 1px solid #838383;
  border-left: 1px solid #838383;
}

table thead th {
  padding: 10px;
  vertical-align: middle;
  color: #009cd9;
  border-top: 1px solid #838383;
  border-right: 1px solid #838383;
  border-bottom: 1px solid #838383;
  background: #eff8ff;
}

table tbody th,
table tbody td {
  padding: 10px;
}

table tbody th {
  vertical-align: middle;
  color: #0c0c0c;
  border-right: 1px solid #838383;
  border-bottom: 1px solid #838383;
  background: #f3f3f3;
}

table tbody td {
  vertical-align: middle;
  border-right: 1px solid #838383;
  border-bottom: 1px solid #838383;
}

.external-Link {
  margin-right: 5px;
  padding-right: 20px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20d%3D%22M432%20320h-32c-8.8%200-16%207.2-16%2016v112H64V128h144c8.8%200%2016-7.2%2016-16V80c0-8.8-7.2-16-16-16H48C21.5%2064%200%2085.5%200%20112v352c0%2026.5%2021.5%2048%2048%2048h352c26.5%200%2048-21.5%2048-48V336c0-8.8-7.2-16-16-16zM488%200H360c-21.4%200-32%2025.9-17%2041l35.7%2035.7L135%20320.4c-9.4%209.4-9.4%2024.6-.1%2033.9l.1.1%2022.7%2022.6c9.4%209.4%2024.6%209.4%2033.9.1l.1-.1%20243.6-243.7L471%20169c15%2015%2041%204.5%2041-17V24c0-13.3-10.7-24-24-24z%22%20fill%3D%22%231274c1%22%2F%3E%3C%2Fsvg%3E") no-repeat center right;
  background-size: 15px;
}

/* Footer
--------------------------------------------------------*/

footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  min-width: 1040px;
  margin-top: 100px;
  padding-bottom: 30px;
  color: #fff;
  background: #1b76be;
}

footer .wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

footer .wrapper ul li {
  display: inline-block;
  margin-right: 30px;
}

footer .wrapper ul li a {
  text-decoration: none;
  color: #fff;
}

footer .wrapper ul li a:hover {
  text-decoration: underline;
}

footer .wrapper p:last-child {
  margin-left: auto;
}

footer p a {
  color: #fff;
}

#page-Top {
  position: fixed;
  right: 20px;
  bottom: 40px;
  width: 50px;
  height: 50px;
}

#page-Top a {
  position: relative;
  z-index: 0;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
  border-radius: 50%;
  background: #1b76be;
}

#page-Top a::before {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 25px;
  height: 25px;
  margin: auto;
  content: '';
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20320.1%20206.7%22%3E%3Cpath%20d%3D%22M177.1%207l136%20136c9.4%209.4%209.4%2024.6%200%2033.9l-22.6%2022.6c-9.4%209.4-24.6%209.4-33.9%200l-96.5-96.3-96.4%2096.4c-9.4%209.4-24.6%209.4-33.9%200L7%20177c-9.4-9.4-9.4-24.6%200-33.9l136-136c9.4-9.5%2024.7-9.5%2034.1-.1z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E") no-repeat center center;
  background-size: 75%;
}

#page-Top a:hover::before {
  top: -10px;
}

/* satori
--------------------------------------------------------*/

#satori__creative_container {
  margin-top: 40px;
}

.satori__custom_form_e1a79a8909107cdf_css .satori__btn {
  color: #fff !important;
  background: #009cd9 !important;
}

.satori__message.satori__privacy_policy_url a {
  color: #009cd9 !important;
}

input:focus,
textarea:focus {
  border: 1px solid #009cd9 !important;
}