@charset "UTF-8";

/* companymessage ---------------------------------------*/
.companymessage {
	position: relative;
	margin-top: calc(-30 / 1440 * 100vw);
	padding: 120px 20px;
	z-index: 2;
}

.companymessage-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.companymessage-head {
	position: relative;
}

.companymessage-head { 
	display: flex;
	justify-content: space-between;
	gap: min(calc(40 / 1068 * 100%), 40px);
	margin-top: 40px;
}

.companymessage-head-image { 
	position: relative;
	width: min(calc(330 / 1068 * 100%), 330px);
	order: 2;
}

.companymessage-head-image::after { 
	position: absolute;
	top: -9%;
	right: 4%;
	z-index: 1;
	width: calc(76 / 330 * 100%);
	aspect-ratio: 76 / 95;
	background: url('../img/company/img_message_03.png') no-repeat;
	background-size: contain;
	content: '';
}

.companymessage-head-image-inner { 
	width: 100%;
	border-radius: 30px;
	overflow: hidden;
	box-shadow: 0 0 20px rgba(13, 4, 8, 0.16);
}

.companymessage-head-image-inner img { 
	width: 100%;
}

.companymessage-head-image-jobtitle { 
	margin: 10px 12px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
	text-align: right;
	letter-spacing: 0.06em;
}

.companymessage-head-image-name { 
	margin: 0 8px 0 auto;
	max-width: 170px;
}

.companymessage-head-image-name img { 
	width: 100%;
}

.companymessage-head .companymessage-summary::after {
	position: absolute;
	top: 116%;
	right: 30px;
	z-index: 1;
	width: calc(91 / 728 * 100%);
	aspect-ratio: 91 / 55;
	background: url('../img/company/img_message_04.png') no-repeat;
	background-size: contain;
	content: '';
}

.companymessage-summary { 
	position: relative;
	width: min(calc(728 / 1068 * 100%), 728px);
	height: fit-content;
	order: 1;
}

.companymessage-title { 
	margin-bottom: 18px;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0.035em;
	color: #ff9149;
}

.companymessage-body { 
	margin-top: -40px;
	padding-left: 12.5%;
}

.companymessage-body-image { 
	max-width: 366px;
	width: 100%;
	position: relative;
	margin-top: 50px;
}

.companymessage-body-image::after { 
	position: absolute;
	top: 0;
	left: -32px;
	z-index: 1;
	width: 62px;
	height: 45px;
	background: url('../img/company/img_message_07.png') no-repeat;
	background-size: contain;
	content: '';
}

.companymessage-body-image-inner { 
	width: 100%;
	border-radius: 30px;
	overflow: hidden;
	box-shadow: 0 0 20px rgba(13, 4, 8, 0.16);
}

.companymessage-body-image-inner img { 
	width: 100%;
}

.companymessage-image { 
	position: absolute;
	transform: translate(-50%, 0);
	z-index: 2;
}

.companymessage-image img { 
	width: 100%;
}

.companymessage-image-01 {
	top: 6.4%;
	left: calc(50% - 40px);
	width: min(calc(288 / 1440 * 100vw), 288px);
}
.companymessage-image-02 {
	top: 5.8%;
	left: calc(50% + 510px);
	width: min(calc(67 / 1440 * 100vw), 67px);
}
.companymessage-image-03 {
	top: 39%;
	left: calc(50% - 834px);
	width: min(calc(608 / 1440 * 100vw), 608px);
}
.companymessage-image-04 {
	top: 51%;
	left: calc(50% - 616px);
	width: min(calc(95 / 1440 * 100vw), 95px);
}
.companymessage-image-05 {
	top: 52.8%;
	left: calc(50% + 492px);
	width: min(calc(257 / 1440 * 100vw), 257px);
}
.companymessage-image-06 {
	top: 77.6%;
	left: calc(50% + 442px);
	width: min(calc(625 / 1440 * 100vw), 625px);
}
.companymessage-image-07 {
	top: 93.5%;
	left: 56.8%;
	width: min(calc(227 / 1440 * 100vw), 227px);
}


/* companyoutline ---------------------------------------*/
.companyoutline {
	position: relative;
	margin-top: calc(-30 / 1440 * 100vw);
	padding: min(calc(240 / 1440 * 100vw), 240px) 20px min(calc(210 / 1440 * 100vw), 210px);
	z-index: 2;
}

.companyoutline-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.companyoutline-head { 
	display: flex;
	margin-bottom: 100px;
}

.companyoutline-head-title {
	margin: 150px auto 0;
	width: calc(374 / 1200 * 100%);
	text-align: center;
}

.companyoutline-head-block { 
	position: relative;
	padding: 60px calc(50 / 1200 * 100%);
	width: calc(826 / 1200 * 100%);
	background: #fff;
	border-radius: 30px;
}

