@charset "UTF-8";
.sm-only {
  display: none;
}

#container {
  width: 980px;
}

#container h1 {
  font-size: 1.73333em;
  border-bottom: 1px solid #cccccc;
  padding: 8px 0 3px 0px;
  letter-spacing: 0.02em;
}

#selector-area {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-top: 3.2%;
}

#selector-area span {
  display: block;
  width: 48%;
}

#selector-area span a {
  display: block;
  width: 100%;
  padding: 4.6%;
  box-sizing: border-box;
  border: 2px solid #3465C1;
  border-radius: 8px;
  background-color: #EFF7FF;
  color: #333;
  font-size: 1.5333em;
  font-weight: bold;
  text-align: center;
  position: relative;
  opacity: 1;
  transition: 0.2s;
}

#selector-area span a:hover {
  opacity: 0.6;
}

#selector-area span a::after {
  content: '';
  position: absolute;
  border-top: solid 3px #1B4EAF;
  border-right: solid 3px #1B4EAF;
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  margin: auto;
  top: 0;
  bottom: 0;
  right: 19px;
}

#selector-area span a.link-btn-personal::before {
  content: "";
  display: block;
  width: 58px;
  height: 58px;
  margin: 0 auto 3.7%;
  background: url("/static/images/support/support_regi/regi/kojin.png") no-repeat;
  background-size: contain;
}

#selector-area span a.link-btn-biz::before {
  content: "";
  display: block;
  width: 58px;
  height: 58px;
  margin: 0 auto 3.7%;
  background: url("/static/images/support/support_regi/regi/houjin.png") no-repeat;
  background-size: contain;
}

#direct-area {
  margin: 3.4% 0 10.6%;
}

#direct-area a {
  display: block;
  width: 100%;
  padding: 3.2% 0 2.5%;
  box-sizing: border-box;
  border: 2px solid #3465C1;
  border-radius: 8px;
  color: #333;
  font-size: 1.3333em;
  font-weight: bold;
  text-align: center;
  position: relative;
  line-height: 1.5;
  letter-spacing: 0.1em;
  opacity: 1;
  transition: 0.2s;
}

#direct-area a:hover {
  opacity: 0.6;
}

#direct-area a::after {
  content: '';
  position: absolute;
  border-top: solid 3px #1B4EAF;
  border-right: solid 3px #1B4EAF;
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  margin: auto;
  top: 0;
  bottom: 0;
  right: 19px;
}

#direct-area p {
  text-align: right;
  font-size: 0.9333em;
  color: #1B4EAF;
  margin: 1% 0 0;
}

.support-regi-title {
  background-color: #44474D;
  color: #fff;
  font-size: 1.8em;
  padding: 1.2% 2.4%;
  margin-top: 3.2%;
  letter-spacing: 0.08em;
}

.support-regi-sub-title {
  font-size: 1.5333em;
  border-bottom: 1px solid #959595;
  padding: 0 2% 0.8%;
  margin: 3.7% 0 0;
  letter-spacing: 0.05em;
}

.attention {
  color: #FF0000;
  font-size: 0.91333em;
  text-indent: -1em;
  line-height: 1.6;
  padding-left: 1em;
}

#inq-menu-area,
#after-menu-area,
#other-menu-area,
#select-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 3.9% 0 0;
}

#inq-menu-area a,
#after-menu-area a,
#other-menu-area a,
#select-area a {
  display: block;
  cursor: pointer;
  border: 1px solid #D8D8D8;
  border-radius: 7px;
  position: relative;
  width: 48.8%;
  height: 120px;
  color: #333333;
  margin-bottom: 2%;
  opacity: 1;
  transition: 0.2s;
}

#inq-menu-area a:hover,
#after-menu-area a:hover,
#other-menu-area a:hover,
#select-area a:hover {
  opacity: 0.6;
}

#inq-menu-area a:hover img,
#after-menu-area a:hover img,
#other-menu-area a:hover img,
#select-area a:hover img {
  opacity: 1 !important;
}

#inq-menu-area a::after,
#after-menu-area a::after,
#other-menu-area a::after,
#select-area a::after {
  content: '';
  position: absolute;
  border-top: solid 3px #1B4EAF;
  border-right: solid 3px #1B4EAF;
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  margin: auto;
  top: 0;
  bottom: 0;
  right: 19px;
}

#inq-menu-area a .btnMenu,
#inq-menu-area a .btnSelector,
#after-menu-area a .btnMenu,
#after-menu-area a .btnSelector,
#other-menu-area a .btnMenu,
#other-menu-area a .btnSelector,
#select-area a .btnMenu,
#select-area a .btnSelector {
  width: 100%;
  height: 100%;
  display: flex;
  padding: 6% 3%;
  align-items: center;
  box-sizing: border-box;
}

#inq-menu-area a .btnMenu img,
#inq-menu-area a .btnSelector img,
#after-menu-area a .btnMenu img,
#after-menu-area a .btnSelector img,
#other-menu-area a .btnMenu img,
#other-menu-area a .btnSelector img,
#select-area a .btnMenu img,
#select-area a .btnSelector img {
  margin-right: 2.5%;
  width: 55px;
}

