@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/*common set*/
html {
	font-size: 16px;
}
body {
	font-size: 1rem;
}
h2 {
	font-size: 1.5rem;
}
h3,
h3.hdg__accordion {
	font-size: 1.15rem;
}
h4 {
	font-size: 1rem;
}
wbr::before {
	content: "\200B";
}
sup {
	font-size: 0.6rem;
}
figure {
	margin: 0 auto;
}
figcaption {
	font-size: 1.2rem;
	font-weight: bold;
	color: #004831;
}
figcaption.notes {
	font-weight: normal;
	margin-top: 15px;
	margin-bottom: 0;
	display: table;
	margin: 15px auto 0;
}
figcaption.notes p {
	position: relative;
	padding-left: 16px;
	margin: 0 2px;
	font-size: 0.9rem;
	text-align: left;
}
.notes li,
.notes_num li {
	font-size: 0.9rem;
}
.notes_center {
	display: table;
	margin-left: auto;
	margin-right: auto;
}
.num-circle{
	font-size: 11px;
	font-family: Roboto, -apple-system, "Arial", "Helvetica", "Helvetica Neue", "Avenir", "Droid Sans", "Noto Sans JP", メイリオ, "MS PGothic", sans-serif, "Meiryo UI";
	background-color: #004831;
	color: #ffffff;
	display: inline-block;
	margin:0 3px;
	text-align: center;
	height: 17px;
	width: 18px;
	border-radius: 50%;
	font-weight: bold;
	transform: translateY(-2px);
}
@media screen and (max-width: 1199px) {
	.hdg__accordion {
		padding: 20px 50px 20px 0;
		outline: none;
	}
	.hdg__accordion--open::before,
	.hdg__accordion--close::before {
		right: 15px;
	}
	.hdg__accordion--close::after {
		right: 23px;
	}
	.inner.accordion_box:not(:root) {
		padding: 30px 0 20px;
	}
}
@media screen and (max-width: 767px) {
	html {
		font-size: 14px;
	}
	figure img{
		width: 100%;
		min-width: 315px;
		max-width: 400px;
	}
}

p > .icon-arrow-down {
	font-weight: normal;
}
/* KV */
.signboard {
	display: flex;
	height: 459px;
	width: 100%;
	background-image: url(/service/sozoku/smart/dairinin/images/sbd_bg.jpg);
	background-position: 80% center;
	background-size: cover;
	margin-top: 0;
}
.sbd__title-block {
	align-items: center;
	background-color: rgba(255, 255, 255, 0.9);
	max-width: 532px;
	height: 311px;
	margin: auto 12%;
	display: flex;
	flex-direction: column;
	padding:30px 46px 37px;
	border-radius: 6px;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16);
}
.sbd__title-block p:nth-of-type(2) {
	margin-top: 30px;
	margin-bottom: 10px;
	font-size: 24px;
}
.sbd__label{
	align-self: start;
	display: block;
	font-size:14px;
	letter-spacing: 0.075em;
	color:#666;
	border:1px solid #666;
	line-height: 1;
	padding:3px 8px;
}
.sbd__copy {
	position: relative;
	margin-bottom: 15px;
	font-size:42px;
	font-weight: bold;
	letter-spacing: 0.075em;
	color:#007F51;
}
.sbd__copy::before {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -15px;
    display: inline-block;
    width: 63px;
    height: 2px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #007F51;
    border-radius: 2px;
}
.sbd__title {
	width: 38vw;
	max-width: 370px;
	font-size:0;
}
.signboard h1 svg {
	max-width: 100%;
	height: auto;
}
@media screen and (max-width: 767px) {
	.signboard {
		padding: 0;
		background-image: url(/service/sozoku/smart/dairinin/images/sbd_bg_sp.jpg);
		height: 375px;
		background-position: 0 center;
	}
	.sbd__title-block {
		margin: 8% auto;
		padding: 20px;
		max-height: 256px;
	}
	.sbd__title-block p:nth-of-type(2) {
		font-size: 16px;
	}
	.sbd__label{
		font-size: 12px;
	}
	.sbd__copy {
		margin-bottom: 10px;
		font-size:30px;
	}
	.sbd__copy::before {
		width: 40px;
	}
	.sbd__title {
		width: 64vw;
	}
	.signboard h1 svg {
		max-width: 100%;
		height: auto;
	}
}
/*イントロ*/
#intro h2 {
	text-align: center;
	letter-spacing: 0.075em;
}
#intro h2>.non_em{
	font-size: 20px;
}
@media screen and (max-width: 767px) {
	#intro h2>.non_em{
		font-size: 16px;
	}
}
#intro h2 em {
	font-size: 1.75rem;
}
#intro p {
    font-size: 20px;
    letter-spacing: 0.05em;
    text-align: center;
    line-height: 2.2;
}
@media screen and (max-width: 767px) {
  #intro p {
      font-size: 16px;
      letter-spacing: 0.02em;
      line-height: 1.875;
  }
}
@media screen and (max-width: 767px) {
	#intro h2 {
		margin-left: -4vw;
		margin-right: -4vw;
		letter-spacing: 0;
		font-size: 1.4rem;
	}
	#intro p {
		text-align: left;
	}
}

