html,body {width:100%}
.wrap{
	width: 100%;
	position: relative;
	overflow:hidden;
}
[id*='mbody'] {
	position:relative;
	padding:2rem 0 3rem;
}
.sceTit {position:relative; font-family:var(--eng-title); color:var(--font-color-3); margin-bottom:var(--secgap)}
.sceTit > h2 {font-size:2rem; font-weight:var(--font-weight-9)}
.sceTit > p {font-family:var(--default-font); letter-spacing:-0.06em;; color:var(--font-color-6)}
.sceTit > p > span {font-weight:var(--font-weight-7)}


/* =====================================
   메인 비쥬얼 슬라이드
===================================== */
/* msec-visual */
.msec-visual{
	position:relative; 
	overflow:hidden; 
	width:100%; /*margin-left:4%;*/ 
	height:25rem;
	
}
.msec-visual .pic:after {
	content:"";
	position:absolute;
	z-index:1;
	left:0;
	top:0;
	width:100%; 
	height:100%;
	background-image:url(/images/main/pattenBG.png);
}

.msec-visual .swiper-wrapper {
    transition-timing-function: cubic-bezier(.5,0,0,1)
}


.msec-visual .swiper-slide { 
	text-align: center;
    display: flex;
    justify-content: center;
    align-items: center
	}
.msec-visual .pic {
	width: 100%;
    height: 100%; 
	position: absolute;
	z-index:2;
    transform: scale(1.0);
    transition-duration: 2s;
    transition-property: transform;
    transition-timing-function: cubic-bezier(.5,0,0,1);
	}
/*.msec-visual .pic{
	width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.0) translate(0);
    transition-timing-function: cubic-bezier(.5,0,0,1);
    transition-property: transform
    
}*/

.msec-visual .swiper-slide-active .pic {transform:scale(1.1);}
.msec-visual .pic img {width:100%; height:100%; object-fit:cover;}


.msec-visual .slogun{
	min-width:320px;
	position:absolute;
	width:90%; 
	max-width:var(--container); 
	padding-top:60px;
	margin:0 auto;
	/*text-shadow: 0px 1px 6px rgba(0,0,0,0.5);*/
	left:50%;
	top:50%; 
	z-index:3; 
	-webkit-transform: translate(-50%, -50%);  
	-moz-transform: translate(-50%, -50%);  
	-ms-transform: translate(-50%, -50%);  
	-o-transform: translate(-50%, -50%);  
	transform: translate(-50%, -50%);
	}
.msec-visual .more {
	display:inline-block;
	min-width: 8.25rem;
	padding: 1.125rem 1.875rem;
	font-size: 0.9375rem;
	line-height: 1;
	font-weight: 500;
	color:var(--point-color);
	text-transform: capitalize;
	letter-spacing: 0.03em;
	border: 0.0625rem solid #ff001a;
	margin:var(--secgap);
	 transition: background-color 300ms cubic-bezier(0.165, 0.84, 0.44, 1), color 300ms cubic-bezier(0.165, 0.84, 0.44, 1), border 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.msec-visual .more:hover {
	background-color:var(--point-color);
	color:#fff;
}
#section1{}
#section1 h1,   #section1 p {text-align:center}
#section1  h1{
 	font-family:var(--title-font);
	font-size: 2.25em;
	color:var(--point-color);
	-webkit-text-shadow: none;
	text-shadow: none;
	letter-spacing:-0.02em;
	line-height:1.0;
	margin-bottom:var(--margin-1)
	}
#section1  h1 span {
 	display:block;
 	font-family:var(--eng-title);
	font-size:0.825em;
	font-weight:var(--font-weight-8)
 }
#section1  h1 span:nth-of-type(1) {margin-bottom:var(--margin-s)}

#section1  h1 em {
	color:var(--pcolor-blue);
}

#section1 p {
	/*font-family:var(--sub-title-font);*/
	color:var(--color-f5);
	font-size:var(--text-xs);
	font-weight:var(--font-weight-4)
}

.text-animated{ 
	transform:scale(0.8);
	letter-spacing: 4rem;
    transition:0.5s 0.5s;
	filter: blur(4px);
	color:transparent;

}

.swiper-slide-active .text-animated{
      transform:scale(1.0);
	  letter-spacing: 0;
	  transition:0.5s 0.5s;
	  filter: blur(0);
	  color:#fff;

}

.text-animated2{ 
	transform: scale(1.0);
	color:#fff;
	
}
.swiper-slide-active .text-animated2{
      transform: scale(1.2);
	  color:transparent;
	  -webkit-text-stroke: 1px #fff;
	  transition:all .2s ease-out;
	  transition-delay: 1s;
	 
}

