@charset "utf-8";

#bo_gall #gall_ul {margin:0 -3.5px;padding:0;list-style:none;zoom:1}
#bo_gall #gall_ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_gall .gall_li {
	position: relative; float:left;
	width:33.33333333%;
	margin:0 0 7px 0;padding-left:3.5px;padding-right:3.5px;
	-webkit-transition: all .5s ease-in;
	-moz-transition: all .5s ease-in;
	-ms-transition: all .5s ease-in;
	-o-transition: all .5s ease-in;
	transition: all .5s ease-in;
	-webkit-transform: translateY(5%);
	transform: translateY(5%);
	opacity: 0;
}
#bo_gall .gall_li.view { -webkit-transform: translateY(0);transform: translateY(0);opacity: 1; }
#bo_gall .gall_box {position:relative;}
#bo_gall .gall_con {position:relative;overflow: hidden;}
#bo_gall .gall_img {text-align:center;overflow:hidden}
#bo_gall .gall_img img, #bo_gall .gall_img video {max-width:100%;height:auto !important;-webkit-transition:all 1s; transition:all 1s;}

#bo_gall .gall_text {
	position: absolute;
	width: 100%; left: 0; bottom: 0; padding: 20px 10px;
	font-size: 15px; color: #fff; font-weight: 350; line-height: 1;
	border-top: 2px solid rgba(255,255,255,0.5);
	background: rgba(0,0,0,0.5);
	text-align: center; opacity: 0; z-index: 10;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	-o-transform: translateY(100%);
	transform: translateY(100%);
}
#bo_gall .gall_over {
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); opacity: 0; z-index: 2;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
} 
#bo_gall .gall_over:after {
	content: ''; display: block;
	position: absolute; width: 70px; height: 70px; top: 50%; left: 50%; 
	margin-top: -70px;
	background-image: url('/img/dodbogi2.png');
	background-color: rgba(0,0,0,0.5);
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-background-size: 45% 45%;
	background-size: 45% 45%;
	/* -webkit-background-size: cover;
	background-size: cover; */
	/* -webkit-transition: all 0.2s cubic-bezier(.175,.885,.32,1.275);
	-moz-transition: all 0.2s cubic-bezier(.175,.885,.32,1.275);
	-ms-transition: all 0.2s cubic-bezier(.175,.885,.32,1.275);
	-o-transition: all 0.2s cubic-bezier(.175,.885,.32,1.275);
	transition: all 0.2s cubic-bezier(.175,.885,.32,1.275); */
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	border-radius: 100%;
	z-index: 3;
}

#bo_gall .gall_li:hover .gall_text {
	opacity: 1;
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	-o-transform: translateY(0);
	transform: translateY(0);
}
#bo_gall .gall_li:hover .gall_over {opacity: 1;}
/* #bo_gall .gall_li:hover .gall_over:after { 
	-webkit-transform: translateX(-50%) scale(1);
	-moz-transform: translateX(-50%) scale(1);
	-ms-transform: translateX(-50%) scale(1);
	-o-transform: translateX(-50%) scale(1);
	transform: translateX(-50%) scale(1);
} */
#bo_gall .gall_li:hover .gall_img img {webkit-transform:scale(1.1); transform:scale(1.1);}

/*.gall_li {*/
	 /* transition: all .5s ease; */
	/* -webkit-animation: slbEnter .7s 1 cubic-bezier(.175,.885,.32,1.275);
	-moz-animation: slbEnter .7s 1 cubic-bezier(.175,.885,.32,1.275); */
	/*-webkit-animation: slbEnter .5s;
	-moz-animation: slbEnter .5s;
	animation: slbEnter .5s;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;*/
/*}*/

@-webkit-keyframes slbEnter {
	from { 
		opacity: 0;
		-webkit-transform: translateY(5%);
		-moz-transform: translateY(5%);
		-ms-transform: translateY(5%);
		-o-transform: translateY(5%);
		transform: translateY(5%);
	}
	to { 
		opacity: 1;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}
}
@-moz-keyframes slbEnter {
	from {
		opacity: 0;
		-webkit-transform: translateY(5%);
		-moz-transform: translateY(5%);
		-ms-transform: translateY(5%);
		-o-transform: translateY(5%);
		transform: translateY(5%);
	}
	to { 
		opacity: 1;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}
}
@keyframes slbEnter {
	from {
		opacity: 0;
		-webkit-transform: translateY(5%);
		-moz-transform: translateY(5%);
		-ms-transform: translateY(5%);
		-o-transform: translateY(5%);
		transform: translateY(5%);
	}
	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}
}


