@import url(base.css);
@import url(/css/font.css);
@import url(/css/animate.css);
#wrap {position:relative; background:#fff; overflow:hidden;}


/* --------------------------------------------------헤더 영역-------------------------------------------------- */
#header_wrap {position:fixed; top:0; left:0; width:100%; background:#fff; z-index:100; transition:all 0.3s}
#header_wrap .head {position:relative; max-width:1600px; margin:0 auto; height:100px; display:flex; align-items:center; transition:all 0.3s}
.scroll_doc #header_wrap .head {height:85px}

#header_wrap .head .logoBox > div {display:inline-block; vertical-align:bottom;}
#header_wrap .head .logoBox img {height:39px; transition:all 0.3s}
#header_wrap .head .logoBox .data {font-size:20px; color:#080038; line-height:1.3em; margin:0 0 -3px 15px; transition:all 0.3s}
#header_wrap .head .language {margin-left:auto; margin-bottom:-3px} 
#header_wrap .head .language a {display:inline-block; font-size:20px; color:#fff; font-weight:700; background:#4cbaee; padding:3px 20px; border-radius:50px}

.scroll_doc #header_wrap .head .logoBox img {height:35px;}
.scroll_doc #header_wrap .head .logoBox .data {font-size:18px}

@media screen and (max-width:1620px){
	#header_wrap .head {max-width:94%;}
}

@media screen and (max-width:1024px){
	#header_wrap .head {height:10vw;}
	.scroll_doc #header_wrap .head {height:8.5vw}

	#header_wrap .head .logoBox img {height:3.9vw;}
	#header_wrap .head .logoBox .data {font-size:2vw; margin:0 0 -0.3vw 1.5vw}
	#header_wrap .head .language {margin-bottom:-0.3vw} 
	#header_wrap .head .language a {font-size:2vw; padding:0.3vw 2vw; border-radius:5vw}

	.scroll_doc #header_wrap .head .logoBox img {height:3.5vw;}
	.scroll_doc #header_wrap .head .logoBox .data {font-size:1.8vw}
}

@media screen and (max-width:768px){
	#header_wrap .head {height:15vw;}
	.scroll_doc #header_wrap .head {height:13.5vw}

	#header_wrap .head .logoBox > div {display:block}
	#header_wrap .head .logoBox img {height:4.9vw;}
	#header_wrap .head .logoBox .data {font-size:2.6vw; margin:1vw 0 -0.5vw 0}
	#header_wrap .head .language {margin-bottom:-0.5vw} 
	#header_wrap .head .language a {font-size:3vw; padding:0.5vw 3vw; border-radius:6vw}

	.scroll_doc #header_wrap .head .logoBox img {height:4.5vw;}
	.scroll_doc #header_wrap .head .logoBox .data {font-size:2.3vw}
}

@media screen and (max-width:480px){
	#header_wrap .head {height:20vw;}
	.scroll_doc #header_wrap .head {height:18.5vw}

	#header_wrap .head .logoBox img {height:5.9vw;}
	#header_wrap .head .logoBox .data {font-size:3.6vw; margin:1.5vw 0 -0.7vw 0}
	#header_wrap .head .language {margin-bottom:-0.7vw} 
	#header_wrap .head .language a {font-size:4vw; padding:0.7vw 4vw; border-radius:7vw}

	.scroll_doc #header_wrap .head .logoBox img {height:5.5vw;}
	.scroll_doc #header_wrap .head .logoBox .data {font-size:3.3vw}
}


/* --------------------------------------------------컨텐츠 영역-------------------------------------------------- */
#container_wrap {position:relative; display:block; overflow:hidden; padding-top:100px; z-index:1}

.mcont {position:relative; max-width:1200px; margin: 0 auto;}
.fp-auto-height.fp-section, .fp-auto-height .fp-slide, .fp-auto-height .fp-tableCell {height: auto !important;}

@media screen and (max-width:1220px){
	.mcont {max-width:94%}
}

@media screen and (max-width:1024px){
	#container_wrap {padding-top:10vw}
}

@media screen and (max-width:768px){
	#container_wrap {padding-top:15vw}
}

