header,
footer {
  width: 100%;
  background: linear-gradient(160deg, #f1f1f1 0%, white 55%); }

	header::after {
		content: "";
		height: 2px;
		display: block;
		background: -webkit-linear-gradient(left, #b50014 0%, #bf0017 20%, #cf001b 45%, #ca0a23 50%, #bd2539 55%, #a8525d 65%, #8c8c8d 70%, #fccb00 95%);
		background: -o-linear-gradient(left, #b50014 0%, #bf0017 20%, #cf001b 45%, #ca0a23 50%, #bd2539 55%, #a8525d 65%, #8c8c8d 70%, #fccb00 95%);
		background: linear-gradient(to right, #b50014 0%, #bf0017 20%, #cf001b 45%, #ca0a23 50%, #bd2539 55%, #a8525d 65%, #8c8c8d 70%, #fccb00 95%); }

	footer::before {
		content: "";
		height: 2px;
		display: block;
		background: -webkit-linear-gradient(left, #b50014 0%, #bf0017 20%, #cf001b 45%, #ca0a23 50%, #bd2539 55%, #a8525d 65%, #8c8c8d 70%, #fccb00 95%);
		background: -o-linear-gradient(left, #b50014 0%, #bf0017 20%, #cf001b 45%, #ca0a23 50%, #bd2539 55%, #a8525d 65%, #8c8c8d 70%, #fccb00 95%);
		background: linear-gradient(to right, #b50014 0%, #bf0017 20%, #cf001b 45%, #ca0a23 50%, #bd2539 55%, #a8525d 65%, #8c8c8d 70%, #fccb00 95%); }

	header .holdings,
	footer .holdings {
		max-width: 930px;
		margin: 0 auto;
		padding: 25px 0 15px 0;
		
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	header .holdings h1,
	footer .holdings h1{
		padding-bottom: 30px;
	}
	header .holdings h1 p:nth-child(1),
	footer .holdings h1 p:nth-child(1){
		font-size: 15px;
		letter-spacing: 0.047rem;
		font-weight: 200;
		margin-bottom: 18px;
	}
	header .holdings h1 p:nth-child(2),
	footer .holdings h1 p:nth-child(2){
		max-width: 530px;
	}
	header .holdings .brandlogo,
	footer .holdings .brandlogo {
		max-width: 280px;
	}

main {
  width: 100%;
  padding: 0; }
	
	main section.kv { position: relative; }
	main section.kv .logo {
		position: absolute;
		top: 38%;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%); }
	main section.kv .logo p:nth-child(1) { width: 295px; margin: 0 auto; }
	main section.kv .logo p:nth-child(2) { width: 315px; margin: 0 auto; }
	main section.kv .visual {
		width:100%; }

.Contents {
  width: 100%;
  text-align: center; }
  .Contents .Contents__Inner {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px; }

	section.message {
	}
		section.message .message-column {
			display: flex;
			justify-content: space-between;
			align-items: top;
			padding: 120px 0 70px 0;
		}
			section.message .message-column h2 {
				font-size: 24px;
				line-height: 68px;
				text-align: left;
				font-weight: 200;
				letter-spacing: 0.05rem;
			}
			section.message .message-column p {
				font-size: 15px;
				line-height: 30px;
				text-align: left;
				padding-top: 15px;
			}
		section.message .career {
			padding: 0 0 80px 0;
		}
		section.message .career ul li {
			display: flex;
			justify-content: flex-end;
			align-items: center;
		}
		section.message .career ul li p.txt {
			text-align: right;
			font-size: 11px;
			line-height: 18px;
		}
		section.message .career ul li p.txt.indent01 {
		}
			section.message .career ul li p.txt.indent01 span:first-child {
				letter-spacing: 0.1rem;
				margin-right: -0.1rem;
				text-align: right;
				display: inline-block;
			}
			section.message .career ul li p.txt.indent01 span:nth-child(2) {
			}
			section.message .career ul li p.txt.indent02 span:first-child {
				letter-spacing: 0.017rem;
				margin-right: -0.017rem;
				text-align: right;
				display: inline-block;
			}
			section.message .career ul li p.txt.indent02 span:nth-child(2) {
			}
		section.message .career ul li p.txt.indent02 {
		}
		section.message .career ul li p.name {
			width: 215px;
		}

	section.information {
		width: 100%;
	}
		section.information h3 {
			font-size: 12px;
			border-bottom: 1px solid #001764;
			text-align: left;
			padding-bottom: 5px;
			font-weight: 200;
		}
		section.information .company01,
		section.information .company02 {
			display: flex;
			justify-content: space-between;
			align-items: top;
			margin: 60px 0 0 60px;
			padding-bottom: 60px;
		}
		section.information .company01 {
			border-bottom: 1px solid #c8c8c8;
		}
			section.information .company01 .info-name,
			section.information .company02 .info-name {
				display: block;
				text-align: left;
				font-size: 14px;
				width: 40%;
			}
			section.information .company01 .info-table,
			section.information .company02 .info-table {
				border-collapse: collapse;
				text-align: left;
				font-size: 12px;
				line-height: 12px;
				width: 60%;
			}
			section.information .company01 .info-table th,
			section.information .company02 .info-table th {
				padding: 0 20px 15px 0;
				font-weight: 200;
			}
			section.information .company01 .info-table td,
			section.information .company02 .info-table td {
				padding-bottom: 15px;
			}

	section.navArea {
		border-top: 1px solid #001764;
		padding: 28px 0 25px 0;
		
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
		section.navArea .area-Contact,
		section.navArea .area-About {
			width: 50%;
			text-align: center;
		}
			section.navArea .area-Contact h4,
			section.navArea .area-About h4 {
				width: 120px;
				margin: 0 auto 15px auto;
			}
			section.navArea .area-Contact ul li,
			section.navArea .area-About ul li {
				font-size: 11px;
				margin-bottom: 20px;
			}
			section.navArea .area-Contact ul li a,
			section.navArea .area-About ul li a {
					border: 2px solid #b4b4b4;
				border-radius: 100vh;
				width: 55%;
				margin: 0 auto;
				display: block;
				padding: 5px 0;
				position: relative;
			}
				section.navArea .area-About ul li a {
					color: #959596;
				}
			section.navArea .area-Contact ul li a::after,
			section.navArea .area-About ul li a::after {
				content: "";
				background-image: url(../images/btn-arrow.svg);
				background-repeat: no-repeat;
				position: absolute;
				right: 3px;
				width: 16px;
				height: 16px;
			}



@media only screen and (max-width:1000px) {
	main section.kv .logo {
		width: calc(100vw * 300 / 1000);
	}
	main section.kv .logo p:nth-child(1) { width: 95%; }
	main section.kv .logo p:nth-child(2) { width: 100%; }
	
	.Contents .Contents__Inner {
		padding: 0 .5rem;
		max-width: 940px;
	}
	
	header .holdings, footer .holdings{
		padding: 25px .3rem 15px .35rem;
	}
		header .holdings h1, footer .holdings h1 {
			width: calc(100vw* 540 / 930);
		}
		header .holdings h1 p:nth-child(1), footer .holdings h1 p:nth-child(1) {
			font-size: .15rem;
		}
		header .holdings .brandlogo, footer .holdings .brandlogo {
			width: calc(100vw* 280 / 930);
		}
		header .holdings h1 p:nth-child(2), footer .holdings h1 p:nth-child(2) {
			line-height: 0;
		}
	
	section.message .message-column {
		padding: 1.2rem 0 .7rem 0;
	}
		section.message .message-column h2 {
			font-size: .3rem;
			line-height: .8rem;
		}
		section.message .message-column p {
			font-size: .18rem;
			line-height: .36rem;
			padding-top: .15rem;
		}
		section.message .career {
			padding: 0 0 .8rem 0;
		}
		section.message .career ul li p.txt {
			font-size: .14rem;
			line-height: .24rem;
		}
	
	section.information .company01, section.information .company02 {
		margin: .6rem 0 0 0;
		padding-bottom: .6rem;
	}
	section.information .company01 .info-name, section.information .company02 .info-name {
		font-size: .18rem;
		width: 35%;
		line-height: .16rem;
	}
	section.information .company01 .info-table, section.information .company02 .info-table {
		font-size: .16rem;
		line-height: .16rem;
		width: 65%;
	}
}

@media only screen and (max-width: 768px) {
    header .holdings h1 p:nth-child(1), footer .holdings h1 p:nth-child(1) {
        font-size: .2rem;
        margin-bottom: .2rem;
    }
	header .holdings, footer .holdings {
        padding: .25rem .3rem .15rem .35rem;
    }
		header .holdings h1, footer .holdings h1 {
			padding-bottom: .3rem;
		}
	section.message .message-column {
        padding: 1.0rem 0 .7rem 0;
        display: block;
    }
	    section.message .message-column h2 {
			font-size: .50rem;
			line-height: 1.2rem;
		}
	    section.message .message-column p {
			font-size: .30rem;
			line-height: .68rem;
			padding-top: .3rem;
		}
	section.message .career {
		padding: 0 0 1.1rem 0;
	}
	    section.message .career ul li p.txt {
			font-size: .24rem;
			line-height: .34rem;
		}
	section.information h3 {
		font-size: .26rem;
		padding-bottom: .05rem;
	}
	section.information .company01, section.information .company02 {
        display: block;
    }
		section.information .company01 .info-name, section.information .company02 .info-name {
			font-size: .28rem;
			line-height: .26rem;
			width: 100%;
			margin-bottom: .7rem;
		}
	    section.information .company01 .info-table, section.information .company02 .info-table {
			font-size: .25rem;
			line-height: .24rem;
			width: 100%;
		}
	section.navArea {
		padding: .6rem 0 .4rem 0;
		display: block;
	}
	section.navArea .area-Contact {
		margin-bottom: .6rem;
	}
	section.navArea .area-Contact, section.navArea .area-About {
		width: 100%;
	}
		section.navArea .area-Contact h4, section.navArea .area-About h4 {
			width: 2.6rem;
			margin: 0 auto .3rem auto;
		}
		section.navArea .area-Contact ul li, section.navArea .area-About ul li {
			font-size: .26rem;
			margin-bottom: .35rem;
		}
		section.navArea .area-Contact ul li a, section.navArea .area-About ul li a {
			width: 80%;
			padding: .24rem 0;
		}
		section.navArea .area-Contact ul li a::after, section.navArea .area-About ul li a::after {
			right: .2rem;
			width: .32rem;
			height: .32rem;
		}
}