.text-animated3{top:0; opacity:0; letter-spacing: 2rem; font-size:4rem; transition:0.5s 0.5s; filter: blur(4px);}
.swiper-slide-active .text-animated3{top:0;opacity:1; letter-spacing:normal;filter: blur(0);}
.cv_button {
	width:90%;
	min-width:320px;
	margin:1rem auto;
	display:none; 
	flex-flow:row wrap; 
	justify-content:flex-start;
	align-items:center; 
	position:absolute;
	z-index:5002;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%)
	
}
.cv_button>div {position:relative; width:100%; display:flex; justify-content:space-between}
.progressW {flex-flow:column wrap; justify-content:center; margin-top:1rem}
.swiper-pagination-cv {display:none; width:100%; margin-top:1rem; text-align:center}
.buttonW>div {
	display:flex;
	align-items:center;
	justify-content:center;
	width:60px; 
	height:60px;
	line-height:60px;
	border:1px solid #fff;
	/*border-radius:50px;*/
	padding:0.333rem;
	margin:0 2px;
	text-align:center; 
	cursor:pointer; 
	opacity:0.4; 
	transition: opacity 0.6s, width 0.6s, height 0.6s;
}

.buttonW>div:before {
	content:"";
	font-family: 'Linearicons-Free';
	color:#fff;
	font-size:var(--text-xl);
}

.buttonW>div>svg {
	 position: relative;
	 top: 0;
	 fill: #fff;
	 stroke-linecap: round;
	 stroke-linejoin: round;
	 stroke: none;
	 stroke-width: 2;
	 transform: translateX(0);
	 transition: all 0.3s ease;
	 scale:0.6;

}

.buttonW>div.swiper-button-next-cv:before {content:"\e87a";}
.buttonW>div.swiper-button-prev-cv:before {content:"\e879";}
.buttonW>div.swiper-button-prev-cv>svg {
 transform: translateX(0);

}
.buttonW>div>svg:hover:before {
 background: #ffab9d;

}