.companyoutline-head-block::before,
.companyoutline-head-block::after { 
	position: absolute;
	z-index: 1;
	content: '';
}

.companyoutline-head-block::before {
	bottom: 50px;
	left: -10px;
	width: calc(58 / 826 * 100%);
	aspect-ratio: 58 / 43;
	background: url('../img/company/img_company_04.png') no-repeat;
	background-size: contain;
}

.companyoutline-head-block::after {
	bottom: -40px;
	right: 40px;
	width: calc(69 / 826 * 100%);
	aspect-ratio: 69 / 161;
	background: url('../img/company/img_company_05.png') no-repeat;
	background-size: contain;
}

.companyoutline-head-list { 
	display: flex;
	flex-wrap: wrap;
}

.companyoutline-head-list dt,
.companyoutline-head-list dd { 
	font-size: 20px;
	font-weight: 500;
	line-height: 1.6;
	letter-spacing: 0.1em;
}

.companyoutline-head-list dt { 
	padding: 13px 0 13px 30px;
	width: max(calc(260 / 726 * 100%), 170px);
}
.companyoutline-head-list dd { 
	padding: 13px 30px 13px 0;
	width: calc(100% - max(calc(260 / 726 * 100%), 170px));
}
.companyoutline-head-list dt:not(:first-of-type),
.companyoutline-head-list dd:not(:first-of-type) { 
	border-top: 1px solid #959595;
}

.companyoutline-body { 
	width: 100%;
}

.companyoutline-body-map { 
	position: relative;
	width: 100%;
	height: 0;
	padding-top: calc(535 / 1200 * 100%);
	margin-bottom: 10px;
}

