@charset "UTF-8";

body.fixed{
	overflow: hidden;
}

.guide_wrap .section_mainbnr {
  width        : 100vw;
  margin-inline: calc(49% - 50vw);
}

.guide_wrap .section_mainbnr img {
  width: 100%;
}

@media (max-width: 1000px) {
  .guide_wrap .section_mainbnr {
    margin-inline: calc(50% - 50vw);
  }
}

.guide_pagetop{
	position        : fixed;
	right           : 32px;
	bottom          : 32px;
	width           : 48px;
	height          : 48px;
	border-radius   : 100%;
	border          : 1px solid #D9D9D9;
	display         : block;
	background-color: #fff;
	z-index         : 99;
}

.guide_pagetop_icon{
	display    : block;
	width      : 12px;
	height     : 12px;
	border-left: 1px solid #1A1A1A;
	border-top : 1px solid #1A1A1A;
	margin     : 20px auto;
	transform  : rotate(45deg);
	box-sizing : border-box;
}

@media (max-width: 1000px) {
  .guide_pagetop {
		right : 16px;
		bottom: 16px;
  }
}

/* 汎用スタイル */
.header_nav ul:not(:last-of-type) {
  border-bottom: 2px solid #fff;
}

.member_registration_block{
	margin-top   : 140px;
	margin-bottom: 140px;
}

.member_registration_text {
  text-align    : center;
  margin-top    : 24px;
  font-size     : 12px;
  line-height   : 1.6;
  text-align    : center;
  letter-spacing: 0.08em;
  color         : #555555;
}

@media (max-width: 1000px) {
  .member_registration_text {
    text-align: left;
  }

	.member_registration_block{
		margin-top   : 80px;
		margin-bottom: 112px;
	}

}

.guide_block_index_title {
  gap: 0 24px;
}

.guide_block_index_container {
  padding-bottom: 24px;
}

.guide_block_button {
  display         : flex;
  justify-content : space-between;
  align-items     : center;
  width           : 80%;
  max-width       : 500px;
  font-size       : 14px;
  line-height     : 1.8;
  letter-spacing  : 0.1em;
  color           : #555555;
  padding         : 9px 8px;
  background-color: #f5f5f5;
  margin-top      : 24px;
}

.guide_block_button_icon {
  width      : 20px;
  height     : 20px;
  display    : block;
  line-height: 1;
}

.guide_block_button_icon svg {
  width : 100%;
  height: 100%;
}

@media (max-width: 1000px) {
  .guide_block_button {
    width: 100%;
  }
}

.guide_text_link {
  display        : inline-flex;
  align-items    : center;
  position:relative;
}

.guide_text_link::after{
  transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
	content:'';
	display:block;
	position: absolute;
	left: 0;
	top: 74%;
	width: 100%;
	height: 1px;
	background-color: currentColor;
}

.guide_text_link:hover::after{
  background-color: transparent;
}

.guide_text_link_icon {
  width      : 14px;
  height     : 14px;
  display    : block;
  line-height: 1;
}

.guide_text_link_icon svg {
  width : 100%;
  height: 100%;
}

.guide_block_notice {
  font-size     : 12px;
  line-height   : 1.6;
  letter-spacing: 0.08em;
}

.guide_bullet_points li {
  font-size          : 14px;
  letter-spacing     : 0.1em;
  line-height        : 1.8;
  list-style         : disc;
  list-style-position: inside;
}

.guide_explanation{
  margin-top: 16px;
}

.guide_explanation_description{
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: 0.08em;
  margin-top: 8px;
}

@media (max-width: 1000px) {
  .guide_explanation{
    margin-top: 24px;
  }
}

.guide_modal {
  backface-visibility: hidden;
  transition         : all 0.3s ease-in;
  position           : fixed;
  inset              : 0;
  background-color   : #fff;
  z-index            : 200;
  overflow           : auto;
  opacity            : 0;
  visibility         : hidden;
}

.guide_modal.visible {
  opacity   : 1;
  visibility: visible;
}