/*みっつのポイント*/
.point_section{
	border-bottom: 1px solid #999999;
}
.point_section h2{
	padding: 70px 0 30px;
	font-size: 30px;
}
@media screen and (max-width: 767px) {
	.point_section h2{
		font-size: 26px;
	}
}
#point::before {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-top: 28px solid #FFF;
}
#point::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-top: 28px solid #E6F2EE;
}
#point {
	position: relative;
	background: #E6F2EE;
	width: 100%;
}
#point .inner {
	margin: 0 auto;
	max-width: 982px;
}
#point h2 {
	text-align: center;
	margin-bottom: 1.5em;
	color: #007F51;
}
#point .point__list {
	list-style: none;
	display: flex;
	gap: 20px;
}
#point .point__item {
  flex: 1;
  min-width: 0;
}
#point .point-item__inner {
	background: #fff;
	padding: 0 15px 15px;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	border-radius: 6px;
	border: 1px solid #D9D9D9;
}
.step_icon{
    transform: translateY(-35px);
    align-self: center;
}
#point .point-item__inner .point__text {
	margin-bottom: 0;
	flex-grow: 3;
	display: flex;
	justify-content: center;
}
#point .point-item__inner .point__text p {
	margin: 0;
	text-align: center;
	word-break: keep-all;
	font-size: 18px;
	font-weight: bold;
}
@media screen and (min-width: 768px) and (max-width: 1199px) {
	#point .point-item__inner .point__text p {
		word-break: auto-phrase;
	}
}
#point .point-item__inner .point__text p a {
	font-size: 14px;
}
#point .point-item__inner em {
	font-size: 1.25rem;
	text-decoration: underline 1px;
}
#point .point-item__inner strong {
	color: #007F51;
}
#point .point__icon {
	height: 120px;
	text-align: center;
}
#point .point__icon img {
	width: 90px;
	margin-top: 10px;
}
#point .point__btn {
	text-align: center;
}
#point .point__btn .btn {
	color: #fff;
	padding: 7px 16px;
	font-size: 1rem;
	border: 0;
	width: 75%;
	min-width: 0;
	letter-spacing: 0.02em;
	line-height: 1.5;
}
@media screen and (max-width: 1199px) {
	#point .inner {
	padding: 10px 18px 0;
	}
}
@media screen and (max-width: 767px) {
	#point {
		margin-bottom: 70px;
	}
	#point .inner {
		padding: 0 8%;
	}
	#point .point__list {
		list-style: none;
		display: flex;
		flex-direction: column;
		padding: 10px 0 0;
	}
	#point .point__item {
		width: 100%;
		padding: 0 0;
		margin: 0;
	}
	#point .point__item + .point__item {
		margin-top: 35px;
	}

	#point .point__label.bg_gold {
		margin: 0 10px 0 0;
		padding: 12px 6px;
		font-size: 1.3rem;
		white-space: nowrap;
	}
	#point .special__ttl .point__icon {
		width: 90px;
		height: auto;
	}
	#point .second_intro {
		font-size: 16px;
	}
	.special__ttl .color_gold {
		font-size: 1em;
	}
}
.point-section {
	margin-bottom: 120px;
	border-bottom: 1px solid #d0d0d0;
}
.point-section h2 {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 30px;
}
.point-section .point-ttl__label {
	color: #fff;
	font-size: 1rem;
	text-align: center;
	padding: 15px 7px;
	margin-right: 1em;
	position: relative;
	white-space: nowrap;
}
.point-section .point-ttl__label .num {
	font-size: 1.5rem;
	display: block;
	line-height: 1;
}
.point-section .point-ttl__label::after {
	content: "";
	display: block;
	border: 10px solid rgba(255, 255, 255, 0.5);
	border-top-color: transparent;
	border-left-color: transparent;
	width: 0px;
	height: 0px;
	position: absolute;
	bottom: 0;
	right: 0;
}
.point-section .inner {
	width: 85%;
	margin-bottom: 150px;
}
.point-section table {
	margin: 0 auto 1rem;
}
.point-section table caption {
	font-size: 1rem;
	text-align: center;
}
.point-section table th {
	padding: 3px 15px;
}
.point-section table thead th {
	text-align: center;
	color: #fff;
	border: 1px solid #fff;
	font-size: 0.9rem;
}
.point-section table tbody th {
	font-size: 0.9rem;
	border: 1px solid #fff;
}
.point-section table tbody td {
	border: 1px solid #d0d0d0;
	padding: 3px 15px;
	text-align: center;
	min-width: 10em;
	color: #4b4b4b;
}

