@charset "utf-8";
@import "common.css";

/*-----------------------------------------------
	business
-----------------------------------------------*/
/* top */
.top{
	background:url(/assets/img/business/img_top.jpg) center top no-repeat;
}
@media only screen and (min-width:1400px){
	.top{
		background-size:cover;
	}
}
@media only screen and (max-width:767px){
	.top{
		background-size:cover;
	}
}

/* top */
#main article .top .inner{
	max-width:1020px;
	margin:0 auto;
	padding-top:80px;
	color:#fff;
	text-align:center;
}
#main article .top h2{
	margin-bottom:44px;
	font-weight:bold;
	font-size:32px;
	line-height:50px;
}

/* figure */
.figure{
	width:100%;
	margin-bottom:38px;
	padding:83px 0 52px;
	background:url(/assets/img/technology/bg_figure.jpg) center top no-repeat;
}
.figure figure{
	position:relative;
	width:910px;
	margin:0 auto;

	text-align:center;
}
.figure img{
	margin-left:8px;
}
.figure li{
	position:absolute;
	max-width:270px;
	min-width:195px;
	padding:15px 14px 12px;
	border-radius:6px;
	box-shadow:16px 10px 10px rgba(103,200,207,0.16);
	background-color:rgba(255,255,255,0.8);
	font-size:16px;
	line-height:18px;
	text-align:center;
}
.figure .mgt1{
	top:-70px;
	left:550px;
	color:#f39100;
}
.figure .mgt2{
	top:60px;
	left:650px;
	color:#00abcd;
}
.figure .mgt3{
	top:392px;
	left:630px;
	color:#007e9e;
}
.figure .mgt4{
	top:400px;
	right:632px;
	color:#699a03;
}
.figure .mgt5{
	top:104px;
	right:690px;
	color:#eb3a3d;
}
@media only screen and (min-width:1400px){
	.figure{
		background-size:cover;
	}
}
@media only screen and (max-width:767px){
	.figure{
		margin-bottom:28px;
		padding:85px 0 60px;
		background-size:cover;
	}
	.figure figure{
		width:320px;
	}
	.figure img{
		width:302px;
		max-width:100%;
		height:auto;
		margin-left:4px;
	}
	.figure li{
		max-width:142px;
		min-width:87px;
		padding:7px;
		border-radius:4px;
		box-shadow:0 10px 10px rgba(103,200,207,0.16);
		background-color:rgba(255,255,255,0.8);
		font-size:10px;
		line-height:13px;
	}
	.figure .mgt1{
		top:-70px;
		left:120px;
	}
	.figure .mgt2{
		top:-44px;
		right:10px;
		left:inherit;
	}
	.figure .mgt3{
		top:inherit;
		right:10px;
		bottom:-26px;
		left:inherit;
	}
	.figure .mgt4{
		top:inherit;
		right:inherit;
		bottom:-48px;
		left:25px;
	}
	.figure .mgt5{
		top:-54px;
		right:inherit;
		left:10px;
	}
}