.guide_modal_inner {
  max-width      : 944px;
  width          : 100%;
  margin         : 0 auto;
  padding        : 70px 24px;
  display        : flex;
  flex-direction : column;
  align-items    : center;
  min-height     : 100%;
  justify-content: space-between;
}

.guide_modal_trigger-close {
  position: fixed;
  right   : 40px;
  top     : 24px;
  width   : 32px;
  height  : 32px;
}

@media (max-width: 1000px) {
  .guide_modal_trigger-close {
		right : 24px;
		width : 24px;
		height: 24px;
  }
}

.guide_modal_trigger-close_icon {
  position: relative;
  width   : 32px;
  height  : 32px;
}

@media (max-width: 1000px) {
  .guide_modal_trigger-close_icon {
		width : 24px;
		height: 24px;
  }
}

.guide_modal_trigger-close_icon::before,
.guide_modal_trigger-close_icon::after {
  content         : "";
  display         : block;
  width           : 100%;
  height          : 1px;
  background-color: #1a1a1a;
  position        : absolute;
  top             : calc(50% - 1px);
  left            : calc(50% - 16px);
}

.guide_modal_trigger-close_icon::before {
  transform: rotate(-45deg);
}

.guide_modal_trigger-close_icon::after {
  transform: rotate(45deg);
}

@media (max-width: 1000px) {
  .guide_block_button {
    right: 24px;
  }

	.guide_modal_trigger-close_icon::before,
	.guide_modal_trigger-close_icon::after {
		left: calc(50% - 12px);
	}
}

.guide_modal__container {
  width: 100%;
}

.guide_modal_close {
  font-size      : 16px;
  line-height    : 1.8;
  letter-spacing : 0.1em;
  display        : flex;
  justify-content: center;
  align-items    : center;
  gap            : 8px;
  width          : 96px;
}

.guide_tab_contents{
	display: none;
}

.guide_tab_contents.visible{
	display: block;
}

/* クリーニング・ストレージ共通スタイル */
.guide_cleaning {
  margin-top: 80px;
}

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

.guide_cleaning .guide_block_lead_title {
  margin-bottom: 32px;
}

.guide_cleaning .guide_block_index:last-of-type {
  border-bottom: 1px solid #d9d9d9;
}

.guide_cleaning .guide_block_index_container {
  line-height: 1.8;
}

.guide_cleaning .guide_block_index_title{
  color: #1A1A1A;
}

@media (max-width: 1000px) {
  .cleaning .guide_wrap .section_title_wrap .section_title {
    font-size: 24px;
  }
}

/* サービスの利用フロー */
.usage_flow {
  display        : flex;
  justify-content: flex-start;
  gap            : 22px;
  align-items    : flex-start;
}

.usage_flow_box {
  width: calc((100% - 46px * 2 - 22px * 4) / 3);
}

.usage_flow_arrow {
  width      : 24px;
  height     : 46px;
  line-height: 1;
  transform  : rotate(-90deg);
  margin-top : 80px;
}

.usage_flow_arrow svg {
  width : 100%;
  height: 100%;
  fill  : currentColor;
}

.usage_flow_image {
  padding: 18px 20px;
}

.usage_flow_label {
  display         : flex;
  justify-content : center;
  align-items     : center;
  background-color: #1a1a1a;
  color           : #ffffff;
  font-size       : 11px;
  width           : 70px;
  height          : 30px;
  padding         : 10px;
  line-height     : 1;
  border-radius   : 16px;
  margin-bottom   : 8px;
}

.usage_flow_title {
  font-size     : 20px;
  line-height   : 1.4;
  letter-spacing: 0.08em;
  margin-bottom : 12px;
}

@media (max-width: 1000px) {
  .usage_flow {
    flex-direction: column;
    gap           : 16px;
    align-items   : center;
  }

  .usage_flow_box {
    width: 100%;
  }

  .usage_flow_arrow {
    transform  : rotate(0);
    width      : 24px;
    height     : 28px;
    line-height: 1;
    margin-top : 0;
  }

  .usage_flow_image {
    padding      : 0;
    margin-bottom: 8px;
  }

  .usage_flow_label {
    font-size    : 10px;
    width        : 55px;
    height       : 26px;
    padding      : 6px 10px;
    border-radius: 40px;
  }

  .usage_flow_title {
    font-size    : 16px;
    line-height  : 1.4;
    margin-bottom: 16px;
  }
}