.title {
	background: #444;
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.title span {
	font-weight: bold;
	color: #fff;
	font-size: 0.9rem;
	font-family: roboto;
}
.fb {
	background: #4267b2;
}
.fb svg {
	height: 23px;
}
.twt {
	background: #000000;
}
.twt svg {
	height: 20px;
}
.line {
	background: #00bb00;
}
@media screen and (max-width: 767px) {
	.title {
		width: 8vw;
		height: 4.8em;
	}
	.title span {
		font-size: 1rem;
		transform: rotate(90deg);
	}
}


.link-tel{
    font-size: 1.5rem;
    margin-right: 0.4em;
}
.link-tel {
    font-family: "Roboto", -apple-system;
    font-weight: bold;
    color: #004831;
}
.entry-channel p {
    margin: 0 auto;
    font-size: 1.3rem;
    font-weight: bold;
    display: inline-flex;
}
.entry-channel svg {
    margin-right: 10px;
}
svg.icon {
	fill: currentColor;
	width: 32px;
	height: 32px;
}
.contact{
    margin-right: 10px;
    width: 24px;
    height: 24px;
    min-width: 24px;
}
.contact_icon{
    display: flex;
    align-items: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    justify-content: center;
}
#contact_area{
    margin: 0 0 60px;
}
.title_border{
    border-bottom: 1px solid #004831;
}
.border_none{
    border-bottom: none;
}
.pdf_mgn{
    min-width: 24px;
}

.cv_area .cv_inner + .cv_inner {
	border-top: 1px solid rgba(0, 0, 0, 0.2);
	padding-bottom: 0px;
}

.contact_icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	text-align: left;
}

.row_flex > div.col_lg_6 {
	margin-bottom: 30px !important;
}
@media screen and (max-width: 767px) {
	.spBreak{
			max-width: 345px;
			margin: 0 auto;
	}
	.spBreak.row_flex [class^="col_lg_"]{
			padding-left: 0;
			padding-right: 0;
	}
}

/*追従CV*/
.pagetop.popup-pagetop{
	bottom: 130px;
}
@media screen and (max-width: 1199px) {
  .pagetop.popup-pagetop {
    bottom: 130px!important;
  }
}
@media screen and (max-width: 767px) {
  .pagetop.popup-pagetop {
    bottom: 155px!important;
  }
}
#footer .footer-content{
	padding: 40px 0 110px;
}
@media screen and (max-width: 767px) {
	#footer .footer-content{
		padding: 40px 0 146px;
	}
}
.flBanner {
	position: fixed;
	left: 0;
	bottom: 0;
	z-index: 999;
	width: 100%;
	background: #fff;
	-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
	height: 110px;
	justify-content: center;
	align-items: center;
	align-content: center;
	opacity: 0 !important;
	transition: opacity 0.3s, top 0.3s;
}
.flBanner.active {
  opacity: 1 !important;
  pointer-events: auto;
}
div.flBanner-container {
	width: 92vw;
	height: 100%;
	max-width: 892px;
	overflow: hidden;
	flex-wrap: wrap;
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-self: center;
	margin: 0 auto;
}
.flBanner-container [class^="btn"] {
	min-width: 0;
	width: calc(50% - 10px);
	position: relative;
	padding: 15px;
	line-height: 1;
}
.flBanner-container [class^="btn"]::after {
	display: block;
	content: "";
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	width: 18px;
	height: 6px;
	right: 11px;
	top: calc(50% - 3px);
	position: absolute;
}
.flBanner-container .btn-primary::after {
	background-image: url(/product/gaikatsumitate/images_new/ico_btnarrow.png);
}

