@charset "utf-8";
body {
	background: url('/images/bg01_pc.jpg') top center/ 100% 100% no-repeat;
}

@media (max-width: 767px) {
	body {
		background: url('/images/bg01_sp.jpg') top center/ 100% 100% no-repeat;
	}
}

/*-------------------------------------------

mainvisual

-------------------------------------------*/
.mainVisualArea .inner {
	padding-bottom: 50%;
}

.mainVisualArea .inner::after {
	content: '';
	position: absolute;
	right: calc(-1 * min(2.68vw, 30px));
	top: min(3.13vw, 35px);
	width: min(77.32vw, 866px);
	height: min(48.48vw, 543px);
	background: url('/images/bg02_pc.png') center/ 100% auto no-repeat;
}

.mvTop {
	position: absolute;
	left: min(8.93vw, 100px);
	top: min(18.75vw, 210px);
}

.mvTtl span:first-child {
	font-size: min(5.89vw, 66px);
	font-weight: 600;
	letter-spacing: 0.06em;
}

.mvTtl span:last-child {
	font-size: min(2.32vw,26px);
	font-weight: 700;
	letter-spacing: 0.19em;
}

.mvTxt {
	font-size: min(1.25vw, 14px);
	position: absolute;
	left: min(8.93vw, 100px);
	top: min(42.5vw, 476px);
	letter-spacing: 0.06em;
	line-height: 2.28;
}

@media (max-width: 767px) {
	.mainVisualArea .inner {
    padding-bottom: 137%;
	}

	.mvTtl span:first-child {
    font-size: min(7.73vw, 64px);
	}

	.mvTtl span:last-child {
    font-size: min(4.35vw, 36px);
	}

	.mvTxt {
    font-size: min(3.38vw, 28px);
    left: min(7.73vw, 64px);
    top: min(115.22vw, 954px);
		line-height: 2.15;
	}

	.mainVisualArea .inner::after {
    right: calc(-1 * min(32.13vw, 266px));
    top: min(10.39vw, 86px);
    width: min(155.31vw, 1286px);
    height: min(97.34vw, 806px);
    background: url('/images/bg02_sp.png') center / 100% auto no-repeat;
	}

	.mvTop {
    position: absolute;
    left: min(7.73vw, 64px);
    top: min(60.39vw, 500px);
	}
}

/*-------------------------------------------

section

-------------------------------------------*/
.btnMore {
	position: absolute;
	bottom: 0;
	max-width: min(17.86vw, 200px);
	width: 100%;
}

.btnMore a {
	display: inline-block;
	font-size: min(1.34vw, 15px);
	font-weight: 600;
	color: #004B91;
	position: relative;
	background-color: #fff;
	width: 100%;
	padding: min(1.43vw, 16px) min(2.14vw, 24px);
	border-radius: min(2.68vw, 30px);
}

.btnMore a::after {
	content: '';
	position: absolute;
	top: 50%;
	right: min(2.14vw, 24px);
	width: min(6.7vw, 75px);
	height: min(0.89vw, 10px);
	background: url('/images/ico_arrow01_pc.png') center/ 100% no-repeat;
	margin-top: calc(-1 * min(0.45vw, 5px));
}

.btnMore a:hover {
	opacity: 0.7;
}

@media (max-width: 767px) {
	.btnMore {
    max-width: min(38.16vw, 316px);
	}

	.btnMore a {
    font-size: min(2.9vw, 24px);
    padding: min(2.9vw, 24px) min(4.83vw, 40px) min(3.14vw, 26px);
    border-radius: min(6.04vw, 50px);
	}

	.btnMore a::after {
    right: min(4.83vw, 40px);
    width: min(14.01vw, 116px);
    height: min(1.45vw, 12px);
    margin-top: calc(-1 * min(0.72vw, 6px));
	}
}
/*-------------------------------------------

infoArea

-------------------------------------------*/

.infoArea {
	margin-top: min(5.36vw, 60px);
}

.infoArea .contentInner {
	padding-top: min(8.93vw, 100px);
}

.infoArea .sectionTtl {
	top: calc(-1 * min(2.14vw, 24px));
	left: calc(-1 * min(8.93vw, 100px));
}

.infoList {
	max-width: min(71.43vw, 800px);
	margin-left: auto;
	margin-right: min(7.14vw, 80px);
}

.infoList li p {
	display: flex;
	width: 100%;
	font-size: min(1.43vw, 16px);
	border-bottom: 1px solid #70B3D3;
	padding: min(2.41vw, 27px) 0;
	transition: all 0.2s ease;
	position: relative;
}

.infoList .date {
	color: #80A6C9;
	font-weight: 500;
	width: min(15.63vw, 175px);
	display: block;
	text-align: center;
}

.infoList .text {
	width: calc(100% - min(15.63vw, 175px));
}

/* @media not (max-width: 767px) {
	.infoList li p::after {
		content: '';
		width: 100%;
		height: min(1.07vw, 12px);
		background-color: rgba(255, 255, 255, 0.2);
		opacity: 0;
		transition: all 0.2s ease;
		position: absolute;
		bottom: 0;
		left: 0;
	}
	
	.infoList li p:hover:after {
		opacity: 1;
	}
} */

@media (max-width: 767px) {
	.infoArea {
    margin-top: min(18.6vw, 154px);
	}

	.infoArea .contentInner {
    padding-top: 0;
	}

	.infoArea .sectionTtl {
    top: 0;
    left: 0;
	}

	.infoArea .subTtl {
    top: min(1.45vw, 12px);
	}

	.infoArea .sectionCnt {
		margin: 0 calc(-1 * min(4.35vw, 36px))
	}

	.infoList {
    max-width: 100%;
    margin: min(3.14vw, 26px) auto 0;
	}

	.infoList li p {
    font-size: min(3.14vw, 26px);
    padding: min(3.86vw, 32px);
		flex-direction: column;
	}

	.infoList .text {
    width: 100%;
    display: block;
    margin-top: min(0.97vw, 8px);
	}
}

