@charset "utf-8";

/* 메인 시작
------------------------------------------------------ */
.indexWr { 
	padding-top:0;
}
.indexWr header {
	background:rgba(255,255,255,.4);
	border-bottom-color:#FFF;
}
.mBnrWr {
	position:relative;
	padding:56.25% 0 0;
	font-size: 0;
	overflow: hidden;
}
.mBnrWr .mBnrSwipe {
	position:absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
}
.mBnrWr .mBnrSwipe img { 
	width: 100%;
}
.mBnrWr .mBnrSlideTxt {
	position:absolute; 
	bottom: 40px;
	left: 100%;
	font-weight: 300;
	font-size: 203px;
	color: rgba(255,255,255,.4);
	white-space:nowrap;
	z-index: 1;
}
.mBnrWr .mBnrPage { 
	position:absolute; 
	bottom: 40px;
	font-size: 0;
	text-align: center;
	z-index: 1;
}
.mBnrWr .mBnrPage .swiper-pagination-bullet { 
	width: 28px;
	height: 6px;
	margin:0 12px;
	background: rgba(255,255,255,.8);
	border-radius: 0;
}
.mBnrWr .mBnrPage .swiper-pagination-bullet-active { 
	background: #E82D2D;
}
.mIntroWr { 
	padding:120px 0;
}
.mIntroWr .conBox { 
	display:flex;
	align-items:center;
	gap:170px;
	margin:0 0 240px;
}
.mIntroWr .conBox:nth-child(even) { 
	flex-direction:row-reverse;
}
.mIntroWr .conBox:last-child { 
	margin:0;
}
.mIntroWr .imgBox { 
	font-size: 0;
}
.mIntroWr .imgBox img { 
	max-width: 100%;	
}
.mIntroWr .txtBox { 
	flex-shrink:0;
}
.mIntroWr .tit01 { 
	position:relative;
	display:inline-block;
	margin:0 0 33px;
	padding:10px 0 0;
	font-weight: 400;
	font-style: italic;
	font-size: 20px;
	color: #E82D2D;
}
.mIntroWr .tit01:before { 
	content:"";
	position:absolute;
	box-sizing:border-box;
	display:block;
	width: calc(100% + 4px);
	height: 1px;
	top: 0;
	left: 0;
	background: #E82D2D;
}
.mIntroWr .tit02 { 
	margin:0 0 34px;
	font-weight: 700;
	font-size: 28px;
	color: #212121;
}
.mIntroWr .tit02 span { 
	display:block;
	margin:0 0 15px;
	font-weight: 500;
	font-size: 20px;
}
.mIntroWr .txt01 { 
	font-size: 18px;
	line-height: 1.6;
	color: #424242;
}
.mIntroWr .lst01 li { 
	margin:0 0 9px;
}
.mIntroWr .lst01 li:last-child { 
	margin:0;
}
.mIntroWr .lst01 .lstTit01 { 
	position:relative;
	margin:0 0 9px;
	padding:0 0 0 28px;
	font-weight: 700;
	font-size: 18px;
	color: #424242;
}
.mIntroWr .lst01 .lstTit01:before { 
	content:"";
	position:absolute;
	box-sizing:border-box;
	display:block;
	width: 16px;
	height: 2px;
	top: 10px;
	left: 0;
	background: #E82D2D;
}
.mIntroWr .lst01 .lstTxt01 { 
	font-size: 18px;
	line-height: 1.6;
	color: #424242;
}
@media all and (max-width:999px){
	.indexWr { 
		padding:56px 0 0;
	}
	.indexWr header {
		background: #FFF;
		border-bottom-color:#F0F0F0;
	}
	.mBnrWr .mBnrSlideTxt { 
		bottom: 16px;
		font-size: 40px;
	}
	.mBnrWr .mBnrPage { 
		bottom: 12px;
	}
	.mBnrWr .mBnrPage .swiper-pagination-bullet { 
		width: 16px;
		height: 4px;
		margin:0 4px;
	}
	.mIntroWr { 
		padding:36px 0;
	}
	.mIntroWr .conBox { 
		flex-wrap:wrap;
		gap:16px;
		margin:0 0 36px;
	}
	.mIntroWr .imgBox,
	.mIntroWr .imgBox img,
	.mIntroWr .txtBox { 
		width: 100%;
	}
	.mIntroWr .tit01 {
		margin:0 0 10px;
		padding:6px 0 0;
		font-size: 13px;
	}
	.mIntroWr .tit02 { 
		margin:0 0 16px;
		font-size: 16px;
	}
	.mIntroWr .tit02 span { 
		margin:0 0 2px;
		font-size: 13px;
	}
	.mIntroWr .txt01 { 
		font-size: 14px;
		line-height: 1.3;
	}
	.mIntroWr .txt01 br { 
		display:none;
	}
	.mIntroWr .lst01 li {
		margin:0 0 6px;
	}
	.mIntroWr .lst01 .lstTit01 {
		margin:0 0 4px;
		padding:0 0 0 16px;
		font-size: 14px;
	}
	.mIntroWr .lst01 .lstTit01:before {
		width: 10px;
		top: 7px;
	}
	.mIntroWr .lst01 .lstTxt01 { 
		font-size: 14px;
		line-height: 1.3;
	}	
}
/* 메인 끝
------------------------------------------------------ */
/* about 시작
------------------------------------------------------ */
.aboutWr .aboutBox01 { 
	position:relative;
	min-height: 638px;
	padding:0 0 0 707px;
}
.aboutWr .aboutBox01 .imgBox { 
	position:absolute; 
	top: 0;
	left: 0;
	font-size: 0;
}
.aboutWr .aboutBox01 .imgBox img { 
	max-width: 100%;
}
.aboutWr .aboutBox01 .tit01 { 
	margin:0 0 35px;
	font-weight: 600;
	font-size: 28px;
	color: #212121;
}
.aboutWr .aboutBox01 .tit01 span { 
	display:block;
	margin:0 0 16px;
	font-weight: 500;
	font-size: 20px;
}
.aboutWr .aboutBox01 .txt01 { 
	font-size: 18px;
	line-height: 1.6;
	color: #424242;
}
.aboutWr .aboutBox01 .txt01 + .txt01 { 
	margin-top:30px;
}
@media all and (max-width:999px){
	.aboutWr .aboutBox01 {
		min-height: 0;
		padding:0;
	}
	.aboutWr .aboutBox01 .imgBox { 
		position:relative;
		width: 100%;
		top: auto;
		left: auto;
		margin:0 0 16px;
	}
	.aboutWr .aboutBox01 .imgBox img { 
		width: 100%;
	}
	.aboutWr .aboutBox01 .tit01 { 
		margin:0 0 16px;
		font-size: 16px;
	}
	.aboutWr .aboutBox01 .tit01 span { 
		margin:0 0 2px;
		font-size: 13px;
	}
	.aboutWr .aboutBox01 .txt01 { 
		font-size: 14px;
		line-height: 1.3;
	}
	.aboutWr .aboutBox01 .txt01 + .txt01 { 
		margin-top:10px;
	}
}
/* about 끝
------------------------------------------------------ */
/* 포트폴리오 시작
------------------------------------------------------ */
.portfolioWr .pfLst01 li { 
	margin:0 0 80px;
}
.portfolioWr .pfLst01 li:last-child { 
	margin:0;
}
.portfolioWr .pfLst01 .lstLnk01 {
	position:relative;
	display:flex;
	align-items:center; 
	justify-content:center;
	padding:56.29% 0 0;
	text-align: center;
	font-size: 0;
	overflow: hidden;
}
.portfolioWr .pfLst01 .lstLnk01:before { 
	content:"";
	position:absolute;
	box-sizing:border-box;
	display:block;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(33,33,33,.3);
	z-index: 2;
}
.portfolioWr .pfLst01 .lstLnk01 img {	
	position:absolute; 
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
	z-index: 1;
}
.portfolioWr .pfLst01 .lnkTxtBox01 { 
	position:absolute;
	display:block;
	width: 100%;
	top: 50%;
	left: 0;
	padding:0 16px;
	transform:translateY(-50%);
	z-index: 2;
}
.portfolioWr .pfLst01 .lnkTit01 {
	display:block;
	margin:0 0 17px;
	font-size: 20px;
	color: #FFF;
	transition:all .3s ease;
}
.portfolioWr .pfLst01 .lnkTit02 {
	display:block;
	margin:0 0 43px;
	font-weight: 600;
	font-size: 28px;
	color: #FFF;
	transition:all .3s ease;
}
.portfolioWr .pfLst01 .lnkBtn { 
	position:relative;
	display:inline-block;
	padding:14px 58px 14px 24px;
	border:1px solid #FFF;
	border-radius: 5px;
	font-size: 20px;
	color: #FFF;
	transition:all .3s ease;
	overflow: hidden;
}
.portfolioWr .pfLst01 .lnkBtn:after {
	content:"";
	position:absolute;
	box-sizing:border-box;
	display:block;
	width: 20px;
	height: 10px;
	top: 22px;
	right: 25px;
	background:url(/Form/_guest/basic/images/pfArrow01.svg) no-repeat center / cover;
	transition:all .3s ease;
}
.portfolioWr .pfLst01 .lstLnk01:focus .lnkBtn,
.portfolioWr .pfLst01 .lstLnk01:hover .lnkBtn { 
	padding:14px 24px;
	background: #FFF;
	color: #424242;
}
.portfolioWr .pfLst01 .lstLnk01:focus .lnkBtn:after,
.portfolioWr .pfLst01 .lstLnk01:hover .lnkBtn:after { 
	right: -20px;
}
@media all and (max-width:999px){
	.portfolioWr .pfLst01 li { 
		margin:0 0 16px;
	}
	.portfolioWr .pfLst01 .lnkTit01 { 
		margin:0 0 2px;
		font-size: 13px;
	}
	.portfolioWr .pfLst01 .lnkTit02 { 
		margin:0 0 8px;
		font-size: 16px;
	}
	.portfolioWr .pfLst01 .lnkBtn { 
		padding:6px 28px 6px 12px;
		font-size: 13px;
	}
	.portfolioWr .pfLst01 .lnkBtn:after {
		width: 14px;
		height: 7px;
		top: 10px;
		right: 6px;
	}
	.portfolioWr .pfLst01 .lstLnk01:focus .lnkBtn,
	.portfolioWr .pfLst01 .lstLnk01:hover .lnkBtn { 
		padding:6px 12px;
	}
}
/* 포트폴리오 끝
------------------------------------------------------ */
/* CONTACT 시작
------------------------------------------------------ */
.contactWr .cttBox01 { 
	max-width: 1343px;
	margin:0 auto;
}
.contactWr .cttFormBox01 { 
	display:flex;
	align-items:flex-start;
	gap:120px;
}
.contactWr .cttFormBox01 .iptBox01 { 
	flex-shrink:0;
	width: 420px;
}
.contactWr .cttFormBox01 .iptTit01 { 
	display:block;
	margin:0 0 8px;
	font-weight: 500;
	font-size: 18px;
	color: #212121;
}
.contactWr .cttFormBox01 .iptTit01 .pnt01 { 
	color: #F83636;
}
.contactWr .cttFormBox01 * + .iptTit01 { 
	margin-top:22px;
}
.contactWr .cttFormBox01 .ipt01 {
	padding:14px 25px 13px;
	background: #FAFAFA;
	border-bottom:1px solid #212121;
	font-size: 15px;
	color: #212121;
}
.contactWr .cttFormBox01 .ipt01::placeholder { 
	color: #797979;
}
.contactWr .cttFormBox01 select.ipt01 { 
	padding-right:50px;
	appearance: none;
	background-image: url(/Form/_guest/basic/images/contactSel01.svg);
	background-repeat:no-repeat;
	background-position:center right 28px;
}
.contactWr .cttFormBox01 .ipt01.fullWid { 
	width: 100%;
}
.contactWr .cttFormBox01 .callBox01 { 
	display:flex;
	align-items:center;
	gap:12px;
	width: 100%;
}
.contactWr .cttFormBox01 .callBox01 .midBar { 
	flex-shrink:0;
	display:block;
	width: 4px;
	height: 1px;
	background: #797979;
}
.contactWr .cttFormBox01 .callBox01 .ipt01 { 
	flex-grow:1;
}
.contactWr .cttFormBox01 .iptBtmBox01 {
	margin:24px 0 0;	
}
.contactWr .cttFormBox01 .btnSubmit {
	position:relative; 
	display:inline-block;
	padding:14px 58px 14px 24px;
	background:#212121;
	border:1px solid #212121;
	border-radius: 5px;
	font-size: 20px;
	color: #FFF;
	transition:all .3s ease;
}
.contactWr .cttFormBox01 .btnSubmit:after { 
	content:"";
	position:absolute;
	box-sizing:border-box;
	display:block;
	width: 20px;
	height: 10px;
	top: 22px;
	right: 25px;
	background:url(/Form/_guest/basic/images/cttArrow01_off.svg) no-repeat center / cover;
	transition:all .3s ease;
}
.contactWr .cttFormBox01 .btnSubmit:focus,
.contactWr .cttFormBox01 .btnSubmit:hover {
	background: #FFF;
	color: #212121;
}
.contactWr .cttFormBox01 .btnSubmit:focus:after,
.contactWr .cttFormBox01 .btnSubmit:hover:after { 
	background-image:url(/Form/_guest/basic/images/cttArrow01_on.svg);
}
.contactWr .cttFormBox01 .mapBox { 
	flex-grow:1;
	position:relative;
	min-width: 0;
	padding:51.82% 0 0;
	font-size: 0;
}
.contactWr .cttFormBox01 .mapBox .mapFrame { 
	position:absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #D9D9D9;
}
.contactWr .cttFormBox01 .mapBox .mapInfoLst01 { 
	position:absolute; 
	bottom: 0;
	right: -57px;
	padding:17px 70px 15px 24px;
	background: #424242;
}
.contactWr .cttFormBox01 .mapBox .mapInfoLst01 li { 
	font-size: 16px;
	color: #FFF;
	word-break:break-all;
}
@media all and (max-width:1375px){
	.contactWr .cttBox01 { 
		margin:0 16px;
	}
}
@media all and (max-width:1199px){
	.contactWr .cttFormBox01 { 
		gap:36px;
	}
	.contactWr .cttFormBox01 .mapBox .mapInfoLst01 { 
		right: 0;
	}
}
@media all and (max-width:999px){
	.contactWr .cttFormBox01 { 
		flex-wrap:wrap;
		gap:16px;
	}
	.contactWr .cttFormBox01 .iptBox01 { 
		width: 100%;
	}
	.contactWr .cttFormBox01 .iptTit01 { 
		margin:0 0 3px;
		font-size: 14px;
	}
	.contactWr .cttFormBox01 * + .iptTit01 {
		margin-top:10px;
	}
	.contactWr .cttFormBox01 .ipt01 { 
		padding:10px 10px 9px;
		font-size: 13px;
	}
	.contactWr .cttFormBox01 select.ipt01 { 
		padding-right:30px;
		background-size:14px auto;
		background-position:center right 10px;
	}
	.contactWr .cttFormBox01 .callBox01 { 
		gap:8px;
	}
	.contactWr .cttFormBox01 .iptBtmBox01 { 
		margin:16px 0 0;
	}
	.contactWr .cttFormBox01 .btnSubmit {
		padding:6px 30px 6px 12px;
		font-size: 13px;
	}
	.contactWr .cttFormBox01 .btnSubmit:after { 
		width: 14px;
		height: 7px;
		top: 10px;
		right: 6px;
	}
	.contactWr .cttFormBox01 .mapBox .mapInfoLst01 { 
		position:relative; 
		bottom: auto;
		right: auto;
		padding:16px 16px 14px;
	}
	.contactWr .cttFormBox01 .mapBox .mapInfoLst01 li { 
		font-size: 13px;
	}
}
/* CONTACT 끝
------------------------------------------------------ */
/* 포트폴리오 상세 시작
------------------------------------------------------ */
.portfolioDetailWr .pfImgBox01 { 
	margin:0 0 40px;
	font-size: 0;
}
.portfolioDetailWr .pfImgBox01 img { 
	width: 100%;
}
.portfolioDetailWr .pfSwipeBox01 { 
	position:relative;
	overflow: hidden;
}
.portfolioDetailWr .pfThumbBox01 { 
	position:relative;
	display:block;
	width: 100%;
	padding:100% 0 0;
	font-size: 0;
	overflow: hidden;
}
.portfolioDetailWr .pfThumbBox01 img {
	position:absolute; 
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
}
.portfolioDetailWr .pfSwipeArrow { 
	position:absolute;
	display:flex;
	align-items:center; 
	justify-content:center;
	width: 56px;
	height: 56px;
	top:50%; 
	margin:-28px 0 0;
	background: #FFF;
	border:1px solid #212121;
	border-radius: 50%;
	z-index: 3;
}
.portfolioDetailWr .pfSwipeArrow.stPrev { 
	left: 0;
}
.portfolioDetailWr .pfSwipeArrow.stNext { 
	right: 0;
}
@media all and (max-width:999px){	
	.portfolioDetailWr .pfImgBox01 { 
		margin:0 0 12px;
	}
	.portfolioDetailWr .pfSwipeBox01 { 
		max-width: 100%;
	}
	.portfolioDetailWr .pfSwipeArrow {
		width: 32px;
		height: 32px;
		margin:-16px 0 0;
	}
	.portfolioDetailWr .pfSwipeArrow img { 
		width: 12px;
	}
}
/* 포트폴리오 상세 끝
------------------------------------------------------ */