@CHARSET "UTF-8";

/* COMMON */
main#contents{
	width:100%;
	margin:0;
	padding:0;
	max-width:none;}

/* SECTION */
section{
	margin:0!important;
	padding:60px 20px 80px;
	background-position:center;
	background-size:cover;
	position:relative;
	z-index:4;}
@media only screen and (min-width:768px){
	section{
		padding:90px 20px 110px;}
}
@media only screen and (min-width:1024px){
	section{
		padding:120px 20px 140px;}
}

/* SECTION HEADING */
.section-heading{
	margin:0 0 30px;}
.section-title{
	margin:0;
	font-size:60px;
	text-align:center;
	line-height:1;
	color:var(--primary-color);
	font-family:"Oswald", sans-serif;}
.section-sub{
	display:table;
	font-size:18px;
	margin:auto!important;
	padding:0 0 0 20px;
	font-weight:500;
	position:relative;}
.section-sub::after{
	content:'';
	position:absolute;
	margin:auto;
	top:0.2em;
	bottom:0;
	left:0;
	width:12px;
	height:12px;
	background:var(--sub-color);
	transform:rotate(45deg);}
@media only screen and (min-width:768px){
	.section-title{
		text-align:left;}
	.section-sub{
		margin:0!important;}
	.section-heading{
		margin:0 0 40px;}
	.section-title{
		font-size:90px;}
	.section-sub{
		font-size:28px;}
}
@media only screen and (min-width:1024px){
	.section-heading{
		margin:0 0 50px;}
	.section-title{
		font-size:120px;}
	.section-sub{
		font-size:36px;}
}

/* MAINIMG */
.mainimg *{
	margin:0;
	padding:0;}
.mainimg .slide figure{
	display:block;
	width:100%;
	height:100%;}
.mainimg{
	width:100%;
	position:relative;
	overflow:hidden;}
.mainimg .image{
	position:relative;}
.mainimg .slide{
	position:absolute;
	inset:0;
	opacity:0;
	transition:opacity 1s;
	overflow:hidden;}
.mainimg .img1{
	position:relative;
	width:100%;
	height:auto;}
.mainimg .slide img{
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:center;
	transform:scale(1);
	transform-origin:center;
	will-change:transform;}
.mainimg .slide.zoom img{
	transform:scale(1.07);}
.mainimg .mainimg-shape{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	z-index:1;
	pointer-events:none;}
.mainimg .text{
	position:absolute;
	top:30%;
	left:0;
	bottom:0;
	margin:auto;
	width:50%;
	height:35%;
	z-index:2;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	gap:1rem;
	padding-left:5vw;}
.mainimg .text h2{
	font-weight:normal;
	font-size:max(22px, 3vw);
	font-weight:bold;
	line-height:1.5;
	margin:0 0 30px;
	color:var(--primary-color);}
.mainimg .text h2::before{
	display:none;}
.mainimg .map{
	display:block;
	margin:0 auto;
	width:80%;}
.mainimg .text p{
	font-family:"Oswald", sans-serif;
	line-height:1.4;
	font-weight:500;
	font-size:32px;}
.mainimg .slide-indicators{
	z-index:3;
	width:100%;}
.mainimg .indicator{
	display:inline-block;
	width:5em;
	height:0.2em;
	background:var(--primary-color);
	margin:0 5px;
	cursor:pointer;}
.mainimg .indicator.active{
	background:var(--sub-color);}
.scroll-image{
	position:relative;
	width:100%;
	height:125px;
	display:flex;
	align-items:end;}
.scroll-image::after{
	content:'';
	position:absolute;
	bottom:0;
	left:0;
	width:1px;
	height:100%;
	background:var(--primary-color);}
.scroll-image span{
	color:var(--primary-color);
	transform:rotate(270deg);
	margin:0 0 5px;}
@media only screen and (max-width:767px){
	.mainimg{
		display:flex;
		flex-direction:column-reverse;
		margin:10px 0 0;}
	.mainimg .text h2{
		margin:0 0 10px;}
	.mainimg .text p{
		font-size:20px;}
	.mainimg .mainimg-shape{
		display:none;}
	.mainimg .text{
		position:relative;
		width:100%;
		padding:30px 20px;
		align-items:center;
		text-align:center;}
	.scroll-image{
		position:absolute;
		bottom:0;
		left:15px;}
}
@media (min-width:768px) and (max-width:1023px){
	.mainimg .text{
		height:30%;}
}

/* DECORATION */
.decoration-img{
	display:none;}