@media screen and (max-width:480px){
	#container_wrap {padding-top:20vw}
}


@keyframes fade-in-up
{
  0%{transform: translateY(30%); opacity: 0;}
  100%{transform: translateY(0%); opacity: 1;}
}

@keyframes fade-in-right
{
    0%{transform: translateX(-100%); opacity: 0;}
    100%{transform: translateX(0%); opacity: 1;}
}

/*fade-in left*/
@keyframes fade-in-left
{
    0% {transform: translateX(100%);opacity: 0;}
    100% {transform: translateX(0%);opacity: 1;}
}

/* --------------------------------------------------컨텐츠 영역-------------------------------------------------- */
/*섹션01*/
#section1 {position:relative; overflow:hidden; background:url(/images/main/main_img_25.jpg) no-repeat 50% 50%; background-size:cover;}
.main_mvBox {color:#fff;}
.main_mv {position:relative; overflow:hidden}
.main_mv:after {content:""; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.3); z-index:1}

.main_mv_apBox {position:absolute; top:26vw; left:50%; transform: translate(-50%,-50%); text-align:center; width:100%; z-index:2}
.main_mvtxt .txt01 {margin-bottom:115px; opacity:0}
.main_mvtxt .txt02 {font-size:36px; font-weight:700; line-height:1.5em; letter-spacing:0; opacity:0}