.companyoutline-body-map iframe { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.companyoutline-body-title {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.1em;
}

.companyoutline-body-list {
	margin-top: 50px;
	display: flex;
	flex-wrap: wrap;
	gap: 30px calc(36 / 1200 * 100%);
}

.companyoutline-body-list > li {
	width: calc(50% - calc(36 / 1200 * 100%) / 2);
}

.companyoutline-body-list-map {
	position: relative;
	width: 100%;
	height: 0;
	padding-top: calc(310 / 582 * 100%);
	margin-bottom: 10px;
}

.companyoutline-body-list-map iframe { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.companyoutline-image { 
	position: absolute;
	transform: translate(-50%, 0);
	z-index: 2;
}

.companyoutline-image img { 
	width: 100%;
}

.companyoutline-image-01 {
	top: 7.6%;
	left: calc(50% - 496px);
	width: min(calc(93 / 1440 * 100vw), 93px);
}

.companyoutline-image-02 {
	top: 3.8%;
	left: calc(50% + 400px);
	width: min(calc(217 / 1440 * 100vw), 217px);
}

.companyoutline-image-03 {
	top: 24%;
	left: calc(50% - 716px);
	width: min(calc(271 / 1440 * 100vw), 271px);
}
.companyoutline-image-04 {
	bottom: 0.8%;
	left: calc(50% - 502px);
	width: min(calc(246 / 1440 * 100vw), 246px);
}
.companyoutline-image-05 {
	bottom: 2.4%;
	left: calc(50% + 580px);
	width: min(calc(80 / 1440 * 100vw), 80px);
}


/* small pc */
@media screen and (min-width: 768px) and (max-width: 1439px) {
	.companymessage-image-02 {left: 85%;}
	.companymessage-image-03 {left: -8%;}
	.companymessage-image-04 {left: 7.2%;}
	.companymessage-image-05 {left: 84%;}
	.companymessage-image-06 {
		top: 78.6%;
		left: 80.6%;
	}

	.companyoutline-image-01 {left: 15.6%;}
	.companyoutline-image-02 {left: 77.8%;}
	.companyoutline-image-03 {left: 0.2%;}
	.companyoutline-image-04 {left: 15%;}
	.companyoutline-image-05 {left: 90.2%;}
	
}

@media screen and (min-width: 768px) and (max-width: 1000px) {
	.companymessage-head .companymessage-summary::after {
		top: 103%;
	}
	.companymessage-body {
		margin-top: 80px;
	}
	.companymessage-image-03 {
		top: 42%;
	}
}

/* sp only */
@media screen and (max-width: 767px){
	/* companymessage ---------------------------------------*/
	.companymessage {
		margin-top: calc(-30 / 375 * 100vw);
		padding: 60px 16px 150px;
	}

	.companymessage-head { 
		display: block;
		margin-top: 40px;
	}

	.companymessage-summary { 
		width: 100%;
	}

	.companymessage-title { 
		margin-bottom: 12px;
		font-size: 18px;
	}

	.companymessage-head-image { 
		width: calc(290 / 375 * 100%);
		margin: 0 0 12px auto;
	}

	.companymessage-head-image::after { 
		top: -7%;
		right: 20%;
		width: calc(42 / 290 * 100%);
	}

	.companymessage-head-image-inner { 
		border-radius: 20px;
	}

	.companymessage-head-image-jobtitle { 
		margin: 5px 4px;
		font-size: 14px;
	}

	.companymessage-head-image-name { 
		margin: 0 4px 0 auto;
		max-width: 120px;
	}

	.companymessage-head .companymessage-summary::after {
		top: 104%;
		right: 30px;
		width: calc(32 / 320 * 100%);
	}

	.companymessage-body { 
		margin-top: 120px;
		padding-left: 0;
	}

	.companymessage-body .companymessage-summary {
		display: flex;
		flex-direction: column;
	}

	.companymessage-body .companymessage-title {order: 2;}
	.companymessage-body .section-text {order: 3;}

	.companymessage-body-image { 
		max-width: unset;
		width: calc(250 / 343 * 100%);
		margin-top: 0;
		margin-bottom: 12px;
		order: 1;
	}

	.companymessage-body-image::after { 
		top: 0;
		left: -4%;
		width: calc(40 / 300 * 100%);
	}

	.companymessage-body-image-inner { 
		border-radius: 20px;
	}

	.companymessage-image-01 {
		top: 6.4%;
		left: 30%;
		width: min(calc(134 / 375 * 100vw), 180px);
	}
	.companymessage-image-02 {
		top: 2.5%;
		left: 85%;
		width: min(calc(35 / 375 * 100vw), 35px);
	}
	.companymessage-image-03 {
		top: 47.5%;
		left: calc(50% - 220px);
		width: min(calc(240 / 375 * 100vw), 240px);
	}
	.companymessage-image-04 {
		top: 48.5%;
		left: calc(50% + 30px);
		width: min(calc(50 / 375 * 100vw), 50px);
	}
	.companymessage-image-05 {
		top: 54%;
		left: 84%;
		width: min(calc(110 / 375 * 100vw), 154px);
	}
	.companymessage-image-06 {
		top: 93%;
		left: calc(50% + 80px);
		width: min(calc(310 / 375 * 100vw), 310px);
	}
	.companymessage-image-07 {
		top: 95%;
		left: calc(50% - 70px);
		width: min(calc(114 / 375 * 100vw), 114px);
	}


	/* companyoutline ---------------------------------------*/
	.companyoutline {
		margin-top: calc(-30 / 375 * 100vw);
		padding: 100px 16px 120px;
	}

	.companyoutline-head { 
		display: block;
		margin-bottom: 100px;
	}

	.companyoutline-head-title {
		margin: 0 auto 20px;
		width: unset;
	}

	.companyoutline-head-block { 
		padding: 20px;
		width: 100%;
		border-radius: 16px;
	}

	.companyoutline-head-block::before {
        bottom: 10px;
        left: 76px;
        width: 30px;
	}

	.companyoutline-head-block::after {
		bottom: -40px;
		right: -10px;
		width: calc(36 / 343 * 100%);
	}

	.companyoutline-head-list dt,
	.companyoutline-head-list dd { 
		font-size: 15px;
	}

	.companyoutline-head-list dt { 
		padding: 10px 0 10px 10px;
		width: 106px;
	}
	.companyoutline-head-list dd { 
		padding: 10px 10px 10px 0;
		width: calc(100% - 106px);
	}

	.companyoutline-body-map { 
		padding-top: calc(230 / 343 * 100%);
		margin-bottom: 6px;
	}

	.companyoutline-body-title {
		font-size: 16px;
	}

	.companyoutline-body-list {
		display: block;
		margin-top: 36px;
	}

	.companyoutline-body-list > li {
		width: 100%;
	}

	.companyoutline-body-list > li + li {
		margin-top: 36px;
	}

	.companyoutline-body-list-map {
		padding-top: calc(230 / 343 * 100%);
		margin-bottom: 10px;
	}

	.companyoutline-image-01 {
        top: 3.5%;
        left: calc(50% - 130px);
		width: min(calc(46 / 375 * 100vw), 46px);
	}

	.companyoutline-image-02 {
        top: 2%;
        left: calc(50% + 120px);
        width: min(calc(100 / 375 * 100vw), 110px);
	}

	.companyoutline-image-03 {
		top: 500px;
		left: 0;
        width: min(calc(120 / 375 * 100vw), 140px);
	}
	.companyoutline-image-04 {
		bottom: 0.8%;
		left: 18%;
		width: min(calc(120 / 375 * 100vw), 120px);
	}
	.companyoutline-image-05 {
		bottom: 2.4%;
		left: 87%;
		width: min(calc(46 / 375 * 100vw), 46px);
	}

}


/* iphone5 iphoneSE用 */
@media screen and (max-width: 370px){

}