.buttonW>div:hover {background-color:#fff;}
.buttonW>div:hover:before {color:#333}
.buttonW>div:hover svg {fill:#333}
.buttonW>div:hover svg {
	transform: translateX(0px);

}


.buttonW>div.swiper-button-prev-cv:hover svg{
	transform: translateX(0px);

}

.buttonW>div>img:active {

}
/*.swiper-button-prev-cv{transform: rotateY(180deg)}*/
.cv_button [class*='swiper-button-']:hover {opacity:1}

.msec-visual .swiper-pagination {position:relative; font-family:var(--num-font-name); font-size:12px; color:#fff}
.swiper-pagination-cv .swiper-pagination-bullet {margin:0.222rem; width:4px; height:4px; background:none}
.swiper-pagination-cv .swiper-pagination-bullet-active {background:#c6a582;}

.swiper-progress-bar {position:relative;width:100%; margin-bottom:0.666rem;/*position: absolute; left: 50%; transform: translate(-50%); max-width: var(--container);*/ display: block; z-index: 1; height:.5rem; }
.swiper-progress-bar .slide_progress-bar {position:absolute; width: 100%; height: .3rem; background:rgba(255,255,255,0.5);opacity:1; max-width: 4.5rem;}
.swiper-progress-bar .slide_progress-bar:after {position: absolute; top: 0; left: 0; background:#fff; height: 100%; width: 0; content: ""; transition: 0.1s width linear;}
.swiper-progress-bar.active .slide_progress-bar {opacity: 1;}
.swiper-progress-bar.animate .slide_progress-bar:after {transition: width linear;transition-delay: unset; width: 100%; transition-duration: 5s;}
.cv_button .swiper-pagination {text-align:left}


@media (min-width:1200px){
	#section1{padding-top:0}
	.msec-visual {height:30rem;}
	.sceTit > h2 {font-size:3rem;}
	.sceTit > h2 > span {
		position:relative;
		z-index:1;
		display:inline-block; 
		background-color:#fff;
		padding: 0 2rem 0 0;
		
	}
	.sceTit > h2:after {
		content:"";
		position:absolute;
		top:50%;
		right:0;
		width:100%;
		height:1px;
		background-color:var(--point-color);
		animation-duration: 3s;
		animation-name:titleLine;
		animation-direction: alternate;
	}
	.cv_button {display:block}



}

@media (min-width: 1400px){

	[id*='mbody'] {
		padding:4rem 0 6rem;
	}
.sceTit > h2 {font-size:4rem;}
.msec-visual {height:40rem;}
.msec-visual .pic { height:40rem;}
	
#section1 h1{font-size:4em}

}

@media (min-width: 1600px){
#section1 h1{font-size:5em}
.msec-visual {height:50rem;}
.msec-visual .pic { height:50rem;}

}

@media (min-width: 2000px){
	[id*='mbody'] {
		padding:5rem 0 7rem;
	}
.msec-visual {height:60rem;}
.msec-visual .pic { height:60rem;}
}




/* =====================================
   mbody2
===================================== */
.bezier {transition: transform 0.55s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.55s cubic-bezier(0.215, 0.61, 0.355, 1);}
#mbody2 {min-height:50vh}
.theumList {display:flex; flex-flow:row wrap; gap:1rem; width:calc(100% + 1rem);}
.theumList>div {
	width:calc(50% - 1rem);
	transition: transform 0.55s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.55s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.m2Sec>div:nth-of-type(2n) {background-color:#08858d}
.m2Sec div a {
	display:flex; 
	flex-flow:column wrap; 
	align-items:center; 
	color:#fff; 
	padding:var(--boxpd);
	
	}
.m2Sec div:hover {transform:translateY(-50px); transition: transform 0.55s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.55s cubic-bezier(0.215, 0.61, 0.355, 1);}
.m2Sec div h3 {
	font-family:var(--title-font);
	font-size:1.5rem;
	margin-bottom:var(--margin-1)
}

.m2Sec div ul li {font-size:0.875rem; margin-bottom:0.333rem}
.m2Sec div h3:before {
	content:"";
	width:40px;
	height:40px;
	display:block;
	margin:0 auto;
	background-position:center center;
	background-size:100%; 
	background-repeat:no-repeat;
	margin-bottom:var(--margin-1)
}

.m2Sec div:nth-of-type(1) h3:before {background-image: url('/images/main/do1.svg');}
.m2Sec div:nth-of-type(2) h3:before {background-image: url('/images/main/do2.svg');}
.m2Sec div:nth-of-type(3) h3:before {background-image: url('/images/main/do3.svg');}
.m2Sec div:nth-of-type(4) h3:before {background-image: url('/images/main/do4.svg');}
/*.typed-cursor.typed-cursor--blink {color:#ccc; font-size:1rem}*/
.theumList .pic img {transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);}
.theumTit {
    display: flex;
    flex-flow: column wrap;
    justify-content: space-between;
    min-height: 80px;
}
.theumList h4 {color:var(--color-1); font-weight:var(--font-weight-8); font-size:var(--text-xl); line-height:var(--lineH1); margin-bottom:var(--margin-1)}
.theumList span {color:var(--color-1); font-size:var(--text-base)}
.theumList a:hover .pic { transform: scale(1.0); overflow:hidden}
.theumList a:hover .pic img{
	transform: scale(0.9);
	transform-origin: center;
	animation-duration: 0.8s;
	animation-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
	animation-fill-mode: both;
}
.theumList a:hover .theumTit {transform:translateX(1rem);}
.theumList a:hover h4 { color:var(--point-color);}
.theumList span {color:var(--color-1)}
.arrowmore {display:flex; align-items:center; gap:1rem}

@keyframes imgReveal {
  0% {
    transform: scale(1.0);
  }
  100% {
    transform: scale(0.9);
  }
}
@media (min-width: 768px){
	.theumList h4 {font-size:var(--text-2xl);}
}

@media (min-width: 1200px){
	.theumList {width:calc(100% + 2rem); gap:2rem}
	.theumList>div {width:calc(33.333% - 2rem);}
	.theumList h4 {font-size:var(--text-3xl);}
	.theumList span {font-size:var(--text-xl)}
}


@media (min-width: 1600px){
	.theumList {width:calc(100% + 3rem); gap:3rem}
	.theumList>div {width:calc(33.333% - 3rem);}

}


/* =====================================
   mbody3
===================================== */

#mbody3 {background:var(--base-color1); padding:0}
#mbody3 .container {display:flex; flex-flow:row wrap;}
#mbody3 > h3 {position:relative; z-index:2;}

#mbody3 h4,#mbody3 p {position:relative; z-index:2;}
#mbody3:before {
	content:"";
	position:absolute;
	width:30%;
	height:100%;
	left:0;
	top:0;
	background-image:url('/images/main/sec31BG.jpg');
	background-repeat:no-repeat;
	background-size:cover;
}

#mbody3:after {
	content:"";
	position:absolute;
	z-index:1;
	left:0;
	top:0;
	width:30%; 
	height:100%;
	background-image:url(/images/main/pattenBG.png);
}
#mbody3 h4 {
	color:#fff;
	font-size: var(--text-2xl);
	font-family:var(--sub-title-font);
	font-weight:var(--font-weight-8);
	margin-bottom:var(--margin-1)
}

#mbody3 p {
	font-size: var(--text-sm);
	font-family:var(--base-font);
	color:var(--color-w);
	font-weight:var(--font-weight-3);
}

/*갤러리*/
.poster-container div.swiper-slide {
	position:relative; 
	/*box-shadow:0 0px 8px rgba(0,0,0,0.15);*/
	cursor:pointer;
}
.poster-container div.swiper-slide:hover {border-color:#999;}
.poster-container div.swiper-slide:hover .pic img { transform:scale(1.1); transition:0.3s;}
.poster-container div.swiper-slide .pic {margin-bottom:0 !important; overflow:hidden}
.poster-container div.swiper-slide .pic img {width:100%; object-fit:cover; transition:0.3s;}
.poster-container div.swiper-slide .cont {
	width:100%; 
	background:#fff; 
	padding:1em; 
	text-align:center;
	font-family:var(--sub-title-font);
	font-size: var(--lmtxt);
}

.ps_button {position:absolute; z-index:10; right:0; top:50%; transform:translateY(-50%); display:flex;}
.swiper-button-prev-ps,.swiper-button-next-ps {width:50px; height:20px; padding:1rem; background-repeat:no-repeat; background-position:center; cursor:pointer; opacity:0.4; transition: opacity 0.6s, width 0.6s, height 0.6s;}
.swiper-button-prev-ps {background-image:url(/images/main/icon-next.svg); transform: rotate(180deg);}
.swiper-button-next-ps {background-image:url(/images/main/icon-next.svg); margin-left:1rem}
.swiper-button-next-ps .cursor{position: absolute; border-radius: 50%; border: 1px solid white; top: 0; left: 0; pointer-events: none; user-select: none; transform: translate(-50%,-50%); opacity: 0; width: 40%; height: 40%; transition: opacity 0.6s, width 0.6s, height 0.6s;}
.swiper-button-next-ps .cursor.on{opacity: 1; width: 100%; height: 100%;}
.swiper-button-prev-ps:hover,.swiper-button-next-ps:hover {opacity:1}
.flex-grid {display:flex; flex-flow:row wrap}
.msec31 {
	display:flex;
	flex-direction:column;
	align-items:flex-end;
	position:relative;	
	padding:var(--secgap)
	
}



.msec31,.msec32 {width:100%;}
.msec32 {
	position:relative;
	background:#131419;
	padding:var(--secgap)
}

.msec31 p {max-width:400px; text-align:right; opacity:0.8}
.msec31 p span {display:inline-block; white-space:nowrap}


@media (min-width: 1200px){
	#mbody3 > h3 > span {display:inline-block; position:relative; z-index:1}
	#mbody3 > h3:after {
		content:"";
		position:absolute;
		z-index:0;
		top:50%;
		right:0;
		width:70%;
		height:1px;
		background-color:var(--point-color);
		animation-duration: 3s;
		animation-name:titleLine2;
		animation-direction: alternate;
	}
	#mbody3 h4 {
		font-size: var(--text-3xl);
	}

	.msec31 {width:30%;}
	.msec32 {width:70%; max-width:1000px}
}

/*contact us*/
.form {
		display: flex;
		flex-flow: row wrap;
		width: 100%;
		margin: auto;
		justify-content: space-between;
	}
	.form-group {
		width: calc(50% - 10px);
		margin: 10px 0px;
	}
	.form-control {
		width: 100%;
		padding: 10px 0px;
		outline: none;
		border:none;
		border-bottom: #4e5057 1px solid;
		border-radius:0 !important;
		font-size: var(--text-xs);
		font-family: var(--base-font);
		font-weight:var(--font-weight-4);
		color: #ccc;
		transition: 0.5s all;
		background-color: transparent;
		resize: none;
	}
	select.form-control {
		appearance: none;
		padding: 5px 0;
		line-height: 34px;
		background-image: url(https://coderwrap.com/wp-content/uploads/2023/01/slt-arrow-down-white.svg);
		background-repeat: no-repeat;
		background-position: calc(100% - 5px) 20px;
	}
	.form-control:focus {
		border-color: #ccc;
	}
	.form-control::-webkit-input-placeholder {
		color: #ccc;
	}
	.form-control:-ms-input-placeholder {
		color: #ccc;
	}
	.form-control::placeholder {
		color: #ccc;
	}
	.fg-full-width {
		width: 100%;
	}
	textarea.form-control {
		height: 150px;
	}
	.submit-btn {
		min-width: 10.25rem;
		padding: 1.5rem 2.125rem;
		border: none;
		outline: none;
		border-radius:0;
		border-color:var(--point-color);
		font-family: var(--base-font);
		font-size: var(--text-base);
		background-color:var(--color-0);
		color: #fff;
		font-weight:var(--font-weight-6);
		cursor: pointer;
		transition: 0.5s all;
	}
	.submit-btn:hover {
		background-color:#fff;
		color:var(--text-base);

	}