.flBanner-container .btn-main::after {
	background-image: url(/product/gaikatsumitate/images_new/ico_btnarrow2.png);
}
.flBanner-container [class^="btn"] .letter-big {
	font-weight: 600;
	font-size: 22px;
	line-height: 22px;
}
.flBanner-container [class^="btn"] .wlead {
	font-weight: 400;
	font-size: 16px;
	line-height: 1;
}
.modal .column__tel-modal .contact_area{
	border-top: none;
}
.modal .column__tel-modal .contact_area .contact_inner{
	border-top: none;
	padding: 0;
}
.modal .column__tel-modal.contact-section > .inner > .contact_area:last-child{
	border-bottom: none;
}
@media screen and (max-width: 1199px) {
	.flBanner-container [class^="btn"] .letter-big {
		font-size: 16px;
	}

	.flBanner-container [class^="btn"] .wlead {
		font-size: 14px;
	}
}
@media screen and (max-width: 767px) {
	.flBanner {
		padding-top: 0;
		height: auto;
		flex-wrap: wrap;
		padding-bottom: 0;
		height: auto;
	}
	div.flBanner-container {
		flex-direction: column;
		padding: 25px 0px 17px;
	}
	.flBanner-container [class^="btn"] {
		width: 100%;
		padding: 10px;
	}
	.flBanner-container .btn-primary {
		margin-bottom: 20px;
	}
	.flBanner-container [class^="btn"] .wlead {
		font-size: 12px;
	}
}
/* スケジュールボックス */
.schedule_box {
  position: relative;
}

.schedule_box::before {
  content: "";
  display: inline-block;
  width: 2px;
  height: 99.6%;
  position: absolute;
  background-color: #007F51;
  top: 5px;
  left: 8px;
}
.schedule_box::after{
  content: "";
  position: absolute;
  bottom: -8px;
  left: -6px;
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 20px solid #007F51;
}
.schedule_box .schedule_item {
  display: flex;
  align-items: flex-start;
  gap: 0 24px;
}

.schedule_box .schedule_item .item_icon {
  content: "";
  display: inline-block;
  background: #007F51;
  border-radius: 50%;
  box-sizing: border-box;
  min-width: 18px;
  height: 16px;
  margin-top: 4px;
  margin-bottom: 0;
}

.schedule_box .schedule_item:last-child {
  margin-bottom: 0;
}

.schedule_box .schedule_item .schedule_item_heading {
  display: flex;
  align-items: center;
  gap: 0 24px;
  color: #007F51;
  font-size: 1.25rem;
  line-height: 1.1;
  margin-bottom: 20px;
}

.schedule_box .schedule_item .schedule_item_detail {
  max-width: 100%;
  border-radius: 6px;
  padding: 12px 19px;
}

.schedule_item .schedule_item_detail .detail_title {
  color: #004831;
  font-weight: bold;
  margin-bottom: 5px;
}

.schedule_item .schedule_item_detail .detail_description {
  font-size: 0.875rem;
  margin-bottom: 0;
}
.schedule_item_detail:first-of-type {
  width: 590px;
}
@media screen and (max-width: 767px) {
  .schedule_item_detail:first-of-type {
    width: auto!important;
  }
}
.schedule_item .schedule_detail_box {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  flex-wrap: wrap;
  max-width: 942px;
}

.schedule_item .schedule_detail_box .schedule_item_detail {
  max-width: 590px;
}
@media screen and (min-width: 1200px) {
  .schedule_box {
    left: 4%;
  }
}
@media screen and (min-width: 768px) and (max-width: 1199px) {
  .schedule_box {
    left: 2%;
  }
}
@media screen and (max-width: 767px) {
  .schedule_box .schedule_item {
    gap: 0 21px;
  }

  .schedule_box .schedule_item .item_inner {
    width: 100%;
  }

  .schedule_box .schedule_item .schedule_item_heading {
    font-size: 1.428rem;
  }

  .schedule_box .schedule_item .schedule_item_detail {
    width: 100%;
  }

  .schedule_item .schedule_item_detail .detail_title {
    font-size: 1.142rem;
  }

  .schedule_item .schedule_item_detail .detail_description {
    font-size: 1rem;
  }
  .schedule_item .schedule_item_detail .detail_description img {
    margin-bottom: 20px;
  }
}
/* イントロ */
@media screen and (max-width: 767px) {
  #intro .color_light-green{
    font-size: 22px;
  }
}
/* できること/できないこと */
@media screen and (min-width: 768px) {
  .typical_method_list {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 25px;
  }
}

