@charset "UTF-8";
/* CSS Document */


/*--------------------------------
  Main Layout 
--------------------------------*/

#company{
	width:100%;
}
#company .main{
	width:100%;
	height:14.29vw;
	
	background:url("image/main.webp") no-repeat center top;
	background-size:cover;
	
	display:flex;
	align-items:center;
	justify-content: center;
}

#company .main h1{
	display:block;
	width:71.43vw;
	margin:0 auto;
	font-weight: 300;
    font-style: normal;
    font-size:clamp(1.2rem, 0.545rem + 3.27vw, 3rem);
    color:#FFF;
	
	text-align:left;
}

#company .uncor_block{
	display:flex;
	align-items:center;
	justify-content: center;
	
	margin: 3.57vw auto;
}
#company .uncor_block li{
	height:1.71vw;
	font-family: "Roboto", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size:clamp(0.8rem, 0.509rem + 1.45vw, 1.6rem);
	margin:0 1.79vw;
	
	list-style-type: none;
}
#company .uncor_block li a{
	color:var(--maincolor);
	display:flex;
	align-items:center;
	justify-content: center;
}

#company .uncor_block li a::after{
	content:"";
	background:url("/common/image/arrow_b.png") no-repeat right center;
	background-size:1.71vw;
	margin-left:0.71vw;
	display:inline-block;
	width:1.71vw;
	height:1.71vw;
}

.contents_block h2{
	width:71.43vw;
	display:block;
	margin:0 auto;
	
	font-size:clamp(1.5rem, 0.591rem + 4.55vw, 4rem);
	font-weight:200;
	text-align:left;
}

@media screen and (max-width:767px) {
	#company{
		width:100%;
	}
	#company .main{
		width:100%;
		height:20vh;
	}

	#company .main h1{
		width:90%;
		margin: 0 3.62vw;
	}

	#company .uncor_block{
		width:90%;
		margin: 7.25vw auto;
		justify-content: space-between;
	}
	#company .uncor_block li{
		margin:0;
	}
	#company .uncor_block li a{
	}

	#company .uncor_block li a::after{
		background-size:4.35vw;
		width:4.35vw;
		height:4.35vw;
	}

	.contents_block h2{
		width:90%;
	}
    
}

/*--------------------------------
  #outline Layout 
--------------------------------*/
#outline .contents_block{
    width:71.43vw;
	margin:0 auto;
}

#outline .contents_block table{
	width:100%;
	
	border-bottom:solid 1px #dbdbdb;
	margin-bottom:5vw;
}

#outline .contents_block td , #outline .contents_block th{
	padding:0.71vw;
	
	border-top:solid 1px #dbdbdb;
	
	font-size:clamp(0.9rem, 0.682rem + 1.09vw, 1.5rem);
	font-weight:300;
	text-align:left;
	vertical-align: top;
}
#outline .contents_block th{
	width:15.5%;
	background-color:var(--subcolor);
}
#outline .contents_block td.photo{
	border:none!important;
	width:44.5%;
	text-align:right;
	
	background:url("/info/image/build.jpg") no-repeat right -5px top;
	background-size:cover;
}
#outline .contents_block td.photo img{
	display:none;
	}

@media screen and (max-width:767px) {
	#outline .contents_block{
		width:90%;
	}

	#outline .contents_block table{
		width:100%;
	}

	#outline .contents_block td , #outline .contents_block th{
		width:100%;
		display:block;
	}
	#outline .contents_block td{
		padding-bottom:2.42vw;
	}
	#outline .contents_block th{

	}
	#outline .contents_block td.photo{
		width:100%;
		background:none;
		padding-bottom:15px;
	}
	#outline .contents_block td.photo img{
		display:block;
	}
}
/*--------------------------------
  #history Layout 
--------------------------------*/
#history #contents_area{
	background:var(--subcolor);
}
#history .contents_block {
	width:71.43%;
	margin:0 auto;
	padding:2.86vw 0;
}
#history .contents_block h2{
	border-bottom:solid 1px #dbdbdb;
}
@media screen and (max-width:767px) {
	#history #contents_area{
	}
	#history .contents_block {
		width:90%;
	}
	#history .contents_block h2{
		width:100%;
	}
}

.timeline {
    list-style: none;
	width:100%;
	/*width:910px;*/
	margin-left:auto;
	margin-top:1.43vw;
}
.timeline > li {
    margin-bottom: 60px;
}
.timeline-date{
	font-family: "Roboto", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size:clamp(1rem, 0.709rem + 1.45vw, 1.8rem);
	color:var(--maincolor);
}

