
/* ==========================================================================
   Index
========================================================================== */
#company #message .container-fluid > .row:not(:last-of-type) {
	margin-bottom: 90px; }

#company #message .row .txtBox {
	margin: 0 auto 0 5%; }
#company #message .row.reserve .txtBox {
	margin: 0 5% 0 auto; }

#company #message .row .imgBox {
	width: 95%;
	margin: 0 5% 0 0; }
#company #message .row.reserve .imgBox {
	margin: 0 0 0 5%; }



#company #vision .bannerlist .txtBox p {
	max-width: 46rem;
	margin-top: 30px;
	margin-bottom: 60px;
	padding: 60px;
	background-color: #FFF; }

#company #vision .bannerlist .imgBox {
	position: absolute;
	height: 450px; }
#company #vision .bannerlist li:nth-of-type(even) .imgBox {
	right: 0; }

#company #vision .bannerlist .headline {
	align-items: flex-start;
    text-align: left; }
#company #vision .bannerlist .headline .script {
	margin: 0 -4rem -2rem;
	padding: 0 4rem; }
#company #vision .bannerlist .headline .script::before {
  	right: 14%; }

@keyframes border-anim {
    0%   { width: 0; }
    100% { width: 72%; }
}

#company #vision .bannerlist li:nth-of-type(odd) .txtBox {
	margin: 60px 2.5% 0 auto; }
#company #vision .bannerlist li:nth-of-type(odd) .headline {
	color: #FFF;
	transform: translateX(-60px); }
#company #vision .bannerlist li:nth-of-type(odd) .script {
	color: #262c38; }

#company #vision .bannerlist li:nth-of-type(even) .txtBox {
	margin: 60px auto 0 2.5%; }
#company #vision .bannerlist li:nth-of-type(even) .headline {
	transform: translateX(60px); }
#company #vision .bannerlist li:nth-of-type(even) .script {
	color: #FFF; }

#company #vision .bannerlist #service .script {
	font-size: 1.4em; }
#company #vision .bannerlist #assortment .script {
	font-size: .9em; }
#company #vision .bannerlist #partner .script {
	font-size: 1.375em; }


/* ==========================================================================
   About
========================================================================== */

#about #profile {
	margin-top: 140px; }

#about .entry__content td {
    padding: 1.5em 2em 1.5em 6em; }


/* ==========================================================================
   History
========================================================================== */
#history #timeline::before {
	content: '';
	display: block;
	width: 50%;
	height: 100%;
	background-color: #f2f2f2;
	position: absolute;
	top: 0;
	right: 0; }

#history #timeline li {
	display: flex;
	align-items: center;
	padding: 30px 15px 30px calc(50% - 5.25rem); }

#history #timeline li figure.right-img {
	transform: translateX(7.5rem); }
#history #timeline li figure.left-img {
	transform: translateX(-44rem); }

#history #timeline li figure.right-img::before,
#history #timeline li figure.left-img::before {
	content: '';
	display: block;
	width: 120px;
	height: 1px;
	background-color: #808080;
	position: absolute;
	top: 50%;
	transform: translateY(-50%); }
#history #timeline li figure.right-img::before {
	right: 100%; }
#history #timeline li figure.left-img::before {
	left: 100%; }

#history #timeline li figure.right-img::after,
#history #timeline li figure.left-img::after {
	content: '';
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background-color: #808080;
	position: absolute;
	top: 50%;
	transform: translateY(-50%); }
#history #timeline li figure.right-img::after {
	right: calc(100% + 118px); }
#history #timeline li figure.left-img::after {
	left: calc(100% + 118px); }

#history #timeline li figure figcaption {
	position: absolute; }

#history #timeline li .cont {
	margin-left: 3rem; }

#history #timeline li.last {
	display: block;
	text-align: center;
	margin-top: 90px;
	padding-left: 0; }
#history #timeline li.last .cont {
	margin: 5px 0; }


/* ==========================================================================
   Benefit
========================================================================== */
#benefit .card .imgBox {
  height: 370px; }

