@charset "UTF-8";

section{
	background-color: #fff;
	padding-bottom: 64px;
	margin-bottom: 64px;
}

.heading_layers2_title04{
	font-size: 2rem;
}

.content_area_02 {
	margin-top: 40px;
	margin-bottom: 120px;
}

.content_area_02 .content_inner_area{
	margin-right: 0;
	margin-left: 0;
}

.list_anchor_arrow{
	align-items: normal;
	flex-direction: row;
}

.list_anchor_arrow li{
	width: calc((100% - 20px) / 2);
	flex-grow: 0;
}

.list_anchor_arrow .button_anchor_arrow_bottom{
	padding-right: 32px;
	padding-left: 32px;
}

.list_anchor_arrow .button_anchor_arrow_bottom::after{
	right: 16px;
}

.content_area_02 .title_area{
	position: relative;
	padding: 40px 24px;
	background-repeat: no-repeat;
	background-position: top center ;
	background-size: cover;
	margin-bottom: 40px;
}
.content_area_02 .cs_area .title_area{
	background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_cs_sp.jpg);
}

.content_area_02 .safety_area .title_area{
	background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_safe_sp.jpg);
}

.content_area_02 .community_area .title_area{
	background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_community_sp.jpg);
}

.content_area_02 .enbironment_area .title_area{
	background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_environment_sp.jpg);
}

.content_area_02 .es_area .title_area{
	background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_es_sp.jpg);
}

.content_area_02 .title_area .heading_layers2_title02_02{
	margin-bottom: 24px;
}

.content_area_02 .title_area .heading_layers2_title02_02 .small{
	font-size: 2rem;
}

.content_area_02 .title_area .text{
	color: #fff;
	font-size: 1.6rem;
	font-weight: bold;
	text-align: center;
}

.content_area_02 .detail_area{
	margin: 0 24px;
}

.detail_area.number_area {
	padding-top: 36px;
	padding-bottom: 40px;
	border-bottom: 1px solid #DDD;
}

.detail_area.number_area.number_first{
	padding-top: 0;
}

.detail_area.number_area:last-of-type{
	padding-bottom: 0;
	border-bottom-width: 0;
}

.detail_area.number_area .image{
	margin-top: 32px;
}

.content_area_02 .detail_area .policy_ttl{
	font-size: 2rem;
	align-items: center;
	display: flex;
	justify-content: center;
	margin-bottom: 30px;
}

.content_area_02 .detail_area .policy_ttl::before,
.content_area_02 .detail_area .policy_ttl::after{
	background-color: #DDDDDD;
	content: "";
	height: 1px;
	flex-grow: 1;
}
.content_area_02 .detail_area .policy_ttl::before {
	margin-right: 15px;
}
.content_area_02 .detail_area .policy_ttl::after {
	margin-left: 15px;
}

