/***********************************************************************************************************************

about.css

***********************************************************************************************************************/
.about{

}

.about main{
	overflow: hidden;
}



/* sec *********************************/
.sec_hd{
	position: relative;
}
.sec_lead{
	padding: 8% 0 0;
}
.sec_mission{
	padding: 8% 0 0;
}
.sec_vision{
	padding: 8% 0 0;
}
.sec_value{
	padding: 8% 0 0;
}



@media screen and (max-width: 767px) {
.sec_lead{
	padding: 12% 0 0;
}
.sec_mission{
	padding: 12% 0 0;
}
.sec_vision{
	padding: 12% 0 0;
}
.sec_value{
	padding: 12% 0 0;
}
}



/* hd_main *********************************/
.hd_main{
}
.hd_main img{
	width: 100%;
	height: auto;
}
.hd_main .pc{}
.hd_main .sp{ display: none;}


p.p_hd_ttl{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 95%;
	padding: 0;
	margin: 0;
	font-size: 40px;
	font-size: clamp(20px, 4vw, 40px);
	font-weight: 600;
	color: #fff;
	text-align: center;
}
p.p_hd_ttl .en{
	display: block;
	font-size: 16px;
	font-size: clamp(14px, 1.6vw, 16px);
	line-height: 1;
}


@media screen and (max-width: 767px) {
.hd_main .pc{ display: none;}
.hd_main .sp{ display: block;}
}



/*** h1〜  **********************************/
h1.h1_ttl{
	font-size: 60px;
	font-size: clamp(30px, 6vw, 60px);
	font-weight: 900;
	text-align: center;
	margin-bottom: 0.4em;
}

h2.h2_ttl{
	font-size: 44px;
	font-size: clamp(22px, 4.4vw, 44px);
	font-weight: 800;
	line-height: 1.5em;
	margin-bottom: 0.8em;
}
h2.h2_ttl .en{
	display: block;/**/
	font-size: 30px;
	font-size: clamp(20px, 3vw, 30px);
	letter-spacing: 0.07em;
	margin-bottom: 0.4em;
}









h2.h2_about{
	font-size: 80px;
	font-size: clamp(26px, 8.5vw, 80px);
	font-weight: 900;
	line-height: 1.3em;
	text-align: center;
}
h2.h2_about .en{
	display: block;/**/
	font-size: 16px;
	font-size: clamp(14px, 1.6vw, 16px);
	line-height: 1.6em;
	color: #004da0;
	margin-bottom: 0.8em;
}

h3.h3_biz{
	font-size: 46px;
	font-size: clamp(22px, 4.6vw, 46px);
	font-weight: 700;
	color: #fff;
	line-height: 1.3em;
	margin-bottom: 0.5em;
}
h3.h3_biz .en{
	display: block;/**/
	font-size: 14px;
	font-size: clamp(12px, 1.4vw, 14px);
	line-height: 1.6em;
	margin-bottom: 0.5em;
}
h3.h3_biz .en .big{
	font-size: 160%;
}

h3.h3_ttl{
	font-size: 32px;
	font-size: clamp(22px, 3.2vw, 32px);
	font-weight: 700;
	line-height: 1.3em;
	margin-bottom: 1.2em;
}
h3.h3_ttl .big{
	font-size: 130%;
}

h4.h4_ttl{
	font-size: 26px;
	font-size: clamp(22px, 2.6vw, 26px);
	font-weight: 700;
}

p.p_lead{
	text-align: center;
}


@media screen and (max-width: 767px) {
p.p_lead{
	text-align: justify;
}
.about_box_lead p{
	text-align: justify;
}
.about_box_lead p .resp_autowrap{
	display: inline;
}
}




/*** about_box **********************************/
.about_box{
	position: relative;
}
.about_box::after{
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 76.388889%;
	height: 100%;
	background-color: #f7f7f7;
}

.about_box_lead{
	position: relative;
	z-index: 1;
	width: calc(66.6666667% - 2em);
	padding: 0 2em 2em 0;
	background-color: #fff;
}
.about_box_detail{
	position: relative;
	z-index: 1;
	width: 76.666667%;
	margin-left: auto;
	padding: 5% 0;
}


@media screen and (max-width: 767px) {
.about_box::after{
	width: 95%;
}
.about_box_lead{
	width: calc(90% - 2em);
}
.about_box_detail{
	width: 95%;
	padding: 10% 0;
}
}






/*** mission_box **********************************/
dl.mission_box{
	margin-left: 5em;
}
dl.mission_box dt{
	position: relative;
	margin-top: 1em;	
}
dl.mission_box dt::before{
	content: "";
	position: absolute;
	top: 0.5em;
	left: -4em;
	width: 3em;
	height: 3em;
	background: url("/common/img/icon_electric/icon_electric.svg") center center / contain no-repeat;
}

dl.mission_box dd{
}


/*** value_box **********************************/
dl.value_box{
	position: relative;
	margin-left: 5em;
	counter-reset: listnum; /* カウンターをリセット */
}
.sec_vision dl.value_box::after{
	content: "";
	position: absolute;
	left: -2.4em;
	top: 2%;
	width: 1px;
	height: 98%;
	background-color: #ccc;
}

dl.value_box dt{
	position: relative;
	margin-top: 1em;	
}
dl.value_box dt::before{
	counter-increment: listnum; /* counter-resetと同じ文字列 */
	content: counter(listnum); /* カウントした数に応じて番号を表示 */

	position: absolute;
	z-index: 1;
	top: 0.4em;
	left: -2.7em;
	width: 2.0em;
	height: 2.0em;
	line-height: 2.0em;
	font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-size: 14px;
	font-size: clamp(13px, 1.6vw, 14px);
  letter-spacing: normal;
  text-align: center;
  color: #fff;
  background-color: #f29600;
  border-radius: 50%;
}

.sec_vision dl.value_box dt::before{
	content: "0" counter(listnum); /* カウントした数に応じて番号を表示 0つける */
}

dl.value_box dd{
}
dl.value_box dd .subText{
	top: 0.4em;
}





/*************************************************************************************
*************************************************************************************

print

*************************************************************************************
**************************************************************************************/

@media print {

}