


 
.overflow-hidden { overflow: hidden; }
.pc_enter {display:block;}
 

/*main_contents*/
#contents {position:relative;width:1320px; margin:70px auto;}

.main_h2 {font-size:1.6em; text-align:center; font-weight:bold;padding-bottom:50px;}
.main_h2 span {font-size:2.0em; color:#0066b3; }

/*¸ÞÀÎºñÁÖ¾ó*/
#recentMB1 {width:100%;height:800px; z-index:1;margin-top:-50px;background: url(/customized/images/main/main_visual_bg.jpg) 0 50% repeat-y; position: relative; background-size:100%;  }
#recentMB1 .banner {width:1320px; margin:0 auto;font-size:1.3em;  text-align:center; position: relative;}
#recentMB1 .bannerCopy{ padding-top:220px;}
#recentMB1 .active-slide .bannerCopy div{animation-name:fadeInUp;}

#recentMB1 .banner .bannerCopy div:nth-child(1) {animation-delay:1s;   line-height:140%; letter-spacing:-1px;}
#recentMB1 .banner .bannerCopy div:nth-child(2) {animation-delay:1.5s;   line-height:120%; letter-spacing:-1px;}
#recentMB1 .banner .bannerCopy div:nth-child(3) {margin-top:20px; animation-delay:2s;display:inline-block;  line-height:120%; letter-spacing:-1px;}
#recentMB1 .banner .bannerCopy div:nth-child(3) p { font-family: 'yg-jalnan'; font-size:23px; padding:5px 15px 0 15px;  border-radius:20px; background-color:#2b1f1f;color:#fff;}
#recentMB1 .banner .bannerCopy div:nth-child(3) p span {  font-size:28px;  }
#recentMB1 .banner .bannerCopy div:nth-child(4) {  animation-delay:2.5s ;  font-family: 'GmarketSansMedium'; font-size:18px;color:#222; margin-top:30px;}
#recentMB1 .banner .bannerCopy .bannerCopy2 span {color:#358715;}


 
#recentMB1 .banner .bannerCopy div:nth-child(4) .character01 {width:23%;  position:absolute; left:0; top:-50px;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character02 {width:22%;  position:absolute; left:26%; top:10px; z-index:1;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character03 {width:23%;  position:absolute; left:50%; top:10px;z-index:0;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character04 {width:23%;  position:absolute; left:75%; top:-50px;}
 

 @-webkit-keyframes drop { 0% { -webkit-transform: translateY(0rem); transform: translateY(0rem); }
50% { -webkit-transform: translateY(0.85rem); transform: translateY(0.85rem); }
100% { -webkit-transform: translateY(0rem); transform: translateY(0rem); } }

@keyframes drop { 0% { -webkit-transform: translateY(0rem); transform: translateY(0rem); }
50% { -webkit-transform: translateY(0.85rem); transform: translateY(0.85rem); }
100% { -webkit-transform: translateY(0rem); transform: translateY(0rem); } }




/*ÈÄ¿ø*/
.partner h2 {font-size:25px; color:#222; margin-bottom:15px;}
.partner img {padding:0 15px;}


/*À¯Æ©ºê*/
.youtube_wrap {margin-top:60px; overflow:hidden; position:relative;  clear:both;}
.youtube_wrap h2 {clear:both; color:#44844a;font-family: 'yg-jalnan'; font-size:37px; }
.youtube_wrap h2 > span {color:#000; }
 
.youtube_wrap h2 .h2_color_m {position:relative; color:#4d8952;}
.youtube_wrap h2 .h2_color_b {position:relative; color:#c53239;}
.youtube_wrap h2 .h2_color_t {position:relative; color:#d67234;}
.youtube_wrap h2 .h2_color_i {position:relative; color:#304d89;}

.youtube_wrap h2 .h2_color_m:before {content:''; position:absolute; top:-7px; border-radius:50%; left:45%; width:5px; height:5px; background-color:#4d8952;}
.youtube_wrap h2 .h2_color_b:before {content:''; position:absolute; top:-7px; border-radius:50%; left:45%; width:5px; height:5px; background-color:#c53239;}
.youtube_wrap h2 .h2_color_t:before {content:''; position:absolute; top:-7px; border-radius:50%; left:45%; width:5px; height:5px; background-color:#d67234;}
.youtube_wrap h2 .h2_color_i:before {content:''; position:absolute; top:-7px; border-radius:50%; left:45%; width:5px; height:5px; background-color:#304d89;}


.youtube_wrap p {font-size:23px; color:#222; font-family: "nanumsquare"; font-weight:bold;}
.youtube_wrap p span {display:block; font-size:17px; letter-spacing:-1px; margin-bottom:50px;}


.youtube_left {background:#fff; box-sizing:border-box; width:59%; min-height:420px; margin:0 3% 5px 1%; float:left; display:inline-block; padding:20px 20px;border: 3px solid #fff;background-color: rgba(255, 255, 255, 0.6);border-radius: 20px;-webkit-box-shadow: 3px 7px 18px 0px rgba(0, 0, 0, 0.21);box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.21);}
.youtube_left #youtube_iframe {width:100%; height:420px;}



/*¸ÞÀÎ¾ÆÀÌÄÜ*/
.m_icon ul { float:right; width:37%; }
.m_icon li {float:left;}
.m_icon li a{width:210px; height:210px; box-sizing:border-box;text-align:center;display:inline-block;margin:10px 20px 25px 0;  border-radius:50%; padding:140px 20px 0 20px ;}
.m_icon li:last-child {margin-right:0;}
.m_icon li a{display:block;}

.m_icon li p {border-top:1px dotted #e6e6e6; color:#fff;font-size:1.4em; padding-top:15px;font-weight:bold;}
.m_icon li span {color:#bae1ff;font-size:1.3em;}

.m_icon li:nth-child(1) a{background:#53b28e url(/customized/images/main/m_ico_01.png) 50% 25% no-repeat;transition: all 0.2s ease 0s;}
.m_icon li:nth-child(2) a{background:#f3786c url(/customized/images/main/m_ico_04.png) 50% 27% no-repeat;transition: all 0.2s ease 0s;}
.m_icon li:nth-child(3) a{background:#f2a746 url(/customized/images/main/m_ico_03.png) 50% 30% no-repeat;transition: all 0.2s ease 0s;}
.m_icon li:nth-child(4) a{background:#6990cb url(/customized/images/main/m_ico_02.png) 50% 30% no-repeat;transition: all 0.2s ease 0s;}
.m_icon li:hover:nth-child(1) a{background-position: 50% 20%;transition: all 0.2s ease 0s;}
.m_icon li:hover:nth-child(2) a{background-position: 50% 20%;transition: all 0.2s ease 0s;}
.m_icon li:hover:nth-child(3) a{background-position: 50% 25%;transition: all 0.2s ease 0s;}
.m_icon li:hover:nth-child(4) a{background-position: 50% 25%;transition: all 0.2s ease 0s;}


/*°øÁö»çÇ×*/
#notice_wrap {background-color:#eddfcb; width:100%; padding-bottom:40px; overflow:hidden;position:relative;  margin:0 auto;}
.notice { float:left; position:relative; width:40%; padding:25px; border-radius:20px;  box-sizing:border-box; display:inline-block; height:360px; background-color:#f6efe5; }
.notice h2 { padding-bottom:15px; font-weight:bold; box-sizing:border-box;border-bottom:1px solid #ddd; font-size:1.8em; color:#955f13;}
.notice div {position:absolute; right:20px; top:20px;}

.notice ul {clear:both;  padding:15px 0 0 10px;}
.notice li {font-size:15px;display: inline;float: left;width:97%;padding:8px 0 6px 5px;background:url(/customized/images/main/notice_dot.gif) no-repeat 1px 15px;color:#8f7d69;}
.notice li a{text-overflow:ellipsis; white-space:nowrap; overflow:hidden;display:block;  height:1.25em;  max-width:70%; float: left;padding:0 6px;color:#8f7d69;white-space: nowrap;font-size:1.0em;line-height:16px;letter-spacing:0;border-right:0;}
.notice li span {font-size: 15px;color:#8f7d69;float: right;display: block;}

 


/*swiper*/
.swiper_wrap {
height: 350px;
width:79%; 
margin-left:43%;
box-sizing:border-box;

}

.swiper_wrap h2 {font-size:25px; color:#222; margin-bottom:20px;}
.swiper_wrap h2 span {color:#955f13;}
.swiper_wrap .more a{position:absolute; right:0; top:0px;   font-size:30px;color:#955f13;}

.swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 57%!important;
    height: 4px;
    left: 43%!important;
     bottom: 0!important;
}

.swiper {
width: 100%;
height: 100%;
}

.swiper-slide {
text-align: center;
font-size: 16px;
/* Center slide text vertically
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center; */
overflow: hidden;
text-overflow: ellipsis;
height: 36px;
 line-height: 130%;
 white-space: nowrap;
 margin-right:0px!important;
 
}


.swiper-slide .img  {
display: block;border:1px solid #ddd;
background-color:#fff;
width: 230px;
height: 230px;
border-radius:20px;
position: relative;
 }

.swiper-slide .img > img {
width:100%;height:100%;
border-radius:20px;
object-fit: cover;
text-align:center;
 }


.swiper-slide:hover .img:before { position: absolute;top: 50%;left: 50%;z-index: 5;
width: 80px;height: 80px;margin-top: -40px;margin-left: -40px;background: url("/customized/images/main/split_img.png") no-repeat 50% 58%;content: '';}
.swiper-slide:hover .img:after {border-radius:20px;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(190, 50, 57, 0.85); content: ''; }
.swiper-slide:hover .swiper_view { background-color:#222; color:#fff;}


.swiper-slide .name {color:#222; font-size:16px;overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width:70%;display:inline-block; margin-top:10px;}


.swiper-button-next, .swiper-rtl .swiper-button-prev {display:none;}
.swiper-button-prev, .swiper-rtl .swiper-button-next {display:none;}

.swiper-pagination-progressbar { background: rgba(255,255,255,.55)!important; top:100%!important;}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #ae8657!important;}




@media (min-width:1400px) and (max-width:1700px) {

/*swiper*/
.swiper_wrap {width:71%; margin-left:43%;}
.swiper-slide .img  {width: 180px;height: 230px;}
}


@media only screen and (max-width:1400px){
#wrap { width: 100%;  min-width: 100%;}

#contents {width:100%; }



/*¸ÞÀÎºñÁÖ¾ó*/
#recentMB1 { height:850px;    }
#recentMB1 .banner {width:100%;}

/*°øÁö»çÇ×*/
#notice_wrap { padding-bottom: 0px;}
.notice {  width:92%; margin-left:4%; height:auto; overflow:hidden;}
.notice h2 {
    padding-bottom: 10px;
    border-bottom: 1px solid #ddd;
    font-size: 1.6em;
}
.notice ul {clear:both;  padding:15px 0 0 10px;}
.notice li {font-size:15px;display: inline;float: left;width:95%;padding:8px 0 6px 5px;background:url(/customized/images/main/notice_dot.gif) no-repeat 1px 15px;}
.notice li a{text-overflow:ellipsis; white-space:nowrap; overflow:hidden;display:block;  height:1.25em;  max-width:70%; float: left;padding:0 6px;color:#414141;white-space: nowrap;font-size:1.0em;line-height:16px;letter-spacing:0;border-right:0;color:#555}
.notice li span {font-size: 15px;color: #b78721;float: right;display: block;}
 
 
/*swiper*/
.swiper_wrap {
clear:both;
height: 400px;
width:96%; 
margin-left:4%;
padding-top:50px;
position:relative; 
}

.swiper_wrap h2 {font-size:20px; padding: 0px 0 10px 0px;}
.swiper_wrap .more a{position:absolute; right:0; top:400px;   font-size:30px;color:#955f13;}

.swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
width: 92%!important;
height: 4px;
left: 0%!important;
bottom:0px!important;
margin-left:4%;
}


.swiper_wrap .more a{ right:4%;top:55px; }
.swiper_wrap .more a img {width:40px;}

}


 


/* Tablet Device ÃÖ¼Ò 900 ~ 1199  */
@media (max-width:1250px) {

#container  {width:100%; height:100%;}


/*¸ÞÀÎºñÁÖ¾ó*/
#recentMB1 { margin-top:-130px }

#recentMB1 .bannerCopy{  padding-top:280px; padding-left:20px;}
#recentMB1 .banner .bannerCopy div:nth-child(1) {font-size:30px;color:#222; line-height:140%; }
#recentMB1 .banner .bannerCopy div:nth-child(2) {font-size:40px; color:#2faf15; line-height:120%;  }
#recentMB1 .banner .bannerCopy div:nth-child(3) {font-size:40px; color:#ff9600; line-height:120%;  }
#recentMB1 .banner .bannerCopy div:nth-child(4) {font-size:18px;color:#222; margin-top:30px;}
#recentMB1 .banner .bannerCopy .bannerCopy2 span {color:#358715;}


#modal .modal-bg .modal-cont {padding:10px;width:80%;height:60%;}
 
/*À¯Æ©ºê*/
.youtube_wrap h2 { font-size:29px;  }
.youtube_wrap h2 span {display:block;}

.youtube_wrap p {font-size:21px; line-height:120%; }
.youtube_wrap p span { font-size:18px;  font-weight:300; margin-bottom:30px;}

.youtube_left { width:92%;overflow:hidden;  min-height:180px; margin:0 4% 30px 4%;   padding:10px; }
 
.youtube_wrap h2 .h2_color_m:before {top:-3px; }
.youtube_wrap h2 .h2_color_b:before {top:-3px; }
.youtube_wrap h2 .h2_color_t:before {top:-3px; }
.youtube_wrap h2 .h2_color_i:before {top:-3px; }
 
 
/*¸ÞÀÎ¾ÆÀÌÄÜ*/
.m_icon ul { float:none; width:840px; clear:both;   margin:0 auto 10px auto;}
.m_icon li a {width:200px; height:200px; box-sizing:border-box; margin:0 10px 20px 0;  background-position:50% 20%; }
 
.m_icon li p { font-size:1.2em; padding-top:10px;}
.m_icon li span { font-size:1em;}
  
.swiper-slide .img  {width: 175px;height: 175px;}
  
/*swiper*/
.swiper_wrap {
 position:relative; 
}

}


 


/* Tablet Device ÃÖ¼Ò 590 ~ 899  */
@media (max-width:899px) {
.mobile_enter {display:block;}
.pc_enter {display:block;}

.letter_s {letter-spacing:-1px;}

#container  {width:100%; height:100%;  }
#contents {width:100%; }


/*¸ÞÀÎºñÁÖ¾ó*/
#recentMB1 { height:720px;  margin-top:-150px;   }
#recentMB1 .bannerCopy{  padding-top:300px; padding-left:20px;}
#recentMB1 .banner .bannerCopy .bannerCopy1 img {max-width:303px;}
#recentMB1 .banner .bannerCopy .bannerCopy2 img {max-width:338px;margin:5px 0;}
#recentMB1 .banner .bannerCopy .bannerCopy3 img {max-width:323px; }



/*¸ÞÀÎ¾ÆÀÌÄÜ*/
.m_icon ul {   width:600px;  }
.m_icon li a {width:140px; height:140px;  padding:95px 20px 0 20px ;   }
 
 
.m_icon li:nth-child(1) a{background-position:50% 30%; background-size:60px;}
.m_icon li:nth-child(2) a{background-position:50% 30%; background-size:40px;}
.m_icon li:nth-child(3) a{background-position:50% 30%; background-size:40px;}
.m_icon li:nth-child(4) a{background-position:50% 30%; background-size:50px;}

#recentMB1 .banner .bannerCopy div:nth-child(4) .character01 {max-width:300px;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character02 {max-width:300px;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character03 {max-width:300px;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character04 {max-width:300px;}



}





@media (max-width:759px) {
#contents {width:100%; margin:50px auto;}

#main_contents_01 ul {width:580px; margin:0 auto;}
#main_contents_01 li {width:130px; height:130px; margin-right:10px; margin-bottom:15px;padding:75px 5px 0 5px ;}

#modal { top:10%;  }

#recentMB1 .banner .bannerCopy div:nth-child(1) {font-size:20px;color:#222; line-height:140%; }
#recentMB1 .banner .bannerCopy div:nth-child(2) {font-size:30px; color:#2faf15; line-height:120%;  }
#recentMB1 .banner .bannerCopy div:nth-child(3) {font-size:30px; color:#ff9600; line-height:120%;  }
#recentMB1 .banner .bannerCopy div:nth-child(4) {font-size:14px;color:#222; margin-top:30px;}
#recentMB1 .banner .bannerCopy .bannerCopy2 span {color:#358715;}
 
 
/*¸ÞÀÎ¾ÆÀÌÄÜ*/
.m_icon ul {   width:588px;  }
.m_icon li a {width:137px; height:137px;  padding:95px 20px 0 20px ;   }
 
.youtube_left #youtube_iframe { height:250px;}

}






/* Mobile Device ÃÖ¼Ò ~ ÃÖ´ë 589 */
@media (max-width:589px) {

.pc_enter {display:inline-block;}

.mobile_enter {display:block;}
.letter_s {letter-spacing:-1px;}

#container  {width:100%; height:100%;}
#contents {width:100%; margin:30px auto;}

.main_h2 {font-size:1.2em; padding-bottom:10px; }
.main_h2 span {font-size:1.7em;}
 

/*¸ÞÀÎºñÁÖ¾ó*/
#recentMB1 { height:490px;  margin-top:-30px;   }

#recentMB1 .bannerCopy{  padding-top:160px; padding-left:10px;}

#recentMB1 .banner .bannerCopy div:nth-child(1) img {max-width:250px;}
#recentMB1 .banner .bannerCopy div:nth-child(2) img {max-width:310px;}
#recentMB1 .banner .bannerCopy div:nth-child(3) {margin-top:10px;}
#recentMB1 .banner .bannerCopy div:nth-child(3) p {  font-size:17px; padding:5px 15px 0 15px;   }
#recentMB1 .banner .bannerCopy div:nth-child(3) p span {  font-size:18px;  }
#recentMB1 .banner .bannerCopy div:nth-child(4) {animation-delay:2.5s; font-family: 'GmarketSansMedium'; font-size:18px;color:#222; margin-top:30px;}
#recentMB1 .banner .bannerCopy .bannerCopy2 span {color:#358715;}

#recentMB1 .banner .bannerCopy div:nth-child(4) .character01 {width:23%;  position:absolute; left:0; top:-10px;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character02 {width:22%;  position:absolute; left:26%; top:10px; z-index:1;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character03 {width:23%;  position:absolute; left:50%; top:10px;z-index:0;}
#recentMB1 .banner .bannerCopy div:nth-child(4) .character04 {width:23%;  position:absolute; left:75%; top:-10px;}
 

/*À¯Æ©ºê*/
.youtube_left #youtube_iframe { height:180px;}
.youtube_wrap h2 { font-size:25px;  }

.youtube_wrap p {font-size:18px;  }
.youtube_wrap p span { font-size:16px;   }
 

/*¸ÞÀÎ¾ÆÀÌÄÜ*/
.m_icon ul { float:none; width:300px;  }
.m_icon li a {width:140px; height:140px;  }

 
.swiper-slide .img  {width: 140px;height: 140px;}
.swiper_wrap { padding-top: 30px;  height: 290px;}
.swiper_wrap .more a {top: 35px;}

/*ÈÄ¿ø*/
.partner img {height:35px;}

}





 


/* Mobile Device ÃÖ¼Ò ~ ÃÖ´ë 589 */
@media (max-width:430px) {
.swiper-slide .img  {width: 140px;height: 140px;}

/*¸ÞÀÎºñÁÖ¾ó*/
#recentMB1 { height:440px;  margin-top:-10px;   }


}