#inq-menu-area a .btnMenu.catalog img,
#inq-menu-area a .btnSelector.catalog img,
#after-menu-area a .btnMenu.catalog img,
#after-menu-area a .btnSelector.catalog img,
#other-menu-area a .btnMenu.catalog img,
#other-menu-area a .btnSelector.catalog img,
#select-area a .btnMenu.catalog img,
#select-area a .btnSelector.catalog img {
  width: 50px;
  margin: 0 2.5% 0 1%;
}

#inq-menu-area a .btnMenu.other img,
#inq-menu-area a .btnSelector.other img,
#after-menu-area a .btnMenu.other img,
#after-menu-area a .btnSelector.other img,
#other-menu-area a .btnMenu.other img,
#other-menu-area a .btnSelector.other img,
#select-area a .btnMenu.other img,
#select-area a .btnSelector.other img {
  width: 44px;
  margin: 5px 4.2% 5px 1.9%;
}

#inq-menu-area a .btnMenu div,
#inq-menu-area a .btnSelector div,
#after-menu-area a .btnMenu div,
#after-menu-area a .btnSelector div,
#other-menu-area a .btnMenu div,
#other-menu-area a .btnSelector div,
#select-area a .btnMenu div,
#select-area a .btnSelector div {
  width: 80%;
}

#inq-menu-area a .btnMenu div p,
#inq-menu-area a .btnSelector div p,
#after-menu-area a .btnMenu div p,
#after-menu-area a .btnSelector div p,
#other-menu-area a .btnMenu div p,
#other-menu-area a .btnSelector div p,
#select-area a .btnMenu div p,
#select-area a .btnSelector div p {
  font-weight: bold;
  font-size: 1.3333em;
}

#inq-menu-area a .btnMenu div p.notice,
#inq-menu-area a .btnSelector div p.notice,
#after-menu-area a .btnMenu div p.notice,
#after-menu-area a .btnSelector div p.notice,
#other-menu-area a .btnMenu div p.notice,
#other-menu-area a .btnSelector div p.notice,
#select-area a .btnMenu div p.notice,
#select-area a .btnSelector div p.notice {
  font-size: 0.875em;
  margin: 4% 0 0;
  font-weight: normal;
  line-height: 1.4;
  width: 325px;
}

#inq-menu-area a .btnMenu div p span,
#inq-menu-area a .btnSelector div p span,
#after-menu-area a .btnMenu div p span,
#after-menu-area a .btnSelector div p span,
#other-menu-area a .btnMenu div p span,
#other-menu-area a .btnSelector div p span,
#select-area a .btnMenu div p span,
#select-area a .btnSelector div p span {
  font-size: 0.9em;
  color: #fff;
  padding: 0.2% 1.5%;
  margin-right: 1%;
  vertical-align: 1px;
}

#inq-menu-area a .btnMenu div p span.before-buy,
#inq-menu-area a .btnSelector div p span.before-buy,
#after-menu-area a .btnMenu div p span.before-buy,
#after-menu-area a .btnSelector div p span.before-buy,
#other-menu-area a .btnMenu div p span.before-buy,
#other-menu-area a .btnSelector div p span.before-buy,
#select-area a .btnMenu div p span.before-buy,
#select-area a .btnSelector div p span.before-buy {
  background-color: #0676E6;
}

#inq-menu-area a .btnMenu div p span.after-buy,
#inq-menu-area a .btnSelector div p span.after-buy,
#after-menu-area a .btnMenu div p span.after-buy,
#after-menu-area a .btnSelector div p span.after-buy,
#other-menu-area a .btnMenu div p span.after-buy,
#other-menu-area a .btnSelector div p span.after-buy,
#select-area a .btnMenu div p span.after-buy,
#select-area a .btnSelector div p span.after-buy {
  background-color: #F57B00;
}

#select-area {
  margin-bottom: 12.7%;
}

#select-area a .btnSelector {
  padding: 5.1% 3% 4.2%;
}

.support-menu-area-title {
  font-size: 1.4666em;
  margin: 6.4% 0 0 2%;
}

#support-menu-area {
  background-color: #EFF5FC;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 1% 0 11.6%;
  padding: 2% 2% 1%;
}

#support-menu-area a {
  display: block;
  border: 1px solid #D8D8D8;
  background-color: #fff;
  border-radius: 7px;
  position: relative;
  width: 49%;
  color: #333333;
  margin-bottom: 1.6%;
  opacity: 1;
  transition: 0.2s;
}

#support-menu-area a:hover {
  opacity: 0.6;
}

#support-menu-area a:hover img {
  opacity: 1 !important;
}

#support-menu-area a::after {
  content: '';
  position: absolute;
  border-top: solid 3px #1B4EAF;
  border-right: solid 3px #1B4EAF;
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  margin: auto;
  top: 0;
  bottom: 0;
  right: 19px;
}