#portfolio_wrap { position: relative; height: 100vh; overflow: hidden; }

.slider {position:relative;top:0;left:0;width:100vw;height:100%;z-index:1;background: #000;}
.slider .slide{position:absolute;top:0;left:0;width:100%;height:100%;display:none;z-index:1}
.slider .slide.current{display:block}
.slider .text_container .slide_logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin-top: -60px; text-align: center; z-index: 2; }
.slider .text_container .slide_text { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin-top: 250px; text-align: center; z-index: 2; }
.slider .text_container .slide_text p { font-family: 'Outfit', sans-serif; font-size: 15px; color: #fff; font-weight: 400; line-height: 25px; letter-spacing: 0.04em; }
.slider .img-container{position:absolute;top:0;left:0;width:100vw;height:100vh}
.slider .img-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-animation:imgScale 25s ease infinite;animation:imgScale 25s ease infinite}
.slider .img-wrapper .img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;-webkit-background-size: cover;background-size:cover;background-repeat: no-repeat;background-position:center}

.swiper-wrapper .img-container { position: relative; width: 100%; height: 100vh; overflow: hidden; }
.swiper-wrapper .img-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.swiper-wrapper .img-wrapper .img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; -webkit-background-size: cover;background-size:cover;background-repeat: no-repeat;background-position:center }
.imgScale { -webkit-animation:imgScale 25s ease infinite;animation:imgScale 25s ease infinite; }

.slider_navigation .arrow {
	position: absolute; top: 50%; left: 25px;
	width: 40px; height: 40px; margin-top: -20px;
	font-size: 0; z-index: 2; opacity: 0.5; cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	text-align: center;
}
.slider_navigation .arrow.next { left: auto; right: 25px; }
.slider_navigation .arrow:after { content: ''; display:inline-block; width: 20px; height: 20px; margin-top: 10px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: rotate(225deg); }
.slider_navigation .arrow.next:after { transform: rotate(45deg); }
.slider_navigation .arrow:hover { opacity: 1; }

@-webkit-keyframes imgScale {
0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:scale(1) rotate(0.0001deg);transform:scale(1) rotate(0.0001deg)}
50%{-webkit-transform:scale(1.1) rotate(0.0001deg);transform:scale(1.1) rotate(0.0001deg)}
100%{-webkit-transform:scale(1) rotate(0.0001deg);transform:scale(1) rotate(0.0001deg)}
}
@keyframes imgScale {
0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:scale(1) rotate(0.0001deg);transform:scale(1) rotate(0.0001deg)}
50%{-webkit-transform:scale(1.1) rotate(0.0001deg);transform:scale(1.1) rotate(0.0001deg)}
100%{-webkit-transform:scale(1) rotate(0.0001deg);transform:scale(1) rotate(0.0001deg)}
}

#main_line{position:absolute;width:100%;height:1.5px;bottom: 100px;left:0;z-index:1;background:rgba(255,255,255,0.45);}
#main_line .l1{position:absolute;top:0;left:0;width: 0;height:1.5px;background:rgba(255, 255, 255, 0.8);}

#scroll_down { position: absolute; left: 0; bottom: 20px; width: 100%; text-align: center; z-index: 2; }
#scroll_down .mouse { position: relative; width: 26px; cursor: pointer; }

#portfolio_list { position: relative; width: 1220px; margin: 0 auto; padding: 190px 0 180px; }


@media screen and (max-width: 1300px) {
	#portfolio_list { width: auto; padding: 190px 50px 180px; }
}
@media screen and (max-width: 1024px) {

	#portfolio_list { padding: 25vw 9vw 20vw; }

	#bo_gall #gall_ul { margin: 0 -0.5vw; }
	#bo_gall .gall_li { width: 50%; margin: 0 0 1vw 0; padding-left: 0.5vw; padding-right: 0.5vw; }
	#bo_gall .gall_img img { width: 100%; }
	#bo_gall .gall_text, #bo_gall .gall_over { display: none; }
	#bo_gall .gall_li:hover .gall_img img {webkit-transform:scale(1); transform:scale(1);}

	.slider_navigation { display: none; }

	/* #main_line { bottom: 150px; }
	#scroll_down { bottom: 40px; } */
}
@media screen and (max-width: 800px) {
	
}
@media screen and (max-width: 420px) {

}
@media only screen and (max-device-width : 1024px) and (orientation : landscape) {

}