@charset "utf-8";

.visual {position:relative;height:485px;background:url('../img/home_visual01.jpg') no-repeat center center;background-size:cover;}
.visual .slogan {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.visual .slogan img {display:block;margin-top:15px;}
.visual .slogan img:first-child {margin-top:0;}
.visual .slogan img.s01 {opacity:0;transform:translateX(-50px);transition:transform .8s,opacity 2s;}
.visual .slogan img.s02 {opacity:0;transform:scale(1.5);transition:transform .8s,opacity 2s;transition-delay: 0.3s;}
.visual .slogan img.s03 {opacity:0;transform:translateX(50px);transition:transform .8s,opacity 2s;}
.visual .slogan.on img.s01 {opacity:1;transform:translateX(0);}
.visual .slogan.on img.s02 {opacity:1;transform:scale(1);}
.visual .slogan.on img.s03 {opacity:1;transform:translateX(0);}

.menu {height:94px;overflow:hidden;text-align:center;border-bottom:1px solid #c1c1c1;}
.menu ul.lst {display:inline-block;}
.menu ul.lst:after {display:block;content:"";clear:both;}
.menu ul.lst > li {float:left;display:block;}
.menu ul.lst > li > a {display:block;padding:0 50px;height:94px;line-height:94px;font-size:21px;font-family:'NEXON Lv2 Gothic';}
.menu ul.lst > li > a.on span {padding-bottom:5px;border-bottom:1px solid #333;}

.slider {position:relative;height:552px;overflow:hidden;border-bottom:1px solid #313131;}
.slider > .wrap {width:1300px;margin:0 auto;}
.slider > .wrap .sect {position:relative;height:552px;}
.slider > .wrap .sect > img {position:absolute;bottom:0;opacity:0;transition:all 1s;}
.slider > .wrap .sect > .txt {position:absolute;top:190px;text-align:center;}
.slider > .wrap .sect > .txt > .tit {line-height:48px;font-size:40px;color:#1d1d1d;font-family:'NEXON Lv1 Gothic Low OTF';transform:translateY(-30px);opacity:0;transition:all .8s;transition-delay: 0.5s;}
.slider > .wrap .sect > .txt > .dsc {line-height:40px;font-size:32px;color:#1d1d1d;margin-top:20px;font-family:'Nanum Pen Script';opacity:0;transition:all .8s;transition-delay: 0.8s;}
.slider > .wrap .sect.s01 > img {right:130px;}
.slider > .wrap .sect.s02 > img {left :175px;}
.slider > .wrap .sect.s03 > img {right:130px;}
.slider > .wrap .sect.s04 > img {left :175px;}
.slider > .wrap .sect.s01 > .txt {left :430px;transform:translateX(-50%);}
.slider > .wrap .sect.s02 > .txt {right:430px;transform:translateX( 50%);}
.slider > .wrap .sect.s03 > .txt {left :430px;transform:translateX(-50%);}
.slider > .wrap .sect.s04 > .txt {right:430px;transform:translateX( 50%);}
.slider > .wrap .sect.s01 > .txt > .dsc {transform:translateX(-30px);}
.slider > .wrap .sect.s02 > .txt > .dsc {transform:translateX( 30px);}
.slider > .wrap .sect.s03 > .txt > .dsc {transform:translateX(-30px);}
.slider > .wrap .sect.s04 > .txt > .dsc {transform:translateX( 30px);}
.slider > .wrap .sect.on > img {opacity:1;}
.slider > .wrap .sect.on > .txt > .tit {opacity:1;transform:translateY(0) !important;}
.slider > .wrap .sect.on > .txt > .dsc {opacity:1;transform:translateX(0) !important;}
.slider > .btn {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:1300px;}
.slider > .btn:after {display:block;content:"";clear:both;}
.slider > .btn > a {display:block;font-size:0;width:45px;height:63px;background:no-repeat center center;background-size:contain;}
.slider > .btn > a.prev {float:left ;background-image:url('../img/home_slider_btn_L.png');}
.slider > .btn > a.next {float:right;background-image:url('../img/home_slider_btn_R.png');}

.sect-info {padding:60px 0;text-align:center;}
.sect-info > img {display:block;margin:0 auto 20px;transform:scale(0.9);}
.sect-info > p {line-height:38px;font-size:38px;color:#313131;font-family:'Nanum Pen Script';}

#LAYOUT_TAIL {height:128px;background-color:#f6f5f5;}
#LAYOUT_TAIL > .wrap {width:1300px;margin:0 auto;}
#LAYOUT_TAIL > .wrap > .fl {margin-left:0;padding-top:32px;line-height:32px;font-size:18px;color:#1d1d1d;font-family:'NEXON Lv1 Gothic Low OTF';}
#LAYOUT_TAIL > .wrap > .fl > p {}
#LAYOUT_TAIL > .wrap > .fr {margin-right:0;padding-top:39px;}
#LAYOUT_TAIL > .wrap > .fr:after {display:block;content:"";clear:both;}
#LAYOUT_TAIL > .wrap > .fr > a {float:left;display:block;margin-left:20px;}
#LAYOUT_TAIL > .wrap > .fr > a:first-child {margin-left:0;}
#LAYOUT_TAIL > .wrap > .fr > a img {display:block;}

/*================================================================================================
 * Tablet & Mobile 공용 : ~ 1023px
 *================================================================================================*/
@media (max-width:1023px) /* (max-width:1025px) */
{
}

/*================================================================================================
 * Tablet : 638px~1023px 해상도에서 해석하는 코드 
 *================================================================================================*/
@media (min-width:638px) and (max-width:1023px) /* (max-width:1025px) */
{   
}

/*================================================================================================
 * Mobile : 637px 이하 해상도에서 해석하는 코드
 *================================================================================================*/
@media(max-width:637px)
{
}

/*================================================================================================
 * Mobile : ~379px 해상도에서 해석하는 코드 (해상도 낮은 Mobile)
 *================================================================================================*/
@media (max-width:379px) /* (max-width:1025px) */
{
}