/* contents */
.contents{
	text-align:center;
}
.contents .section{
	max-width:1400px;
	margin:0 auto 80px;
}
.contents h4{
	font-size: 33px;
	line-height:36px;
	font-weight: normal;
	margin-bottom: 15px;
	padding-bottom: 20px;
	position: relative;
	text-align:center;
}
.contents .sub{
	color:#EB8D00;
	font-size:16px;
	font-weight:bold;
	margin-bottom: 26px;
	text-align:center;
}
.contents p{
	margin-bottom:24px;
	font-size:16px;
	line-height:28px;
}
.business-info{
	padding-top: 63px;
}
.section .img{
	display:flex;
}
.section .img figure{
	/*width:50%;*/
}
.txt-block{
	width:960px;
	margin:0 auto 0;
}
.section.research .img figure{
	width:100%;
}
.section .img figcaption{
	width:100%;
	font-size:14px;
	line-height:26px;
	text-align:center;
}
.section .img > figure:first-of-type > figcaption{
	float:right;
}
.section .img > figure:last-of-type > figcaption{
	padding-left:48px;
}
.section.research .img > figure > figcaption{
	float:none;
	width:950px;
	margin:0 auto;
	padding-left:0;
}
.business_box{
	position: relative;
	margin: 50px 0 35px;
    /* max-width: 950px; */
	max-width: 1024px;
    margin-left: auto;
    margin-right: auto;
}
.business_box>ul{
	--bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
}
.business_box>ul>li{
    margin-bottom: 30px;
    flex: 0 0 auto;
    width: 33.33333333%;
}
.business_box>ul>li>a{
	padding: 15px;
    display: block;
	cursor: pointer;
}
.business_box .b_title{
	font-size: 20px;
    line-height: 20px;
    font-weight: bold;
    margin-bottom: 10px;
    text-align: center;
}
.business_box .b_subtitle{
	color: #EB8D00;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 16px;
    text-align: center;
}
.business_box .b_paragraph{
    font-size: 14px;
    margin-bottom: 16px;
}
.business_box .b_paragraph b{
    font-size: 15px;
}
.business_box img{
	width: 100%;
	max-width: 100%;
}
.business_box br{
	display: block !important;
}
.modal_scroll{
    overflow-y: scroll;
    height: 85vh !important;
}
/* モーダル */
.business_box .b_modal{
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	display: none;
	z-index: 1055;
	overflow-x: hidden;
	overflow-y: auto;
}
.business_box .b_modal .modal_bg {
    background: rgba(0, 0, 0, 0.8);
    height: 100vh;
    position: absolute;
    width: 100%;
}
.business_box .b_modal .modal_content{
	max-width: 1024px;
	background: #fff;
	background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 0px 5px #00000029;
    left: 50%;
    padding: 40px;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 60%;
    text-align: left;
}
.business_box .b_modal .modal_content>div{
	position: relative;
}
.business_box .b_modal .modal_content .modal_close{
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
}
.business_box .b_modal .modal_content>ul{
	--bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
	justify-content: center;
}
.business_box .b_modal .modal_content>ul>li{
    margin-bottom: 10px;
	padding: 0 5px;
    flex: 0 0 auto;
    width: 50%;
}
@media only screen and (max-width:767px){
	.contents .section{
		margin-bottom:100px;
	}
	.contents .section:last-of-type{
		margin-bottom: 90px;
	}
	.contents h4{
		margin-bottom:4px;
		padding:0 14px;
		font-size:20px;
		line-height:30px;
	}
	.contents p{
		margin-bottom:4px;
		padding:0 14px;
		font-size:11px;
		line-height:18px;
	}
	.contents p br{
		display:none;
	}
	.section .img{
		display:block;
	}
	.section .img figure{
		position:relative;
		width:100%;
		height:250px;
	}
	.section .img figure img{
		position:absolute;
		top:0;
		left:50%;
		width:auto;
		height:225px;
		transform:translateX(-50%);
	}
	.section .img figcaption,
	.section.research .img > figure > figcaption{
		position:absolute;
		bottom:0;
		left:0;
		width:100%;
		padding:0 14px 4px;
		font-size:10px;
		line-height:18px;
		text-align:center;
	}
	.section .img > figure:first-of-type > figcaption{
		float:none;
	}
	.section .img > figure:last-of-type > figcaption{
		padding-left:0;
	}
	.txt-block{
		width:100%;
    }
	.business_box>ul>li{
		padding: 5px;
		margin-bottom: 10px;
    	width: 100%;
	}
	.business_box .b_modal .modal_content{
		padding: 40px 15px;
		width: 80%;
		overflow-y: scroll;
    	height: 85vh;
	}
	.business_box .b_modal .modal_content>ul>li{
		width: 100%;
	}
}