.main_mvBox .txt_btnBox {margin-top:200px; width:100%; text-align:center; z-index:2}
.main_mvBox .txt_btnBox .mq_ul {margin-bottom:30px}
.main_mvBox .txt_btnBox .mq_ul li {position:relative; display:inline-block; margin:0 8px}
.main_mvBox .txt_btnBox .mq_ul a {position:relative; display:inline-block; width:220px; height:54px; line-height:58px; border-radius:50px; background:#0276d1; color:#fff; font-size:22px; word-spacing:-0.2em; padding:0 34px; font-family: 'GmarketSansMedium';}
.main_mvBox .txt_btnBox .mq_ul li:hover a {background:#fff; color:#0276d1;}

.main_mvBox .hostBox {opacity:0}
.main_mvBox .hostBox > div, .main_mvBox .hostBox .tlt, .main_mvBox .hostBox ul, .main_mvBox .hostBox li {display:inline-block; vertical-align:middle}
.main_mvBox .hostBox .tlt {font-size:20px; font-weight:700; margin-right:15px; letter-spacing:0}

.main_mvBox .hostBox .host_lBox {margin-right:15px}
.main_mvBox .hostBox li {margin-right:15px;}
.main_mvBox .hostBox li:last-child {margin-right:0}
.main_mvBox .hostBox img {max-height:35px;}

.main_mv .video-bg .player {height:auto !important; padding-bottom:55% !important}
.main_mv .video-bg .inline-YTPlayer {max-width:100% !important}

/*애니메이션*/
#section1.active .main_mvtxt .txt01 {opacity:1; animation-fill-mode: both !important; animation: fade-in-up 0.5s; animation-timing-function: ease-out; animation-delay:0.3s}
#section1.active .main_mvtxt .txt02 {opacity:1; animation-fill-mode: both !important; animation: fade-in-up 0.5s; animation-timing-function: ease-out; animation-delay:0.5s}
#section1.active .main_mvBox .hostBox {opacity:1; animation-fill-mode: both !important; animation: fade-in-up 0.5s; animation-timing-function: ease-out; animation-delay:0.7s}

@media only screen and  (max-width: 1920px) {
	.main_mv_apBox {top:28vw;}
	.main_mv .video-bg .player {height:auto !important; padding-bottom:60% !important}
}	

@media only screen and  (max-width: 1700px) {
	.main_mv_apBox {top:31vw;}
	.main_mv .video-bg .player {height:auto !important; padding-bottom:65% !important}
}	

@media only screen and  (max-width: 1420px) {
	.main_mv_apBox {top:34vw;}
	.main_mv .video-bg .player {height:auto !important; padding-bottom:70% !important}

	.main_mvtxt .txt01 {margin-bottom:85px}
	.main_mvBox .txt_btnBox {margin-top:170px;}
}	

@media screen and (max-width:1220px){
	.main_mvBox {height:800px}
	.main_mvBox .main_mv {position:absolute; top:41%; left:50%; transform: translate(-50%,-50%); width:3000px;}

	.main_mv_apBox {top:50%}
	.main_mvtxt .txt01 img {height:180px}
	.main_mvtxt .txt02 {font-size:30px;}

	.main_mvBox .txt_btnBox {margin-top:12vw}
}

@media screen and (max-width:1024px){
	.main_mvBox {height:100vw}
	.main_mv_apBox {top:50%; left:50%;}

	.main_mvtxt .txt01 img {height:16vw}
	.main_mvtxt .txt02 {font-size:3vw;}	

	.main_mvtxt .txt01 {margin-bottom:8.5vw}
	.main_mvtxt .txt02 {margin-bottom:17vw}

	.main_mvBox .txt_btnBox {margin-top:7vw;}
	.main_mvBox .hostBox > div {display:block}
	.main_mvBox .hostBox .host_lBox {margin:2vw 0 0 0}

	.main_mvBox .hostBox .tlt {font-size:2vw; margin-right:1.5vw;}

	.main_mvBox .hostBox li {margin-right:1.5vw;}
	.main_mvBox .hostBox img {max-height:3.5vw;}
}

@media screen and (max-width:768px){
	.main_mvBox {height:120vw}

	.main_mvtxt .txt01 img {height:18vw}
	.main_mvtxt .txt02 {font-size:4vw;}	
	
	.main_mvtxt .txt01 {margin-bottom:9.5vw}
	.main_mvtxt .txt02 {margin-bottom:18vw}

	.main_mvBox .txt_btnBox {margin-top:9vw;}
	.main_mvBox .hostBox .host_lBox {margin-top:1vw}

	.main_mvBox .hostBox .tlt {font-size:3vw; margin-right:2vw;}

	.main_mvBox .hostBox li {margin-right:2.5vw;}
	.main_mvBox .hostBox img {max-height:4.5vw;}

	.main_mvBox .hostBox_hw {display:flex !important; margin-left:10%}
	.main_mvBox .hostBox_hw .tlt {width:10%}
	.main_mvBox .hostBox_hw ul {width:75%;}
}


@media screen and (max-width:480px){
	.main_mvBox {height:150vw}

	.main_mvBox .txt_btnBox {margin-top:11vw;}
	.main_mvBox .hostBox img {max-height:4.7vw;}
	.main_mvBox .hostBox_hw ul {width:80%;}
}


/*섹션02*/
#section2 {background:#4cbaee;}
#section2 .mcont {padding:80px 0}
#section2 .overviewBox {display:flex;}
#section2 .overviewBox .imgBox {margin-right:50px; opacity:0}

#section2 .overviewBox .txtBox {opacity:0}
#section2 .overviewBox .txtBox .tlt {margin-bottom:35px}
#section2 .overviewBox .txtBox dl {display:flex; padding:10px 0; color:#fff}
#section2 .overviewBox .txtBox dl:first-child {padding-top:0}
#section2 .overviewBox .txtBox dl:last-child {padding-bottom:0}
#section2 .overviewBox .txtBox dt {min-width:140px; font-size:20px; color:#000443; font-weight:700}
#section2 .overviewBox .txtBox dd {font-size:18px;}
#section2 .overviewBox .hostUl li {display:inline-block; vertical-align:top; margin:0 17px 5px 0;}
#section2 .overviewBox .hostUl li:last-child {margin-right:0}
#section2 .overviewBox .hostUl img {height:35px;}

/*애니메이션*/
#section2.active .overviewBox .imgBox {opacity:1; animation-fill-mode: both !important; animation: fade-in-right 0.5s; animation-timing-function: ease-out; animation-delay:0.3s}
#section2.active .overviewBox .txtBox {opacity:1; animation-fill-mode: both !important; animation: fade-in-left 0.5s; animation-timing-function: ease-out; animation-delay:0.3s}


@media screen and (max-width:1220px){
	#section2 .overviewBox .imgBox {width:32%}
	#section2 .overviewBox .imgBox img {width:100%}
	#section2 .overviewBox .txtBox {margin-left:auto; width:64%}
}

@media screen and (max-width:1024px){	
	#section2 .mcont {padding:8vw 0}
	#section2 .overviewBox {display:block}

	#section2 .overviewBox .imgBox {width:100%; margin-right:0}

	#section2 .overviewBox .txtBox {width:100%; margin-top:5vw}
	#section2 .overviewBox .txtBox .tlt {margin-bottom:3.5vw}
	#section2 .overviewBox .txtBox .tlt img {height:6vw}

	#section2 .overviewBox .txtBox dl {padding:1vw 0;}
	#section2 .overviewBox .txtBox dt {min-width:14vw; font-size:2vw;}
	#section2 .overviewBox .txtBox dd {font-size:1.8vw;}
	#section2 .overviewBox .hostUl li {margin:0 1.7vw 0.5vw 0;}
	#section2 .overviewBox .hostUl img {height:3.5vw;}
}

@media screen and (max-width:768px){
	#section2 .mcont {padding:10vw 0}

	#section2 .overviewBox .txtBox {margin-top:6vw}
	#section2 .overviewBox .txtBox .tlt {margin-bottom:4.5vw}
	#section2 .overviewBox .txtBox .tlt img {height:7vw}

	#section2 .overviewBox .txtBox dl {padding:1.5vw 0;}
	#section2 .overviewBox .txtBox dt {min-width:25vw; font-size:3vw;}
	#section2 .overviewBox .txtBox dd {font-size:2.8vw;}
	#section2 .overviewBox .hostUl li {margin:0 2.7vw 0.7vw 0;}
	#section2 .overviewBox .hostUl img {height:4.5vw;}
}

@media screen and (max-width:480px){
	#section2 .mcont {padding:12vw 0}

	#section2 .overviewBox .txtBox {margin-top:7vw}
	#section2 .overviewBox .txtBox .tlt {margin-bottom:5.5vw}
	#section2 .overviewBox .txtBox .tlt img {height:8vw}

	#section2 .overviewBox .txtBox dl {display:block; padding:2.5vw 0;}
	#section2 .overviewBox .txtBox dt {min-width:100%; font-size:4vw;}
	#section2 .overviewBox .txtBox dd {font-size:3.8vw; margin-top:1vw}
	#section2 .overviewBox .hostUl li {margin:0 3.7vw 0.9vw 0;}
	#section2 .overviewBox .hostUl img {height:5.5vw;}
}


/*섹션03*/
#section3 .main_galleryBox {position:relative;}
#section3 .main_gallery_listUl {display:grid; grid-template-columns:repeat(4, 1fr)}
#section3 .main_gallery_listUl li {width:100%; height:18vw; background:#000; cursor:pointer; overflow:hidden}
#section3 .main_gallery_listUl a {position:relative; display:block; width:100%; height:100%; overflow:hidden}
#section3 .main_gallery_listUl .img {position:relative; width:100%; height:100%; z-index:1}
#section3 .main_gallery_listUl .img img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) scale(1.01); Width:100%; height:100%; opacity:1; transition:all 0.3s}
#section3 .main_gallery_listUl li:hover .img img {transform:translate(-50%,-50%) scale(1.2); opacity:0.5}
#section3 .main_gallery_listUl .viewBtn {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); display:flex; align-items:center; justify-content:center; width:0; height:0; background:#4cbaee; border-radius:50%; font-size:0; color:#fff; z-index:2; transition:all 0.2s}
#section3 .main_gallery_listUl li:hover .viewBtn {width:80px; height:80px; font-size:20px}

/*애니메이션*/

@media screen and (max-width:1420px){
	#section3 .main_gallery_listUl {display:grid; grid-template-columns:repeat(3, 1fr)}
	#section3 .main_gallery_listUl li {height:23vw;}
}

@media screen and (max-width:1024px){
	#section3 .main_gallery_listUl {display:grid; grid-template-columns:repeat(2, 1fr)}
	#section3 .main_gallery_listUl li {height:33vw;}

	#section3 .main_gallery_listUl a:hover .img img {transform:translate(-50%,-50%) scale(1.01); opacity:1;}
	#section3 .main_gallery_listU .viewBtn, #section3 .main_gallery_listUl a:hover .viewBtn {display:none}
}


/* --------------------------------------------------푸터 영역-------------------------------------------------- */
#footer_wrap {position:relative; background:#fff; color:#000443;}
#footer_wrap .ft_cont {position:relative; max-width:1200px; width:100%; margin:0 auto; padding:40px 0 90px; display:flex; align-items:center;}

#footer_wrap .ft_logo {margin-right:28px}

#footer_wrap .ft_infoUl {width:730px}
#footer_wrap .ft_infoUl li {display:inline-block; font-size:16px; letter-spacing:0.03px; line-height:1.3em}
#footer_wrap .ft_infoUl li:after {content:""; display:inline-block; vertical-align:middle; width:1px; height:15px; background:#010101; margin:0 5px}
#footer_wrap .ft_infoUl li:nth-child(3):after, #footer_wrap .ft_infoUl li:nth-child(4):after, #footer_wrap .ft_infoUl li:last-child:after {display:none}
#footer_wrap .ft_infoUl li:last-child {margin-left:15px}

#footer_wrap .ft_snsUl {margin-left:auto;}
#footer_wrap .ft_snsUl li {display:inline-block; vertical-align:top; margin-left:10px;}
#footer_wrap .ft_snsUl li:last-child {margin-left:0}

@media screen and (max-width:1220px){
	#footer_wrap .ft_cont {max-width:94%}
}

@media screen and (max-width:1024px){
	#footer_wrap .ft_cont {padding:4vw 0 9vw}
	
	#footer_wrap .ft_logo {margin-right:2.8vw}
	#footer_wrap .ft_logo img {height:3.9vw}

	#footer_wrap .ft_infoUl {width:60vw}
	#footer_wrap .ft_infoUl li {font-size:1.6vw;}
	#footer_wrap .ft_infoUl li:after, #footer_wrap .ft_infoUl li:nth-child(3):after {display:inline-block; height:1.5vw; margin:0 0.5vw}
	#footer_wrap .ft_infoUl li:nth-child(2):after {display:none}
	

	#footer_wrap .ft_infoUl li:last-child {margin-left:0}

	#footer_wrap .ft_snsUl li {margin-left:1vw;}
	#footer_wrap .ft_snsUl img {height:5.1vw}
}

@media screen and (max-width:768px){
	#footer_wrap .ft_cont {padding:5vw 0 10vw; display:block; text-align:center;}
	
	#footer_wrap .ft_logo {margin-right:0}
	#footer_wrap .ft_logo img {height:4.9vw}

	#footer_wrap .ft_infoUl {width:100%; margin-top:4vw}
	#footer_wrap .ft_infoUl li {font-size:2.6vw;}
	#footer_wrap .ft_infoUl li:after, #footer_wrap .ft_infoUl li:nth-child(3):after {display:inline-block; height:2.5vw; margin:0 0.7vw}
	#footer_wrap .ft_infoUl li:nth-child(2):after {display:none}

	#footer_wrap .ft_snsUl {margin-top:4vw}
	#footer_wrap .ft_snsUl li {margin-left:2vw;}
	#footer_wrap .ft_snsUl img {height:6.1vw}
}

@media screen and (max-width:480px){
	#footer_wrap .ft_cont {padding:6vw 0 11vw;}
	
	#footer_wrap .ft_logo img {height:5.9vw}

	#footer_wrap .ft_infoUl {margin-top:5vw}
	#footer_wrap .ft_infoUl li {font-size:3.6vw;}
	#footer_wrap .ft_infoUl li:after, #footer_wrap .ft_infoUl li:nth-child(2):after, #footer_wrap .ft_infoUl li:nth-child(3):after {display:none}

	#footer_wrap .ft_snsUl {margin-top:5vw}
	#footer_wrap .ft_snsUl li {margin-left:3vw;}
	#footer_wrap .ft_snsUl img {height:7.1vw}
}