/* for Desktop */
@media ( min-width : 640px ){
.timeline > li {
    overflow: hidden;
    margin: 0;
    position: relative;
	display:flex;
	justify-content: space-between;
	align-items:flex-start;
  }
.timeline-date {
    width:  6.43vw;
    float: left;
    margin-top: 26px;
	text-align:right;
	padding-right:15px;
  }
.timeline-content {
    width: 64.29vw;
    float: left;
    border-left: 1px solid var(--maincolor);
    padding: 12px 0 6px 30px;
  }
.timeline-content:before {
    content: '';
    width: 13px;
    height: 13px;
    background: var(--maincolor);
    position: absolute;
    left: 6.75vw;
    top: 34px;
    border-radius: 100%;
}
}
.timeline-content p{
	background:#FFF;
	border-radius:6px;
	padding:13px 20px;
	position: relative;
	
	font-size:clamp(0.9rem, 0.645rem + 1.27vw, 1.6rem);
}	
.timeline-content p:before{
	content:'◀︎';
	width: 13px;
    height: 13px;
	position: absolute;
    left: 6.68vw;
	left:-14px;
	color:#FFF;
}
@media screen and (max-width:767px) {
	.timeline > li {
		margin-bottom: 15px;
	}
	.timeline-content p:before{
		content:' ';
		width: 13px;
		height: 13px;
		position: absolute;
		left: initial;
		left:initial;
		color:#FFF;
	}
}
	
/*--------------------------------
  #facility Layout 
--------------------------------*/
#facility .contents_block{
	width:71.43%;
	margin:0 auto;
	padding:3.57vw 0;
	align-items:flex-start;
}
#facility .contents_block .title_box{
	width:24.4%;
	font-size:clamp(0.9rem, 0.645rem + 1.27vw, 1.6rem);
}
#facility .contents_block .title_box h2{
	margin-bottom:2.5vw;
}
#facility .contents_block .spec_box{
	width:75.6%;
}
#facility .contents_block .spec_box ul{
	width:100%;
	border-top:solid 1px #dbdbdb;
	margin-top:1.43vw;
}
#facility .contents_block .spec_box ul li{
	list-style-type: none;
	display:flex;
	justify-content: space-between;
	padding:0.71vw 0.71vw 0.71vw 2.5vw;
	border-bottom:solid 1px #dbdbdb;
	font-size:clamp(0.9rem, 0.645rem + 1.27vw, 1.6rem);
}
#facility .contents_block .spec_box .mds{
	background-color:var(--subcolor);
}
#facility .contents_block .spec_box h4{
	width:80%;
	text-aliga:left;
	font-weight:300;
}
#facility .contents_block .spec_box p{
	width:20%;
	text-align:right;
}
#facility .photo_block{
	width:100%;
	display:flex;
	overflow: hidden;
	position: relative;
}

#facility .photo_block::before {
  animation: img-wrap 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  background: #fff;
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}

@keyframes img-wrap {
  100% {
    transform: translateX(100%);
  }
}
#facility .photo_block img{
	width:16.66%;
}

@media screen and (max-width:767px) {
	#facility .contents_block{
		width:90%;
		align-items:center;
		justify-content: center;
	}
	#facility .contents_block .title_box{
		width:100%;
		display:block;
		margin-bottom:15px;
		text-align:center;
	}
	#facility .contents_block .title_box h2{
		margin:0 auto 2.5vw;
		display:block;
		text-align: center!important;
	}
	#facility .contents_block .spec_box{
		width:100%;
	}
	#facility .contents_block .spec_box ul{
		width:100%;
	}
	#facility .contents_block .spec_box li{
	}
	#facility .contents_block .spec_box .mds{
	}
	#facility .contents_block .spec_box h4{
		width:85%;
	}
	#facility .contents_block .spec_box p{
		width:15%;
	}
	#facility .photo_block{
		width:100%;
		display:flex;
		flex-wrap:wrap;
	}
	#facility .photo_block img{
		width:33.3%;
	}
	
}
/*--------------------------------
  #access Layout 
--------------------------------*/
#access .contents_block{
	width:71.43%;
	margin:0 auto;
	padding:3.57vw 0;
	align-items:flex-start;
}
#access .contents_block h2{
	width:100%;
	text-align:center;
	margin-bottom:3.57vw;
}
#access .contents_block .map{
	width:100%;
	height:37.14vw;
}
@media screen and (max-width:767px) {
	#access .contents_block{
		width:90%;
	}
	#access .contents_block h2{
	}
	#access .contents_block .map{
		width:100%;
		height:60.39vw;
	}
}