/* サービスの特徴 */
.cleaning_service_block {
  display        : flex;
  justify-content: space-between;
  flex-wrap      : wrap;
  gap            : 32px;
}

.cleaning_service_block:not(:last-of-type) {
  margin-bottom: 60px;
}

.cleaning_service_image {
  width: 345px;
}

.cleaning_service_container {
  width: calc(100% - 377px);

  font-size     : 14px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
  position      : relative;
}

.cleaning_service_container p:not(:last-of-type) {
  margin-bottom: 16px;
}

.cleaning_service_title {
  font-size     : 32px;
  line-height   : 1.4;
  letter-spacing: 0.08em;
  margin-bottom : 47px;
}

.cleaning_service_list {
  display : flex;
  gap     : 8px;
  position: absolute;
  right   : 0;
  top     : 0;
}

.cleaning_service_list::after,
.cleaning_service_list::before {
  display: none;
}

.cleaning_service_icon {
  width          : 60px;
  height         : 60px;
  border-radius  : 100%;
  border         : 1px solid #1a1a1a;
  font-size      : 12px;
  line-height    : 1.6;
  display        : flex;
  align-items    : center;
  justify-content: center;
  letter-spacing : 0.08em;
  text-align     : center;
}

.cleaning_service_caption {
  font-size     : 20px;
  line-height   : 1.4;
  letter-spacing: 0.08em;
  margin-bottom : 16px;
}

.cleaning_service_caption--mini {
  font-size     : 16px;
}

@media (max-width: 1000px) {
  .cleaning_service_block:not(:last-of-type) {
    margin-bottom: 80px;
  }

  .cleaning_service_image {
    width: 100%;
  }

  .cleaning_service_container {
    width: 100%;
  }

  .cleaning_service_container p:not(:last-of-type) {
    margin-bottom: 24px;
  }

  .cleaning_service_title {
    font-size    : 24px;
    margin-bottom: 24px;
  }

  .cleaning_service_list {
    position     : static;
    margin-bottom: 24px;
  }

  .cleaning_service_icon {
    width        : auto;
    height       : 31px;
    padding      : 6px 9px;
    border-radius: 8px;
    line-height  : 1;
  }

  .cleaning_service_caption {
    font-size: 16px;
  }

  .cleaning_service_caption--mini {
    font-size     : 14px;
  }
}

/* サービスの詳細 */
.cleaning_chart {
  margin-top: 80px;
}

.cleaning_chart_table {
  width         : 100%;
  font-size     : 16px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
}

.cleaning_chart_table tr {
  border-bottom: 1px solid #d9d9d9;
}

.cleaning_chart_table th {
  width         : 146px;
  padding       : 8px 24px;
  height        : 77px;
  vertical-align: middle;
}

.cleaning_chart_table td {
  padding       : 8px;
  text-align    : center;
  vertical-align: middle;
  width         : 367px;
}

.cleaning_chart_image {
  display        : flex;
  justify-content: center;
}

.cleaning_chart_icon {
  width  : 100px;
  height : 100px;
  display: block;
}

.cleaning_chart_icon svg {
  fill  : currentColor;
  width : 100%;
  height: 100%;
}

@media (max-width: 1000px) {
  .cleaning_chart {
    margin-top: 32px;
  }

  .cleaning_chart_table {
    font-size     : 12px;
    vertical-align: middle;
  }

  .cleaning_chart_table th {
    width     : 24%;
    padding   : 8px 0;
    height    : 56px;
    text-align: center;
  }

  .cleaning_chart_table td {
    width  : 38%;
    padding: 8px 0;
  }

  .cleaning_chart_icon {
    width : 48px;
    height: 48px;
  }
}