.typical_method_list .typical_method_item .method_description {
  font-weight: 600;
  line-height: 1.5;
  margin: 0;
}
/* 2カラム */

.compare_list {
  display: flex;
  flex-direction: column;
  margin-bottom: 50px;
  min-width: calc(50% - 25px);
  border-radius: 15px;
}
.compare_list:has(.left_title) {
  border: 1px solid #65B296;
}

.compare_list:has(.right_title) {
  border: 1px solid #B3B3B3;
}
.compare_list .left_title {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #009C74;
  font-size: 16px;
  line-height: 1.45;
  font-weight: bold;
  background-color: #E6F2EE;
  text-align: center;
  padding: 12px 0 16px;
  border-radius: 15px 15px 0 0;
  margin-bottom: 0;
}
.compare_list .right_title {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  font-size: 16px;
  line-height: 1.45;
  font-weight: bold;
  background-color: #E6E6E6;
  text-align: center;
  padding: 12px 0 16px;
  border-radius: 15px 15px 0 0;
  margin-bottom: 0;
}
.compare_list ul {
  flex: 1;
  border-top: none;
  border-radius: 0 0 15px 15px;
}
.compare_list .person_list {
  padding: 30px;
}
.compare_list .person_list .person_item {
  position: relative;
  font-size: 14px;
  line-height: 1.5;
  padding-left: 20px;
  margin-bottom: 15px;
}

.compare_list .person_list .person_item:last-child {
  margin-bottom: 0;
}

.compare_list .person_list .person_item:before {
  content: "";
  position: absolute;
  top: 1em;
  left: 5px;
  width: 8px;
  height: 8px;
  margin-top: -8px;
  background: #000;
  border-radius: 8px;
}
@media screen and (max-width: 767px) {
  .compare_list {
    margin-bottom: 40px;
    
  }

  .compare_list .left_title,.compare_list .right_title {
    font-size: 16px;
    line-height: 1.45;
    padding: 10px 20px;
  }

}
.left_title span,.right_title span {
  font-weight: 900;
  font-size: 30px;
}
/* 通常/優遇時 */
.two_method {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 53px;
}
@media screen and (max-width: 767px) {
  .two_method {
    justify-content: space-between;
  }
}
.left_table,.right_table {
  border: 1px solid #B3B3B3;
  width: 290px;
}
@media screen and (max-width: 767px) {
  .left_table,.right_table {
    width: 138px;
  }
}
.left_table > .ttl {
    font-weight: bold;
    padding: 5px;
    background: #4B4B4B;
    color: #FFF;
    text-align: center;
}
.right_table > .ttl {
    font-weight: bold;
    padding: 5px;
    background: #007F51;
    color: #FFF;
    text-align: center;
}
.amount {
    text-align: center;
    font-weight: bold;
}
.left_table .amount span{
    font-size: 24px;
}
.right_table .amount span{
    font-size: 46px;
}
.right_table .amount {
    color: #D98827;
}

.left_table::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 49%;
    transform: translateY(-50%);
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 12px solid #000;
}
/* グリーンボックス */
.green_box {
  margin-top: 1%;
  padding: 26px 0;
  border-radius: 6px;
  font-size: 20px;
  color: #007F51;
  border: 1px solid #007F51;
}
@media screen and (max-width: 767px) {
  .green_box {
    margin-top: 3%;
    padding: 15px 28px;
    font-size: 16px;
  }
}
/* 汎用 */
.f13{
  font-size: 13px!important;
}
.f14{
  font-size: 14px!important;
}
.f15{
  font-size: 15px!important;
  font-weight: normal!important;
}
.f20{
  font-size: 20px!important;
}
.cv_section{
  background-color: #F6F9DA;
}
.underline{
  text-decoration: underline 1px;
}
.underline_light-green{
  text-decoration: underline 4px #C4D700;
}
.color_black{
  color: #000;
}
.color_light-green{
  color: #007F51;
}
.step_icon {
  line-height: inherit;
}