@charset "UTF-8";


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

	company

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


#page_header{
	background-image: url('../images/company/head_image.jpg');
}


#outline .outline_ul{
	border-top: 1px solid #ccc;
}

#outline .outline_ul li{
	padding: 14px 0;
	border-bottom: 1px solid #ccc;
	display: flex;
}

#outline .outline_ul li .item{
	width: 280px;
	font-size: 22px;
	font-weight: 600;
	color: var(--color2);
	letter-spacing: 0.2em;
}

#outline .outline_ul li .data{
	width: calc(100% - 160px);
	padding-top: 6px;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.04em;
}



#busines{

}

#busines .business_ul{
	counter-reset: num01 0;
}

#busines .business_ul li{
	margin-bottom: 80px;
}

#busines .business_ul li:last-child{
	margin-bottom: 0;
}

#busines .business_ul li .li_title{
	font-size: 28px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.6;
	margin-bottom: 36px;
	padding-left: 170px;
	position: relative;
	border-bottom: 1px solid var(--color2);
}

#busines .business_ul li .li_title small{
	font-size: 70px;
    font-weight: 600;
    color: #e6edf4;
    position: absolute;
    top: -40px;
    right: 0;
    z-index: -1;
}

#busines .business_ul li .li_title::before{
	counter-increment: num01 1;
	content: 'STEP' counter(num01) '';
	font-family: "Nunito", sans-serif;
	font-size: 48px;
	color: var(--color1);
    position: absolute;
    top	: -20px;
    left: 0;
}

#busines .business_ul li .flex_wrapp{
	display: flex;
}

#busines .business_ul li .flex_wrapp .image_block{
	width: 300px;
	height: 180px;
	border-radius: 8px;
	box-shadow: 2px 2px 8px -5px #777777;
	overflow: hidden;
}

#busines .business_ul li .flex_wrapp .image_block img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#busines .business_ul li .flex_wrapp .text_block{
	width: calc(100% - 300px);
	padding-left: 30px;
	box-sizing: border-box;
}



#message{

}

#message .message_caption{
	margin-bottom: 40px;
}

#message .message_caption p{
	line-height: 2.0;
	text-indent: 1em;
}

#message .name_block{
	text-align: right;
}

#message .name_block .sign{
	display: inline-block;
	width: 136px;
	margin-bottom: 8px;
}

#message .name_block .name{
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.2em;
}

#message .name_block .name small{
	font-size: 14px;
	font-weight: 600;
	margin-right: 1em;
}





/********************************************************************************
	リッキド用 CSS
********************************************************************************/

@media(max-width:1320px){


#outline .outline_ul li{
	padding: 1.060606vw 0;
}

#outline .outline_ul li .item{
	width: 12.121212vw;
	font-size: 1.666667vw;
}

#outline .outline_ul li .data{
	width: calc(100% - 12.121212vw);
	padding-top: 0.454545vw;
	font-size: 1.212121vw;
}



#busines{

}

#busines .business_ul li{
	margin-bottom: 6.060606vw;
}

#busines .business_ul li .li_title{
	font-size: 2.121212vw;
	margin-bottom: 2.727273vw;
	padding-left: 12.878788vw;
}

#busines .business_ul li .li_title small{
	font-size: 5.303030vw;
    top: -3.030303vw;
}

#busines .business_ul li .li_title::before{
	font-size: 3.636364vw;
    top	: -1.5151526vw;
}

#busines .business_ul li .flex_wrapp .image_block{
	width: 22.727273vw;
	height: 13.636364vw;
	border-radius: 0.606061vw;
	box-shadow: 0.151515vw 0.151515vw 0.606061vw -0.378788vw #777777;
}

#busines .business_ul li .flex_wrapp .text_block{
	width: calc(100% - 22.727273vw);
	padding-left: 2.272727vw;
}



#message{

}

#message .message_caption{
	margin-bottom: 3.030303vw;
}

#message .name_block .sign{
	width: 10.30303vw;
	margin-bottom: 0.606061vw;
}

#message .name_block .name{
	font-size: 1.363636vw;
}

#message .name_block .name small{
	font-size: 1.060606vw;
}




}


/********************************************************************************
	スマートフォン用 CSS
********************************************************************************/

@media(max-width:480px){


#outline .outline_ul li{
	padding: 3.2vw 0;
	display: block;
}

#outline .outline_ul li .item{
	width: auto;
	font-size: 4.8vw;
	margin-bottom: 1.6vw;
}

#outline .outline_ul li .data{
	width: auto;
	padding-top: 0;
	font-size: 4.266667vw;
}



#busines{

}

#busines .business_ul{

}

#busines .business_ul li{
	margin-bottom: 16vw;
}


#busines .business_ul li .li_title{
	font-size: 5.333333vw;
	margin-bottom: 9.6vw;
	padding: 8vw 0 0;
}

#busines .business_ul li .li_title small{
	font-size: 9.066667vw;
    top: -3.2vw;
}

#busines .business_ul li .li_title::before{
	font-size: 5.333333vw;
    top	: 0;
}

#busines .business_ul li .flex_wrapp{
	display: block;
}

#busines .business_ul li .flex_wrapp .image_block{
	width: 74.666667vw;
	height: 45.333333vw;
	border-radius: 1.6vw;
	box-shadow: 0.533333vw 0.533333vw 2.133333vw -1.333333vw #777777;
	margin: 0 auto 6.4vw;
}

#busines .business_ul li .flex_wrapp .text_block{
	width: auto;
	padding-left: 0;
}



#message{

}

#message .message_caption{
	margin-bottom: 8vw;
}

#message .name_block .sign{
	width: 34.666667vw;
	margin-bottom: 1.6vw;
}

#message .name_block .name{
	font-size: 4.266667vw;
	line-height: 1.4;
}

#message .name_block .name small{
	font-size: 3.2vw;
	margin-right: 0;
}





}