#support-menu-area a .btnMenu {
  width: 100%;
  display: flex;
  padding: 2% 3%;
  align-items: center;
  box-sizing: border-box;
}

#support-menu-area a .btnMenu img {
  margin-right: 4.5%;
  width: 50px;
}

#support-menu-area a .btnMenu div {
  width: 80%;
}

#support-menu-area a .btnMenu div p {
  font-weight: bold;
  font-size: 1.1333em;
}

#support-menu-area a .btnMenu div p.notice {
  font-size: 0.875em;
  margin: 2.5% 0 0;
}

#tel-info h3 {
  margin-bottom: 7px;
  font-size: 1.55em;
}

#tel-info h3 img {
  vertical-align: -9px;
  margin-right: 8px;
}

#tel-info #enquiry-inner {
  background-color: #F7F7F7;
  padding: 20px;
  font-size: 0.85em;
  margin-bottom: 31px;
}

#tel-info #enquiry-cont {
  display: flex;
  margin: 0 0 2.5%;
}

#tel-info #enquiry-cont p {
  margin-right: 3.7%;
  font-weight: bold;
}

#tel-info #enquiry-cont dl dt {
  margin-bottom: 6px;
}

#tel-info #enquiry-cont dl dd .tel {
  font-weight: bold;
}

#tel-info #enquiry-cont dl dd a[href^="tel:"] {
  color: #333;
  pointer-events: none;
  text-decoration: none;
}

#caution {
  margin-bottom: 45px;
}

#caution h3 {
  font-size: 0.95em;
  padding-bottom: 5px;
  margin-bottom: 11px;
  border-bottom: 1px solid #DFDFDF;
}

#caution ul li {
  font-size: 0.8em;
  margin-bottom: 8px;
}

h2.step {
  width: 75.4%;
  margin: 2% auto 5%;
}

h2.step img {
  width: 100%;
}

#support-info {
  border: 1px solid #FF0000;
  border-radius: 10px;
  padding: 17px;
  margin: 20px 0 50px;
  width: 944px;
}

.support_info_title {
  color: #FF0000;
  font-size: 1em;
  font-weight: bold;
  margin-bottom: 8px;
}

.support_info_title img {
  margin-right: 4px;
  vertical-align: -2px;
  width: 60px;
}

.support_info_week {
  color: #FF0000;
  font-size: 1.35em !important;
  font-weight: bold;
  margin-bottom: 8px;
}

.support_info_week span {
  vertical-align: 1px;
}

/* 表の場合 */
p#week_title {
  margin-top: 17px;
  font-size: 0.9em;
  color: #000000;
}

div#week {
  margin: 7px 0 15px;
}

div#week div.table {
  display: table-cell;
  border-top: 1px solid #CCCCCC;
  border-left: 1px solid #CCCCCC;
  font-size: 0.85em;
  text-align: center;
}

div#week div.tr {
  display: table-row;
}

div#week div.th {
  display: table-cell;
  border-right: 1px solid #CCCCCC;
  border-bottom: 1px dotted #CCCCCC;
  width: 70px;
  padding: 7px;
}

div#week div.td {
  display: table-cell;
  border-right: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
  padding: 7px;
}

div#week div.th.holiday, div#week div.td.holiday {
  background-color: #FFEFEF;
}

div#week div.td.holiday {
  color: #FF0000;
}

.support_info_chips {
  color: #FF0000;
  font-size: 0.85em;
  margin-bottom: 12px;
}

.support_info_hosoku {
  font-size: 0.85em;
  line-height: 1.4;
}

#main-contents .support_info_hosoku a {
  color: #1c62b8;
  text-decoration: underline;
}

#main-contents .support_info_hosoku a:hover {
  color: #FF0000;
  text-decoration: underline;
}

br.brank_paragraph {
  margin-bottom: -12px;
}

.smart {
  display: none;
}

.personal {
  display: block;
}

#main-content a[href^="tel:"] {
  pointer-events: none;
  text-decoration: none;
}

/* フローバナー */
#flow.flow-banner {
  margin: 5% auto;
  padding: 0;
  width: 100%;
  box-sizing: border-box;
}

#flow.flow-banner img {
  width: 100%;
}

#flow.flow-banner .flow-top-area,
#flow.flow-banner .flow-bottom-area {
  box-sizing: border-box;
  margin: 0 auto;
  width: 100%;
}

#flow.flow-banner .flow-top-area {
  background-color: #333;
  vertical-align: middle;
  padding: 2% 5%;
}

#flow.flow-banner .flow-top-area p {
  color: #fff;
  font-weight: bold;
  font-size: 1.3em;
}

#flow.flow-banner .flow-bottom-area {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  background-color: #fee100;
  padding: 2% 5%;
}

#flow.flow-banner .flow-bottom-area p {
  margin: 0;
}

#flow.flow-banner .flow-bottom-area p.link-banner1 {
  width: 35%;
}

#flow.flow-banner .flow-bottom-area p.link-banner2 {
  width: 35%;
}