@media only screen and (min-width:768px){
	.decoration-img{
		display:inline;
		position:absolute;
		left:0;
		top:35.8333vw;
		width:58.3333vw;
		height:auto;
		max-width:700px;
		height:auto;
		z-index:2;}
}
@media only screen and (min-width:1024px){
	.decoration-img{
		max-width:1000px;}
}

/* COMPANY */
#company{
	background:linear-gradient(0deg,rgba(232, 232, 232, 1) 0%, rgba(232, 232, 232, 0.15) 70%, rgba(255, 255, 255, 0) 100%)}
#company .section-button{
	margin:30px auto 0;}
.company-img{
	border-radius:15px;
	margin:0 0 30px;
	border-radius:15px;
	margin:0 0 30px;
	background-position:center;
	background-size:cover;}
.company-img img{
	border-radius:15px;
	width:100%;
	object-fit:cover;}
.company-links{
	list-style:none;}
.company-btn{
	border-bottom:1px solid #e0e0e0;
	font-size:20px;
	line-height:1.6;
	font-weight:bold;}
.company-btn a{
	position:relative;
	padding:10px 40px 10px 0;
	display:block;}
.company-btn a::before{
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:10px;
	margin:auto;
	width:30px;
	height:30px;
	transition:0.4s;
	background-image:url(/dcms_media/other/blue_arrow.svg);
	background-size:contain;
	background-position:center;}
.company-btn a:hover::before{
	right:0;}
.company-sub{
	display:block;
	font-size:12px;
	color:#A4A4A4;
	font-family:"Oswald", sans-serif;
	font-weight:normal;}
@media only screen and (min-width:768px){
	#company .section-button{
		width:50%;
		margin:40px 0 0 auto;}
	#company .section-button a{
		margin:0 0 0 auto;}
	.company-grid{
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:30px;
		align-items:center;}
	.company-links{
		height:100%;
		display:flex;
		flex-direction:column;
		justify-content:space-around;}
	.company-img{
		height:100%;
		margin:0;}
	.company-img img{
		display:none;}
	.company-btn a{
		padding:20px 60px 20px 0;
		display:flex;
		align-items:center;
		font-size:24px;}
	.company-btn a::before{
		right:20px;
		width:35px;
		height:35px;}
	.company-sub{
		margin:0 0 0 20px;
		font-size:14px;}
}
@media only screen and (min-width:1024px){
	#company .section-button{
		margin:60px 0 0 auto;}
	.company-grid{
		gap:40px;}
	.company-btn a{
		padding:25px 60px 25px 0;}
	.company-sub{
		margin:0 0 0 30px;
		font-size:14px;}
}

/* BUSINESS */
#business{
	background-position:top;
	background-image:url(/dcms_media/image/business_bg.webp);}
.business-grid{
	margin:35px 0 0;}
.business-card{
	position:relative;
	margin:0 0 20px;}
.business-card:last-child{
	margin:0;}
.business-card::after{
	content:'';
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:50%;
	border-radius:0 0 15px 15px;
	background:linear-gradient(0deg,rgba(56, 56, 56, 1) 0%, rgba(56, 56, 56, 0.5) 50%, rgba(158, 158, 158, 0) 100%);}
.business-card:hover .business-card-overlay::before{
	right:10px;}
.business-card-overlay{
	position:absolute;
	width:100%;
	bottom:0;
	left:0;
	box-sizing:border-box;
	padding:20px 60px 20px 20px;
	z-index:2;}
.business-card-overlay::before{
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:20px;
	margin:auto;
	width:30px;
	height:30px;
	transition:0.4s;
	background-image:url(/dcms_media/other/arrow.svg);
	background-size:contain;
	background-position:center;}
.business-img img{
	width:100%;
	border-radius:15px;}
.business-card-overlay p{
	color:var(--primary-inverse-color);}
.business-title{
	font-size:20px;
	font-weight:bold;
	margin:0;}
.business-sub{
	font-size:12px;}
.business-link{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:2;}
.business-hidden{
	display:none;}
@media only screen and (min-width:768px){
	.business-grid{
		margin:70px 0 0;}
	.business-card-overlay::before{
		width:40px;
		height:40px;}
	.business-grid{
		display:flex;
		align-items:center;
		gap:20px;}
	.business-card{
		width:100%;
		max-height:240px;
		margin:0;}
	.business-img img{
		height:240px;
		object-fit:cover;
		object-position:top;}
}
@media only screen and (min-width:1024px){
	.business-grid{
		gap:40px;}
}

/* RECRUIT */
#recruit{
	background-position:top;
	background-image:url(/dcms_media/image/recruit_bg.webp);}
#recruit img{
	border-radius:15px;}