.cleaning_specifics {
  margin-top    : 80px;
  font-size     : 16px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
}

.cleaning_specifics_title {
  margin-bottom  : 32px;
  padding-bottom : 16px;
  font-size      : 24px;
  line-height    : 1.4;
  letter-spacing : 0.08em;
  border-bottom  : 1px solid #555555;
  display        : flex;
  justify-content: flex-start;
  align-items    : center;
  gap            : 8px;
}

.cleaning_specifics_title_icon {
  width      : 24px;
  height     : 24px;
  line-height: 1;
  display    : block;
}

.cleaning_specifics_title_icon svg {
  width : 100%;
  height: 100%;
}

.cleaning_specifics_caption {
  margin-bottom : 16px;
  font-size     : 20px;
  line-height   : 1.4;
  letter-spacing: 0.08em;
}

.cleaning_set {
  width          : 488px;
  margin         : 0 auto;
  display        : flex;
  justify-content: center;
  align-items    : center;
  gap            : 16px;
  padding        : 58px 0 42px;
}

.cleaning_set_box,
.cleaning_set_box--dash {
  width          : 130px;
  aspect-ratio   : 1.625;
  display        : flex;
  justify-content: center;
  align-items    : center;
  border         : 1px solid #1a1a1a;
  position       : relative;
}

.cleaning_set_box--dash {
  border: 1px dashed #9d9d9d;
}
.cleaning_set_optional {
  position   : absolute;
  bottom     : 100%;
  left       : 0;
  width      : 100%;
  font-size  : 11px;
  line-height: 1.6;
  text-align : center;
}

.cleaning_set_plus {
  width   : 16px;
  height  : 16px;
  position: relative;
}

.cleaning_set_plus::before,
.cleaning_set_plus::after {
  content         : "";
  display         : block;
  position        : absolute;
  background-color: #1a1a1a;
}

.cleaning_set_plus::before {
  width : 100%;
  height: 2px;
  left  : 0;
  top   : calc(50% - 1px);
}

.cleaning_set_plus::after {
  width : 2px;
  height: 100%;
  top   : 0;
  left  : calc(50% - 1px);
}

.cleaning_step {
  margin-bottom: 16px;
}

.cleaning_step_header {
  color           : #ffffff;
  padding         : 24px;
  font-size       : 20px;
  line-height     : 1.4;
  letter-spacing  : 0.08em;
  background-color: #434343;
  display         : flex;
  gap             : 32px;
  justify-content : flex-start;
  align-items     : center;
}

.cleaning_step_body {
  border     : 1px solid #d9d9d9;
  padding    : 24px;
  font-size  : 14px;
  line-height: 1.8;
}

.cleaning_step_body .guide_block_notice {
  color     : #555555;
  margin-top: 8px;
}

.cleaning_example:first-of-type {
  margin-top: 24px;
}

.cleaning_example {
  margin-bottom: 24px;
}

.cleaning_example_header {
  padding         : 21px 24px;
  font-size       : 20px;
  line-height     : 1.4;
  letter-spacing  : 0.08em;
  background-color: #d9d9d9;
}

.cleaning_example_body {
  padding        : 38px 0;
  max-width      : 654px;
  width          : 100%;
  margin         : 0 auto;
  display        : flex;
  justify-content: flex-start;
  align-items    : flex-start;
  flex-wrap      : wrap;
  gap            : 0 8px;
}

.cleaning_example_notice {
  color         : #555555;
  font-size     : 12px;
  line-height   : 1.6;
  letter-spacing: 0.08em;
  width         : 100%;
}

.cleaning_example_block {
  width          : 100%;
  max-width      : 426px;
  display        : flex;
  justify-content: flex-start;
  align-items    : flex-start;
  flex-wrap      : wrap;
  gap            : 0 8px;
}

.cleaning_example_box {
  width: 200px;
}

.cleaning_example_label {
  width          : 100%;
  height         : 35px;
  display        : flex;
  justify-content: center;
  align-items    : center;
  text-align     : center;
  padding        : 3px 8px;
  border         : 1px solid #000000;
  margin-bottom  : 16px;
  font-size      : 16px;
}