.content_area_02 .detail_area .heading_layers2_title05{
	font-weight: bold;
	position: relative;
	padding-left: 28px;
}
.content_area_02 .detail_area .heading_layers2_title05::before{
	content: "";
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url(/app/themes/kyoto-station-building/about/csr/img/policy_icon.svg) no-repeat center/100% auto;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

.page_bottom_button_area {
	margin: 0 24px;
}

.page_bottom_button_area .button_secondary{
	margin: 0 auto;
}

.number_area .heading_layers2_title04{
	align-items: center;
	display: flex;
	flex-direction: column;
	font-weight: bold;
	text-align: center;
	text-wrap: auto;
	gap: 8px 0;
}

.number_area .heading_layers2_title04 .number{
	font-size: 4rem;
	font-family: "Outfit", "Noto Sans JP";
	font-weight: 500;
	color: #803071;
}

.content_area_02 .detail_area .detail_txt01{
	font-size: 1.6rem;
	line-height: 1.7;
}

.content_area_02 .detail_area .column_01{
	display: flex;
	flex-direction: column;
	gap: 32px 6.366%;
}

.content_area_02 .column_02.-col3 {
  display: flex;
  justify-content: center;
  flex-direction: column;
  margin-top: 35px;
}

.content_area_02 .compliance dl {
  max-width: none;
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-inline: auto;
  margin-top: 20px;
}

.content_area_02 .compliance dl dt {
  font-size: 1.6rem;
  text-align: center;
  margin-bottom: 10px;
  flex-grow: 1;
  text-align: left;
}
.content_area_02 .compliance dl dd .btn a {
  max-width: none;
  width: 100%;
}

.content_area_02 .detail_area .note_large{
	color: #666666;
	margin-top: 16px;
}

.content_area_02 .pdf_area{
	border-top: 1px solid #DDD;
	margin-top: 40px;
	padding-top: 40px;
}

.content_area_02 .pdf_area .button_primary{
	margin-top: 16px;
}

.content_area_02 .detail_area.news_pdf_area .column_01 .image{
	margin-top: 0;
	flex-grow: 1;
}

.cs_area .detail_area.number_area .button_primary{
	margin-top: 32px;
}
.cs_area .detail_area.policy_area{
	padding-bottom: 32px;
	border-bottom: 1px solid #DDDDDD;
	margin-bottom: 36px;
}
.cs_area .summary_text_area > *{
	margin-top: 40px;
}

.detail_area .heading_layers2_title05:last-child{
	margin-bottom: 0;
}

.detail_area.number_area .sub_title{
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
	margin-bottom: 8px;
}

.detail_area.number_area .description_area{
	margin-top: 40px;
}

.detail_area.number_area .number_list{
	counter-reset: number ;
	margin-top: 32px;
}

.detail_area.number_area .number_list > li{
	font-size: 1.6rem;
	line-height: 1.7;
	margin-top: 16px;
	padding-left: 1.75em;
	text-indent: -1.75em;
}
.detail_area.number_area .number_list > li::before{
		content: counter(number) " . ";
		counter-increment: number ;
		margin-right: 0.5em;
}	

.detail_area.number_area .sub_number_list{
	margin-top: 24px;
} 

.detail_area.number_area .sub_number_list > li{
	font-size: 1.4rem;
	line-height: 1.7;
	margin-top: 8px;
	padding-left: 3.25em;
	text-indent: -3.25em;
}

.community_area .text_large + .slider_area{
	margin-top: 32px;
}

.safety_area .heading_layers2_title04,
.enbironment_area .heading_layers2_title04{
	text-align: center;
}

.enbironment_area .detail_area.policy_area{
	padding-top: 32px;
	padding-bottom: 32px;
	border-top: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;
	margin-bottom: 32px;
}

.content_area_02 .enbironment_area .detail_area .column_01{
	row-gap: 24px;
}

.enbironment_area .column_01 + .column_01{
	margin-top: 40px;
}

.column_01 .image_wrap{
	display: flex;
	gap: 16px;
	
}
.column_01 .image_wrap > *{
	width: calc((100% - 16px)/ 2);
}

.column_01 .image_wrap .text{
	font-size: 1.4rem;
	margin-top: 8px;
}

.content_area_02 .es_area .column_01{
	row-gap: 40px;
}

.es_area .list_text{
	font-weight: bold;
	font-size: 1.6rem;
}

.es_area .list_text + .list_text{
	margin-top: 16px;
}

.es_area .area_01 .text_large{
	margin-top: 16px;
}

.slider_area{
	width: 100%;
}

.detail_area .slider_area .image{
	margin-top: 0;
}

.slider_area .text_small{
	margin-top: 8px;
}
.dots_wrap{
  position: absolute;
  bottom: -24px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
}
.dots_wrap li{
  width: 6.66vw;
  max-width: 25px;
  height: 2px;
  background: #DDD;
  cursor: pointer;
}
.dots_wrap li + li{
  margin-left: 4px;
}
.dots_wrap li:hover, .dots_wrap li.slick-active{
  background: #19171D;
}
.dots_wrap li button{
  display: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  padding: 0;
  border: none;
  background-color: transparent;
}

@media not screen and (max-width: 820px){
	.heading_layers2_title04{
		font-size: 2.4rem;
	}

	.page_detail_title_area .title_content_inner{
		max-width: none;
	}

	.content_area_02{
		max-width: 1258px;
		margin-top: 64px;
		padding: 0;
	}

	.content_area_02 .title_area{
		position: relative;
		padding: 80px 5%;
	}

	.content_area_02 .cs_area .title_area{
		background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_cs.jpg);
	}
	
	.content_area_02 .safety_area .title_area{
		background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_safe.jpg);
	}
	
	.content_area_02 .community_area .title_area{
		background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_community.jpg);
	}
	
	.content_area_02 .enbironment_area .title_area{
		background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_environment.jpg);
	}
	
	.content_area_02 .es_area .title_area{
		background-image: url(/app/themes/kyoto-station-building/about/csr/img/img_title_es.jpg);
	}

	.content_area_02 .title_area .heading_layers2_title02_02{
		margin-bottom: 32px;
	}
	
	.content_area_02 .title_area .heading_layers2_title02_02 .small{
		font-size: 2.8rem;
	}
	
	.content_area_02 .title_area .text{
		font-size: 2.4rem;
	}	

	.content_area_02 .detail_area{
		margin: 0 5%;
	}

	.content_area_02 .detail_area .policy_ttl{
		font-size: 2rem;
		align-items: center;
		display: flex;
		justify-content: center;
		margin-bottom: 30px;
	}

	.content_area_02 .detail_area .policy_ttl::before,
	.content_area_02 .detail_area .policy_ttl::after{
		background-color: #DDDDDD;
		content: "";
		height: 1px;
		flex-grow: 1;
	}
	.content_area_02 .detail_area .policy_ttl::before{
		margin-right: 15px;
	}
	.content_area_02 .detail_area .policy_ttl::after{
		margin-left: 15px;
	}

	.content_area_02 .detail_area .heading_layers2_title05{
		padding-left: 33px;
	}

	.content_area_02 .detail_area .heading_layers2_title05::before{
		width: 25px;
		height: 25px;
	}

	.page_bottom_button_area .button_secondary{
		margin: 0 auto;
	}

	.number_area .heading_layers2_title04{
		flex-direction: row;
		justify-content: left;
	}

	.number_area .heading_layers2_title04 .number{
		font-size: 5rem;
		color: #803071;
		padding-right: 20px;
	}

	.detail_area.number_area .sub_title{
		font-size: 2rem;
		margin-bottom: 16px;
	}

	.detail_area.number_area .number_list > li{
		font-size: 1.8rem;
		margin-top: 24px;
	}
	
	.detail_area.number_area .sub_number_list > li{
		font-size: 1.6rem;
	}

	.content_area_02 .detail_area .detail_txt01{
		font-size: 1.8rem;
	}

	.content_area_02 .detail_area .column_01{
		flex-direction: row;
	}

	.content_area_02 .detail_area .column_01 .area_01{
		width: calc((100% - 6.366%) / 2);
	}
	.content_area_02 .safety_area .detail_area .column_01 .area_01{
		width: 61.892%;
	}

	.content_area_02 .detail_area .column_01 .area_02{
		flex-grow: 1;
	}
  
  .content_area_02 .column_02.-col3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 80px;
  }

  .content_area_02 .compliance dl {
    max-width: 320px;
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .content_area_02 .compliance dl dt {
    font-size: 1.6rem;
    text-align: center;
    margin-bottom: 20px;
    flex-grow: 1;
  }
  .content_area_02 .compliance dl dd .btn {
    max-width: 320px;
  }
  
  .content_area_02 .compliance dl dd .btn a {
    max-width: 320px;
    width: 100%;
  }

	.content_area_02 .pdf_area{
		margin-top: 64px;
	}

	.content_area_02 .pdf_area .text_large{
		text-align: center;
	}

	.content_area_02 .pdf_area .button_primary{
		margin:32px auto 0;
	}

	.detail_area .heading_layers2_title05{
		text-align: left;
		max-width: 650px;
		margin-right: auto;
		margin-left: auto;
	}
	.cs_area .detail_area{
		padding-top: 40px;
		padding-bottom: 64px;
	}
	.content_area_02 .cs_area .detail_area.news_pdf_area .column_01 .area_01 p{
		margin-top: 0;
	}
	.cs_area .detail_area.policy_area{
		margin-bottom: 54px;
		padding-top: 0;
	}
	.safety_area .heading_layers2_title04,
	.enbironment_area .heading_layers2_title04 {
		text-align: left;
	}

	.enbironment_area .detail_area.policy_area{
		padding-top: 64px;
		padding-bottom: 64px;
		margin-bottom: 64px;
	}

	.enbironment_area .column_01 + .column_01{
		margin-top: 64px;
	}

	.column_01 .image_wrap .text{
		margin-top: 16px;
	}

	.column_01 .image_wrap{
		gap: 9.615%;
		
	}
	.column_01 .image_wrap > *{
		width: calc((100% - 9.615%)/ 2);
	}

	.es_area .title_area {
		margin-bottom: 80px;
	}

	.es_area .list_text{
		font-size: 2rem;
	}
	
	.es_area .list_text + .list_text{
		margin-top: 24px;
	}

	.community_area .text_large + .slider_area{
		margin-top: 40px;
	}

	.slider_area .slider_inner{
		display: flex;
		gap: 0 4.598%;
	}

	.slider_area .slider_inner .item{
		width: calc((100% - (4.598% * 3)) / 4);
	}
	
	.detail_area .slider_area .image{
		margin-top: 0;
	}
	
	.slider_area .text_small{
		margin-top: 16px;
	}
}