@charset "utf-8";
.technology h3{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	border : 1px solid #00769D;
	line-height : 1;
	color : #00769D;
	font-size : 22px;
	font-weight : bold;
	margin-bottom : 50px;
	padding : 20px 1.5em;
}
.technology .container{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	margin-bottom : 50px;
}
.technology .container:last-of-type{
	margin-bottom : 0;
}
.technology .container h4{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	line-height : 1;
	color : #00769D;
	font-size : 20px;
	padding-bottom : 15px;
	margin-bottom : 20px;
}
.technology .container h4::before{
	content : "";
	position : absolute;
	display : block;
	width : 100%;
	height : auto;
	border-bottom : 1px solid #00769D;
	top : auto;
	right : auto;
	bottom : 0;
	left : 0;
	margin : auto auto;
}
.technology .container h4::after{
	content : "";
	position : absolute;
	display : block;
	width : 20%;
	height : auto;
	border-bottom : 5px solid #00769D;
	top : auto;
	right : auto;
	bottom : 0;
	left : 0;
	margin : auto auto;
}
.technology .container .flex{
	position : relative;
	display : flex;
	flex-wrap : wrap;
	justify-content : space-between;
	width : 100%;
	height : auto;
}

.technology .container .flex .box-left{
	position : relative;
	display : block;
	width : 65%;
	height : auto;
}
.technology .container .flex .box-left figure{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.technology .container .flex .box-left figure img{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.technology .container .flex .box-left p{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	text-align : justify;
	margin-bottom : 3px;
}
.technology .container .flex .box-right{
	position : relative;
	display : block;
	width : 30%;
	height : auto;
}
.technology .container .flex .box-right figure{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.technology .container .flex .box-right figure img{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
}
.technology .container .flex .box-right p{
	position : relative;
	display : block;
	width : 100%;
	height : auto;
	margin-top : 20px;
}
.technology .container .flex .box-right a{
	position : relative;
	display : block;
	width : fit-content;
	height : auto;
	color : #00769D;
	font-size : 16px;
	font-weight : bold;
	margin : 0 0 0 auto;
	padding-right : 1.2em;
}
.technology .container .flex .box-right a:after{
	content : "";
	position : absolute;
	display : block;
	width : 14px;
	height : 14px;
	background : url(../../images/common/arrow_b.png)center / cover no-repeat;
	top : 0;
	right : 0;
	bottom : 0;
	left : auto;
	margin : auto auto;
}
/* # =================================================================
#### responsive
# ================================================================= */
/* # =================================================================
#### 1200px
# ================================================================= */
@media screen and (max-width: 1200px){

}/*** 1200px ***/
/* # =================================================================
#### 1024px
# ================================================================= */
@media screen and (max-width: 1024px){

}/*** 1024px ***/
/* # =================================================================
#### 896px
# ================================================================= */
@media screen and (max-width: 896px){
.technology .content02{
	margin-bottom : 100px;
}
.technology h3{
	font-size : 20px;
	padding : 15px;
}
.technology .container h4{
	font-size : 18px;
}
}/*** 896px ***/
/* # =================================================================
#### 600px
# ================================================================= */
@media screen and (max-width: 600px){
.technology .container .flex .box-left{
	width : 100%;
	margin-bottom : 30px;
}
.technology .container .flex .box-left p{
	margin-bottom : 15px;
}
.technology .container .flex .box-left figure{
	width : 400px;
	max-width : 80%;
	margin : 0 auto;
}
.technology .container .flex .box-right{
	width : 100%;
}
.technology .container .flex .box-right figure{
	width : 300px;
	max-width : 75%;
	margin : 0 auto;
}



}/*** 600px ***/
/* # =================================================================
#### 480px
# ================================================================= */
@media screen and (max-width: 480px){

}/*** 480px ***/
/* # =================================================================
#### 320px
# ================================================================= */
@media screen and (max-width: 320px){

}/*** 320px ***/