.cleaning_example_date {
  line-height    : 1.6;
  text-align     : center;
  letter-spacing : 0.08em;
  font-size      : 11px;
  display        : flex;
  justify-content: center;
  flex-wrap      : wrap;
  gap            : 8px;
  align-items    : center;
}

.cleaning_example_date span {
  font-size: 16px;
}

.cleaning_example_date .cleaning_example_num {
  line-height: 1;
  font-size  : 42px;
}

.cleaning_example_arrow {
  width           : 8px;
  height          : 23px;
  clip-path       : polygon(100% 50%, 0 0, 0 100%);
  background-color: #555555;
  margin-top      : 6px;
}

.cleaning_separator_line {
  width           : 100%;
  height          : 1px;
  background-color: #e9e9e9;
  margin          : 16px 0;
}

@media (max-width: 1000px) {
  .cleaning_specifics_title {
    font-size     : 18px;
    padding-bottom: 16px;
  }

  .cleaning_specifics_caption {
    font-size: 16px;
  }

  .cleaning_set {
    width  : 100%;
    padding: 62px 10px 50px;
    gap    : 8px;
  }

  .cleaning_set_plus {
    width : 12px;
    height: 12px;
  }

  .cleaning_set_box,
  .cleaning_set_box--dash {
    width    : calc((100% - 56px) / 3);
    font-size: 12px;
  }

  .cleaning_step_header {
    flex-direction: column;
    align-items   : flex-start;
    gap           : 0;
    font-size     : 16px;
    padding       : 16px 24px;
  }

  .cleaning_step_header_label {
    font-size: 12px;
  }

  .cleaning_example:last-of-type {
    margin-bottom: 0;
  }

  .cleaning_example_header {
    font-size     : 16px;
    padding-top   : 13px;
    padding-bottom: 13px;
  }

  .cleaning_example_body {
    flex-direction: column;
    align-items   : center;
    gap           : 32px 0;
    width         : 100%;
    padding       : 32px 0;
  }

  .cleaning_example_block {
    flex-direction: column;
    align-items   : center;
    gap           : 32px 0;
  }

  .cleaning_example_box {
    width: 100%;
  }

  .cleaning_example_label {
    margin-bottom: 8px;
  }

  .cleaning_example_arrow {
    width     : 23px;
    height    : 8px;
    clip-path : polygon(50% 100%, 0 0, 100% 0);
    margin-top: 6px;
  }

  .cleaning_separator_line {
    margin: 16px 0 8px;
  }
}

/* サービス料金 */
.cleaning_charge_block {
  margin-top: 40px;
}

.cleaning_charge_block_lead {
  margin-bottom : 24px;
  font-size     : 16px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
}

.cleaning_charge_block_lead_title {
  padding-bottom: 16px;
  margin-bottom : 24px;
  border-bottom : 1px solid #555555;
  font-size     : 24px;
  line-height   : 1.4;
  letter-spacing: 0.08em;
}

@media (max-width: 1000px) {
  .cleaning_charge_block_lead_title {
    font-size: 18px;
  }
}

/* サービス料金(モーダル) */
.clean_charge {
	border-top   : 1px solid #d9d9d9;
	margin-top   : 60px;
	padding-top  : 24px;
	margin-bottom: 104px;
	display      : none;
}

.clean_charge.visible{
	display: block;
}

.clean_charge_header {
  display        : flex;
  justify-content: flex-start;
  align-items    : center;
  flex-wrap      : wrap;
  gap            : 16px 40px;
}

.clean_charge_title {
  font-size     : 16px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
}

.clean_charge_navi {
  display        : flex;
  justify-content: flex-start;
  flex-wrap      : wrap;
  gap            : 8px;
}

.clean_charge_navi::before,
.clean_charge_navi::after{
	display: none;
}