/*-------------------------------------------

companyArea

-------------------------------------------*/
.companyArea {
	margin-top: min(8.93vw, 100px);
}

.companyArea .contentInner {
	padding-top: min(9.64vw, 108px);
	padding-bottom: min(8.48vw, 95px);
}

.companyArea .sectionTtl {
	top: min(13.75vw, 154px);
	right: calc(-1 * min(21.7vw, 243px));
}

.companyArea .sectionCnt > .img {
	max-width: min(66.07vw, 740px);
}

.companyArea .sectionCnt > .txt {
	font-size: min(2.5vw, 28px);
	position: absolute;
	bottom: min(13.84vw, 155px);
	right: min(9.64vw, 108px);
	letter-spacing: 0.06em;
}

.companyArea .sectionCnt > .txt span:last-child {
	display: inline-block;
	margin-left: min(7.86vw, 88px);
	margin-top: min(0.45vw, 5px);
}

.companyArea .btnMore {
	right: min(5.71vw, 64px);
}

@media (max-width: 767px) {
	.companyArea {
    margin-top: min(9.66vw, 80px);
	}

	.companyArea .sectionTtl {
    top: 0;
    right: auto;
    left: 0;
	}

	.companyArea .subTtl.right {
    top: min(11.11vw, 92px);
	}

	.companyArea .sectionCnt > .img {
    max-width: min(84.54vw, 700px);
    margin-top: min(7.73vw, 64px);
		margin-left: calc(-1 * min(7.73vw, 64px))
	}

	.companyArea .contentInner {
		padding-top: min(9.64vw, 80px);
    padding-bottom: min(41.06vw, 340px);
	}

	.companyArea .sectionCnt > .txt {
    font-size: min(4.83vw, 40px);
    bottom: 0;
    right: min(13.77vw, 114px);
    writing-mode: vertical-rl;
    text-orientation: upright;
	}

	.companyArea .sectionCnt > .txt span:last-child {
    margin-left: 0;
    margin-top: min(7.73vw, 64px);
	}

	.companyArea .btnMore {
    right: auto;
    left: 0;
    bottom: min(15.94vw, 132px);
	}
}

/*-------------------------------------------

serviceArea

-------------------------------------------*/
.serviceArea {
	margin-top: min(8.93vw, 100px);
}

.serviceArea .contentInner {
	padding-top: min(8.93vw, 100px);
	padding-bottom: min(94.64vw, 1060px);
}

.serviceArea .sectionTtl {
	top: min(10.27vw, 115px);
	left: calc(-1 * min(17.32vw, 194px));
}

.serviceArea .subTtl {
	top: min(3.66vw, 41px);
}

.serviceArea .img01 {
	max-width: min(76.52vw, 857px);
	position: absolute;
	top: min(12.41vw, 139px);
	right: min(1.34vw, 15px);
}

.serviceArea .img02 {
	max-width: min(59.38vw, 665px);
	position: absolute;
	bottom: 2px;
	right: calc(-1 * min(2.23vw, 25px));
}

.serviceArea .ttl {
	position: absolute;
	bottom: min(28.75vw, 322px);
	left: 0;
	font-size: min(2.5vw, 28px);
	letter-spacing: 0.06em;
}

.serviceArea .txt {
	position: absolute;
	bottom: min(16.34vw, 183px);
	left: min(2.86vw, 32px);
	font-size: min(1.43vw, 16px);
	line-height: 2;
	letter-spacing: 0.06em;
}

.serviceArea .btnMore {
	left: min(5.71vw, 64px);
	bottom: min(2.32vw, 26px);
}

@media (max-width: 1279px) and (min-width: 768px) {
	.serviceArea .img02 {
		right: 0;
	}
}

@media (max-width: 767px) {
	.serviceArea {
    margin-top: min(9.66vw, 80px);
	}

	.serviceArea .contentInner {
    padding-top: min(6.04vw, 50px);
    padding-bottom: min(16.91vw, 140px);
	}

	.serviceArea .sectionTtl {
    top: 0;
    left: 0;
	}

	.serviceArea .subTtl {
    top: min(7.73vw, 64px);
    left: auto;
	}

	.serviceArea .txt01 {
		margin-top: min(11.59vw, 96px);
		letter-spacing: 0.15em;
	}

	.serviceArea .img01 {
    max-width: min(50.85vw, 421px);
    position: relative;
    top: auto;
    right: auto;
    margin: min(11.35vw, 94px) auto 0;
	}

	.serviceArea .img01 img:nth-child(n+2) {
		margin-top: min(7.73vw, 64px);
	}

	.serviceArea .img02 {
    max-width: min(89.98vw, 745px);
    position: relative;
    bottom: auto;
    right: auto;
    margin: min(16.91vw, 140px) calc(-1 * min(2.9vw, 24px)) 0;
	}

	.serviceArea .ttl {
    position: relative;
    bottom: auto;
    left: 0;
    font-size: min(4.35vw, 36px);
    letter-spacing: 0;
    margin-top: min(9.66vw, 80px);
	}

	.serviceArea .txt {
    position: relative;
    bottom: auto;
    left: auto;
    padding-left: min(13.29vw, 110px);
    font-size: min(3.38vw, 28px);
		margin-top: min(5.31vw, 44px);
	}

	.serviceArea .btnMore {
    left: auto;
    bottom: 0;
    right: 0;
	}
}