#recruit .section-button{
	margin:30px 0 0;}
.recruit-grid{
	margin:0 0 50px;}
.recruit-text{
	margin:0 0 40px;}
.recruit-text h3{
	text-align:center;
	font-size:24px;
	margin:0 0 10px;
	line-height:1.5em;}
.recruit-grid{
	margin:0 0 50px;}
.recruit-bottom-images figure{
	margin:0 0 20px;}
.recruit-bottom-images figure:last-child{
	margin:0;}
@media only screen and (min-width:768px){
	#recruit .section-button{
		margin:35px 0 0;}
	#recruit .section-button a{
		margin:0;}
	.recruit-grid{
		margin:0 0 65px;
		display:flex;
		flex-wrap:wrap;
		align-items:end;}
	.recruit-text,
	.recruit-images-right{
		width:calc(50% - 20px);}
	.recruit-text{
		margin:0 20px 0 0;}
	.recruit-text h3{
		font-size:30px;
		text-align:left;
		margin:0 0 20px;}
	.recruit-images-right{
		margin:0 0 0 20px;}
	.recruit-bottom-images{
		display:flex;
		flex-wrap:wrap;
		align-items:center;}
	.recruit-bottom-images figure{
		width:calc(50% - 20px);}
	.recruit-bottom-images figure:nth-child(odd){
		margin:0 20px 0 0;}
	.recruit-bottom-images figure:nth-child(even){
		margin:0 0 0 20px;}
}
@media only screen and (min-width:1024px){
	#recruit .section-button{
		margin:40px 0 0;}
	.recruit-grid{
		margin:0 0 80px;}
	.recruit-text,
	.recruit-images-right{
		width:calc(50% - 40px);}
	.recruit-text{
		margin:0 40px 0 0;}
	.recruit-text h3{
		font-size:36px;
		margin:0 0 30px;}
	.recruit-images-right{
		margin:0 0 0 40px;}
	.recruit-bottom-images figure{
		width:calc(50% - 40px);}
	.recruit-bottom-images figure:nth-child(odd){
		margin:0 40px 0 0;}
	.recruit-bottom-images figure:nth-child(even){
		margin:0 0 0 40px;}
}

/* NEWS */
#news{
	background-image:url(/dcms_media/image/news_bg.webp);}
#news .section-title{
	text-align:center;}
#news .section-sub{
	margin:auto!important;}
.news-list{
	max-width:600px;
	margin:auto;}
#news .swiper-wrapper{
	display:block;}
#news .lib-media__item{
	padding:20px 0;
	border-bottom:1px solid #c6c6c6;}
#news .lib-media__thumb,
#news .lib-swiper__control,
#news .lib-media__tag,
#news .lib-media__txt{
	display:none;}
#news .lib-media__txtarea{
	display:flex;
	flex-direction:revert;
	align-items:center;
	flex-wrap:wrap;
	padding:0;}
#news .lib-media__category{
	margin:0 0 0 10px;
	order:2;}
#news .lib-media__title,
#news .lib-media__time p time,
#news .badge.lib-badge__category{
	font-size:1rem;}
#news .lib-media__title{
	font-weight:normal;
	margin:10px 0 0!important;
	order:3;
	width:100%;}
#news .lib-media__title a{
	color:#000;
	display:block;}
#news .lib-media__time,
#news .lib-media__time p{
	margin:0;
	order:1;}
#news .lib-media__time p:last-child{
	display:none;}
#news .lib-media__time p span{
	display:none;}
#news .badge.lib-badge__category{
	background:var(--light-color);
	color:var(--primary-color);
	border:none;
	width:6rem;
	text-align:center;}
.news-btn a{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	text-decoration:none;
	border-radius:5px;
	background:linear-gradient(90deg, rgba(0, 31, 107, 1) 0%, rgba(11, 80, 148, 1) 100%);
	color:var(--primary-inverse-color);
	margin:40px auto 0;
	padding:0.4rem 2rem 0.4rem 1em !important;
	max-width:250px;
	height:45px;}
.news-btn a::after{
	content:'';
	position:absolute;
	top:0;
	bottom:0;
	right:15px;
	margin:auto;
	width:24px;
	height:24px;
	background-image:url(/dcms_media/other/arrow.svg);
	background-size:contain;
	background-position:center;}
@media only screen and (min-width:768px){
	#news .lib-media__category{
		margin:0 10px;}
	#news .lib-media__title{
		margin:0!important;
		width:auto;}
	.news-btn a{
		margin:60px auto 0;
		max-width:400px;
		height:65px;
		border-radius:12px;}
}