.clean_charge_navi li {
	border        : 1px solid #d9d9d9;
	padding       : 8px;
	text-align    : center;
	border-radius : 29px;
	font-size     : 14px;
	line-height   : 1.4;
	letter-spacing: 0.08em;
	cursor        : pointer;
	width         : 71px;
}

.clean_charge_navi li:hover,
.clean_charge_navi li.current {
  border-color: #1a1a1a;
}

.clean_charge_table {
  margin-top: 24px;
  width     : 100%;
}

.clean_charge_table tr {
  border: 1px solid #d9d9d9;
}

.clean_charge_table th,
.clean_charge_table td {
  font-size     : 14px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
  border-left   : 1px solid #d9d9d9;
  vertical-align: middle;
}

.clean_charge_table th {
  background-color: #f5f5f5;
  min-width       : 212px;
  padding         : 12px 24px;
}

.clean_charge_table th:first-child {
  min-width: 472px;
}

.clean_charge_table td{
  padding: 12px 24px;
}

.clean_charge_table td[rowspan="2"]{
  padding-top   : 0;
  padding-bottom: 0;
}


.clean_charge_table .clean_charge_price {
  text-align: right;
  padding: 0 24px;
}

.clean_charge_table .clean_charge_class {
  padding-top   : 0;
  padding-bottom: 0;
  font-size     : 12px;
  line-height   : 1.6;
  letter-spacing: 0.08em;
  width         : 239px;
}

@media (max-width: 1000px) {
  .clean_charge {
    margin-top   : 32px;
    margin-bottom: 56px;
  }

  .clean_charge_wrap {
    width   : 100%;
    overflow: auto;
  }

  .clean_charge_table th,
  .clean_charge_table td {
    font-size     : 11px;
    line-height   : 1.6;
    letter-spacing: 0.08em;
  }

  .clean_charge_table th {
    min-width: 96px;
    padding  : 16px;
  }

  .clean_charge_table td{
    padding: 16px;
  }

  .clean_charge_table th:first-child {
    min-width: 230px;
  }

	.clean_charge_table .clean_charge_class{
		min-width: 96px;
	}

  .clean_charge_table .clean_charge_price {
    padding: 0 16px;
  }
}

/* よくあるお問い合わせ */
.cleaning_faq {
  font-size     : 16px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
  margin-bottom : 40px;
}

.cleaning_faq_title {
  margin-bottom : 32px;
  font-size     : 24px;
  line-height   : 1.4;
  letter-spacing: 0.08em;
}

.guide_faq_wrap {
  position    : relative;
  padding-left: 32px;
}

.guide_faq_icon {
  position   : absolute;
  left       : 0;
  top        : calc(50% - 14px);
  display    : block;
  line-height: 1;
}

@media (max-width: 1000px) {
  .cleaning_faq_title {
    font-size: 18px;
  }

  .guide_faq_icon {
    top: calc(50% - 16px);
  }
}
/* ご注意事項 */
#caution .guide_block_notice {
  color     : #555555;
  margin-top: 24px;
}

/* ゴールドウインの取り組み */
.guide_banner {
  padding        : 17px 0;
  display        : flex;
  justify-content: space-between;
  align-items    : center;
  flex-direction : row-reverse;
  border-top     : 1px solid #d9d9d9;
  border-bottom  : 1px solid #d9d9d9;
}

.guide_banner_image {
  width: 435px;
}

.guide_banner_container {
  width         : calc(100% - 435px);
  padding-right : 20px;
  font-size     : 14px;
  line-height   : 1.8;
  letter-spacing: 0.1em;
  opacity       : 0.8;
}

.guide_banner_caption {
  margin-bottom : 8px;
  font-size     : 24px;
  line-height   : 1.4;
  letter-spacing: 0.08em;
}

@media (max-width: 1000px) {
  .guide_banner {
    padding       : 0;
    flex-direction: column;
    border        : none;
    gap           : 16px 0;
  }

  .guide_banner_image {
    width: 100%;
  }

  .guide_banner_container {
    width        : 100%;
    padding-right: 0;
  }

  .guide_banner_caption {
    font-size: 18px;
  }
}