@charset "UTF-8";
/* #mainImg 下層ページ
================================================ */
/*  #company
================================================ */
/* mainimg */
body:before { position: fixed; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; background: #262626 url(../img/company/mainimg01_sp.png) no-repeat; background-size: 100% auto; content: ''; }

@media screen and (min-width: 600px) { body:before { z-index: -1; background-image: url(../img/company/mainimg01_pc.png); background-size: 1920px; background-position: top center; min-width: 1520px; } }

/* mask sp */
@media screen and (max-width: 599px) { #bg, #gFooter { position: relative; z-index: 2; }
  #contents { position: relative; z-index: 0; }
  #contents:before { position: absolute; content: ''; top: -109px; left: 0; width: 100%; height: 100%; background: url(../img/common/bg_contents01_sp.png) no-repeat top right; background-size: 100% auto; z-index: 0; }
  #contents:after { position: absolute; content: ''; top: 400px; left: 0; width: 100%; height: 100%; background: #262626; background-size: contain; z-index: 0; } }

/* mask pc */
@media screen and (min-width: 600px) { #bg { position: relative; background: #262626; }
  #bg:before { content: ""; position: absolute; top: -253px; height: 675px; width: 1920px; display: block; left: 50%; padding: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); background: url(../img/common/bg_contents01_pc.png) no-repeat top center; background-size: cover; z-index: 0; } }

/*  #parallax01
================================================ */
#parallax01 { position: absolute; bottom: -255px; width: 100%; height: 552px; overflow: hidden; z-index: 0; }

#parallax01 .inner { width: 100%; height: 100%; background: url(../img/company/bg_parallax01.png) center; background-size: cover; background-attachment: fixed; position: relative; }

#parallax01 .inner:before { content: ''; background: #262626; -webkit-transform: skewY(30deg); -webkit-transform-origin: left top; -ms-transform: skewY(30deg); transform: skewY(30deg); -ms-transform-origin: left top; transform-origin: left top; width: 100%; height: 216px; position: absolute; top: -216px; right: 0; }

#parallax01 .inner:after { content: ''; background: #262626; -webkit-transform: skewY(30deg); -webkit-transform-origin: right bottom; -ms-transform: skewY(30deg); transform: skewY(30deg); -ms-transform-origin: right bottom; transform-origin: right bottom; width: 100%; height: 216px; position: absolute; bottom: -216px; left: 0; }

@media screen and (min-width: 600px) { #parallax01 { top: 770px; bottom: auto; height: 1949px; }
  #parallax01 .inner { max-width: 1920px; margin: 0 auto; }
  #parallax01 .inner:before { height: 1109px; top: -1109px; }
  #parallax01 .inner:after { height: 1109px; bottom: -1109px; } }

/*  #about
================================================ */
#about { color: #fff; padding-bottom: 50px; position: relative; }

#about .inner { position: relative; z-index: 1; }

#about .table { margin-top: 21px; border-top: 1px solid #3c3c3c; position: relative; z-index: 2; }

#about .table th, #about .table td { border-bottom: 1px solid #3c3c3c; font-size: 1.5rem; padding: 14px 0; vertical-align: top; line-height: 1.8; letter-spacing: .06em; }

#about .table th { font-weight: bold; width: 103px; }

#about dl + dl { margin-top: 5px; }

#about dt, #about dd { display: inline-block; }

#about dt { padding-right: 10px; }

#about .table td > a:hover { text-decoration: underline; }

#about .base .tit { font-weight: bold; color: #a7a7a7; }

#about .base .list { border-bottom: 1px solid #3c3c3c; padding-bottom: 15px; margin-bottom: 13px; }

#about .base .list:last-of-type { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }

@media screen and (min-width: 600px) { #about { padding-bottom: 106px; position: relative; top: -14px; }
  #about .table { width: 940px; margin: 65px auto 0; }
  #about .table th, #about .table td { font-size: 1.6rem; padding: 18px 0 22px; box-sizing: border-box; padding-left: 30px; line-height: 1.85; }
  #about .table th { width: 250px; }
  #about .base .list { padding: 0 0 23px 30px; margin: 0 0 18px -30px; }
  #about .base .list:last-of-type { border-bottom: 0; } }

/*  #history
================================================ */
#history { padding: 39px 0 50px 0; color: #fff; background: rgba(0, 0, 0, 0.3); position: relative; z-index: 3; }

#history .list { position: relative; padding-top: 19px; margin-top: 21px; }

#history .list:before { content: ''; background: #fff; width: 1px; height: 100%; position: absolute; top: 0; left: 10px; z-index: 2; }

#history .list dt, #history .list dd { padding-left: 39px; }

#history .list dt { position: relative; font-weight: 600; color: #a7a7a7; font-size: 1.8rem; letter-spacing: .1em; }

#history .list dt:after { content: ''; background: #fff; width: 9px; height: 9px; position: absolute; top: 10px; left: 6px; border-radius: 50%; }

#history .list dt:before { content: ''; background: #4f6127; width: 21px; height: 21px; position: absolute; top: 4px; left: 0; border-radius: 50%; }

#history .list dd { font-size: 1.5rem; line-height: 1.8; padding-bottom: 20px; letter-spacing: .06em; }

@media screen and (min-width: 600px) { #history { padding: 102px 0 120px; }
  #history .list { width: 940px; margin: 64px auto 0; padding: 36px 0 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  #history .list:before { left: 12px; }
  #history .list dt, #history .list dd { padding-left: 0; letter-spacing: .06em; }
  #history .list dt { font-size: 2rem; padding-left: 44px; width: 124px; letter-spacing: .1em; }
  #history .list dt:after { width: 11px; height: 11px; top: 11px; left: 7px; }
  #history .list dt:before { width: 25px; height: 25px; top: 4px; left: 0; }
  #history .list dd { font-size: 1.6rem; width: 772px; padding: 1px 0 31px; } }

	#about .map {
		position: relative;
		margin-top: 5px;
		box-sizing: border-box;
		width: 100%;
		height: 0;
		padding-top: 60%;
	}
	#about .map iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	@media all and (min-width: 600px) {
		#about .map { margin-top: 10px; padding-top: 42%; }
	}