
/* Google Web Fonts CDN */
/* @import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700,900&display=swap'); */

body {
  background-image:linear-gradient( rgba(255,255,255,0.01), rgba(255, 255, 255, 0.02)), url(/kr/img/intro_only/intro_bg_winter.gif); background-size:cover; width:100%; height:100vh;
  font-family: 's-core-dream-light';    
  font-size: 15px;
  font-weight: 400;
}
a {  text-decoration: none; }
.intro {    position:relative;padding: 50px 0 0;text-align:center; }
.intro .logo {width: 130px;height: 33px; margin:0 auto 15px; background: url(/common/tmpl/skinB/img/logo.png)no-repeat;background: url(/common/tmpl/skinB/img/logo.svg)no-repeat; font-size:0;}
.intro > .tit {}

.intro .group .top_btn ul {margin-bottom:10px;}
.intro .group .top_btn ul:after {content:''; display:block; overflow:hidden; clear:both;}
.intro .group .top_btn ul li:first-child {float:left;}
.intro .group .top_btn ul li:last-child {float:right;}

.intro .group .bannerbox { float:left;width: 100%;   text-align: center;  margin-top: 20px;}
.banner {  width: 24%;  padding: 15px 15px;  box-sizing: border-box;  background: rgba(250,250,250,0.6);  border-radius: 10px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);    position: relative;  display: inline-block;  margin: 0 1% 0 0;  transition: 0.5s;  }
.banner:last-child {margin: 0;}
.banner .button {   background-color: #5c79ba;  color: #fff;  padding: 5px;  border-radius: 30px;  text-transform: capitalize;  display: inline-block;  width: 70%;}
.banner .pic {    width: 100%;    display: inline-block;  position: relative; }
.banner img {  border-radius: 10px; }
/* .banner img {  border-radius: 10px;  box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);  } */

.detail  {  border-top: 1px solid #eee;  padding-top: 15px;  margin-top: 20px; }
.detail h1 {font-size: 18px; font-weight: 500; margin:0px 0px 0px 0px; }
.detail p {font-size: 16px; font-weight: 400; margin: 0px 0px 5px 0px;}

/* box box1 */
.intro .group .box1 {float: left;width: 49%;margin: 0 2% 0 0; background: rgba(250,250,250,0.7);  border-radius: 10px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); text-align: left;position:relative;overflow:hidden;border: 3px solid #3b4991;box-sizing:border-box;}
.intro .group .box1 span {font-size: 24px; font-weight: 600; margin: 0px; vertical-align: middle;}
.intro .group .box1 .ico {display:inline-block;width:50px;height:40px;background: url(/kr/img/intro_only/main_icon01.png)no-repeat; margin: 0px;}
.intro .group .box1 .ico.ico2 {background-position:-55px 0;}
.intro .group .box1 .ico.ico3 {background-position:-110px 0;}
.intro .group .box1 .ico.ico4 {background-position:-165px 0;}

.intro .group .box1 .type1{color: #3a3a3a;font-size:16px;margin: 0px 0 10px 0;font-weight: 500;}
.intro .group .box1 .type2{color: #3a3a3a;font-size:18px;margin: 8px 0 0 0;font-weight: 500;}
.intro .group .box1 .bold{color: #2f4daf;}
.intro .group .box1 .type2:hover a {color: #2ba64a;}
.intro .group .box1 h2 {font-size: 24px; font-weight: 600; margin: 0 0 3px 0; color: #3b4991;} 
.intro .group .box1 h3 {font-size: 24px; font-weight: 600; margin: 2px 0 3px 0; color: #068a6d;}

.intro .group .box1 ul li {position:relative;padding-left: 105px;margin:5px 0 8px 0;font-size:18px;font-weight:600;color: #107d56;letter-spacing: -0.05em;}
.intro .group .box1 ul li:after {content:'';position:absolute;width:1px;height:100%;left: 90px;top:0;background:#3b4991;}
.intro .group .box1 ul li:last-child {line-height:25px;}
.intro .group .box1 ul li:last-child span {line-height:25px;}
.intro .group .box1 ul li span {font-weight:500;color:#3f3f3f; font-size:18px; position:absolute; left:0; top:0;letter-spacing: -0.05em;}

.intro .group .box1 ul.btn_list {content:''; display:block; overflow:hidden; clear:both;}
.intro .group .box1 ul.btn_list li {width:calc(95% - 6px); float:left; background:#3b4991; margin:10px 10px 0px 0; border-radius:20px; transition:0.3s; position:relative; padding-left:30px;}
.intro .group .box1 ul.btn_list li:after {content:''; width:7px; height:11px; background:url(/kr/img/intro_only/arrow.png); position:absolute; right:25px; top:40%; transition:0.3s; left:auto}
.intro .group .box1 ul.btn_list li:hover:after, .box1 ul.btn_list li:focus:after {background:url(/kr/img/intro_only/arrow_hover2.png);}

.intro .group .box1 ul.btn_list li:hover, .box1 ul.btn_list li:focus {background:#141d2a;}
.intro .group .box1 ul.btn_list li ~ li {margin-left:8px;}
.intro .group .box1 ul.btn_list li a {display:inline-block; color:#fff; padding:8px 0 8px 0px; font-size:18px; font-weight:500; transition:color 0.3s;  }
.intro .group .box1 ul.btn_list li:hover a, .box1 ul.btn_list li:focus a {color:#ff3;}
.intro .group .box1 ul.btn_list li a {display: block;}

/* box box2 */
.intro .group .box2 {float: left;width: 49%;margin: 0; background: rgba(250,250,250,0.7);  border-radius: 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); text-align: left;position:relative;overflow:hidden;border: 3px solid #107d56;box-sizing:border-box;}
/*.intro .group .box2:after {content:'';width:120px;height:120px;background:url(/kr/img/intro_only/2026_pyunip.png)no-repeat;position:absolute;right: 30px;bottom: 60px;} */

.intro .group .box2 span {font-size: 24px; font-weight: 600; margin: 0px; vertical-align: middle;}
.intro .group .box2 h2 {font-size: 24px; font-weight: 600; margin: 0 0 3px 0; color: #3b4991;} 
.intro .group .box2 h3 {font-size: 24px; font-weight: 600; margin: 2px 0 3px 0; color: #068a6d;}
.intro .group .box2 p {color: #202020;font-size:18px;margin: 0px 0 0px 0;font-weight: 400;}
.intro .group .box2 p a {color:#f9c2c2;  font-weight:500; transition:color 0.3s;  }
.intro .group .box2 p a:hover {color:#ff3;  transition:color 0.3s;  }

.intro .group .box2 .type1{color: #3a3a3a;font-size:16px;margin: 0px 0 10px 0;font-weight: 500;}
.intro .group .box2 .type2{color: #3a3a3a;font-size:18px;margin: 5px 0 0 0;font-weight: 500;}
.intro .group .box2 .type3{color: #107d56;font-size:15px;margin: 0px 0 0 0px;font-weight: 500;}
.intro .group .box2 .bold{color: #107d56;}
.intro .group .box2 .type2:hover a {color: #2ba64a;}

.intro .group .box2 .ico {display:inline-block;width:50px;height:40px;background: url(/kr/img/intro_only/main_icon01.png)no-repeat; margin: 0px;}
.intro .group .box2 .ico.ico2 {background-position:-55px 0;}
.intro .group .box2 .ico.ico3 {background-position:-110px 0;}
.intro .group .box2 .ico.ico4 {background-position:-165px 0;}

.intro .group .box2 ul li {position:relative;padding-left: 105px;margin:5px 0 8px 0;font-size:18px;font-weight:600;color: #3b4991;letter-spacing: -0.05em;}
.intro .group .box2 ul li:after {content:'';position:absolute;width:1px;height:100%;left: 90px;top:0;background:#b7b7b7;}
.intro .group .box2 ul li:last-child {line-height:25px;}
.intro .group .box2 ul li:last-child span {line-height:25px;}
.intro .group .box2 ul li span {font-size:18px;font-weight:500;color:#303030;position:absolute; left:0; top:0;letter-spacing: -0.05em;}

.intro .group .box2 ul.btn_list {content:''; display:block; overflow:hidden; clear:both;}
.intro .group .box2 ul.btn_list li {width:calc(95% - 6px); float:left; background:#2ba64a; margin:10px 10px 0px 0; border-radius:20px; transition:0.3s; position:relative; padding-left:30px;}
.intro .group .box2 ul.btn_list li:after {content:''; width:7px; height:11px; background:url(/kr/img/intro_only/arrow.png); position:absolute; right:25px; top:40%; transition:0.3s; left:auto}
.intro .group .box2 ul.btn_list li:hover:after, .box2 ul.btn_list li:focus:after {background:url(/kr/img/intro_only/arrow_hover2.png);}

.intro .group .box2 ul.btn_list li:hover, .box1 ul.btn_list li:focus {background:#144d03;}
.intro .group .box2 ul.btn_list li ~ li {margin-left:8px;}
.intro .group .box2 ul.btn_list li a {display:inline-block; color:#fff; padding:8px 0 8px 0px; font-size:18px; font-weight:500; transition:color 0.3s;  }
.intro .group .box2 ul.btn_list li:hover a, .box2 ul.btn_list li:focus a {color:#ff3;}
.intro .group .box2 ul.btn_list li a {display: block;}

/* 추가 */
.intro .group .box .tit {padding:10px 20px 10px 32px; width:100%; height:50px;   }
.intro .group .box1 .tit {background:url(/kr/img/intro_only/intro_box1_title_bg02.gif)}
.intro .group .box2 .tit {background:url(/kr/img/intro_only/intro_box1_title_bg03.gif)}
.intro .group .box4 .tit {background:url(/kr/img/intro_only/intro_box1_title_bg02.gif)}
.intro .group .box .tit h1 {font-size: 25px; font-weight: 700; color:#ebebeb;}
.intro .group .box .inner {padding:10px 20px 10px 32px;}
.intro .group .box1 .inner {padding:12px 20px 15px 32px;}
.intro .group .box2 .inner {padding:12px 20px 15px 32px;}
.intro .group .box4 .inner {padding:10px 20px 10px 28px;}

/* box box4 */
.intro .group .box4 {float: left;width: 49%;margin: 0; background: rgba(250,250,250,0.7);  border-radius: 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); text-align: left;position:relative;overflow:hidden;border: 3px solid #3b4991;box-sizing:border-box;}
.intro .group .box4:after {content:''; width:153px; height:220px; background:url(/kr/img/intro_only/medal2.png)no-repeat; position:absolute; right:5px; top:50px;}

.intro .group .box4 h2 {font-size: 24px; font-weight: 600; margin: 0 0 3px 0; color: #3b4991;} 
.intro .group .box4 h3 {font-size: 24px; font-weight: 600; margin: 2px 0 3px 0; color: #068a6d;}
.intro .group .box4 p {color: #202020;font-size:18px;margin: 10px 0 10px 0;font-weight: 400;}
.intro .group .box4 .type1{color: #3b4991;font-size:16px;margin: 0 0 15px 0;font-weight: 500;}
.intro .group .box4 .type2{color:#068a6d;;font-size:16px;margin: 0 0 1px 0;font-weight: 500;}

.intro .group .box4 h1 {font-size: 30px; font-weight: 700; color:#fff; }
.intro .group .box4 .inner > ul {margin:5px 0 0 0}
.intro .group .box4 .inner > ul > li {color:#222;padding-left: 20px;font-size: 16px;font-weight: 500;margin: 0 0 5px 0; letter-spacing:-0.045em; position:relative;}
.intro .group .box4 .inner > ul > li:after {content:''; width:13px; height:10px; background:url(/kr/img/intro_only/check_b.png)no-repeat; position:absolute; left:0; top:6px;}
.intro .group .box4 .inner > ul > li > ul {margin-top:0px;}
.intro .group .box4 .inner > ul > li > ul > li {font-weight: 400;padding-left: 15px;letter-spacing:-0.045em; position:relative; font-size: 16px;}
.intro .group .box4 .inner > ul > li > ul > li:after {content:''; width:5px; height:5px; border-radius:50%; position:absolute; background:#a6acb8; left:0; top:10px;}
/* .intro .group .box4 > ul > li > ul > li:first-child:after {content:''; width:5px; height:5px; border-radius:50%; position:absolute; background:#a6acb8; left:0; top:10px;} */
.intro .group .box4  ul li span {color:#c33955;font-weight:bold;font-size:20px;line-height: 1;}
.intro .group .box4  ul li ul li span {color:#0d7c32;font-weight:bold;font-size:18px;line-height: 1;}

.intro .group .box4 ul.btn_list {content:''; display:block; overflow:hidden; clear:both;}
.intro .group .box4 ul.btn_list li {width:calc(48% - 6px); float:left; background:#3b4991; margin:10px 0 0 0; border-radius:30px; transition:0.3s; position:relative; padding-left:30px;}
.intro .group .box4 ul.btn_list li:hover:after, .box1 ul.btn_list li:focus:after {background:url(/kr/img/intro_only/arrow_hover2.png);}
.intro .group .box4 ul.btn_list li:hover, .box1 ul.btn_list li:focus {background:#141d2a;}
.intro .group .box4 ul.btn_list li ~ li {margin-left:8px;}
.intro .group .box4 ul.btn_list li a {display:inline-block; color:#fff; padding:8px 0 8px 0px; font-size:22px; font-weight:500; transition:color 0.3s;  }
.intro .group .box4 ul.btn_list li:hover a, .box1 ul.btn_list li:focus a {color:#ff3;}


.intro .group {width:100%;max-width:1200px;margin: 15px auto;}
.intro .group:after {display:block; clear:both; visibility:hidden; content:''; }

.intro .group .box3 {float:left;width: 100%;margin: 25px 0 0 0;}
.intro .group .box3 ul.list1 {}
.intro .group .box3 ul.list1:after {display:block; clear:both; visibility:hidden; content:'';}
.intro .group .box3 ul.list1 li {width: calc(16.2% - 12px); margin: 0 7.5px 15px; box-sizing: border-box;  background: rgba(250,250,250,0.6);  border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);    position: relative;  display: inline-block; transition: 0.5s;}
.intro .group .box3 ul.list1 li:nth-child(1) {margin: 0px 7.5px 15px 0;}

.intro .group .box3 ul.list1 li a {display:block;position:relative;height: 140px;line-height:1.3;padding: 15px 0 0;border:1px solid #d3d3d3; border-radius: 10px;background:#fff;font-size: 15px;font-weight: 400;color:#000;transition:all 0.3s;-webkit-transition:all 0.3s;}
.intro .group .box3 ul.list1 li a:before {display:block; opacity:0; position:absolute; left:0; top:0; content:''; width:100%; height:100%; border:7px solid #a62b43; box-sizing:border-box; transition:all 0.3s; -webkit-transition:all 0.3s;}
.intro .group .box3 ul.list1 li a:hover,
.intro .group .box3 ul.list1 li a:focus {color:#a62b43; font-weight:bold; }
.intro .group .box3 ul.list1 li a:hover:before,
.intro .group .box3 ul.list1 li a:focus:before {opacity:1;}

.intro .group .box3 ul.list1 li .ico {display:block;width:70px;height:70px;margin:0 auto 10px;background: url(/kr/img/intro_only/ico_ir.png)no-repeat;}
.intro .group .box3 ul.list1 li .ico2 {background-position:-70px 0;}
.intro .group .box3 ul.list1 li .ico3 {background-position:-140px 0;}
.intro .group .box3 ul.list1 li .ico4 {background-position:-210px 0;}
.intro .group .box3 ul.list1 li .ico5 {background-position:0 -70px;}
.intro .group .box3 ul.list1 li .ico6 {background-position:-70px -70px;}
.intro .group .box3 ul.list1 li .ico7 {background-position:-140px -70px;}
.intro .group .box3 ul.list1 li .ico8 {background-position:-210px -70px;}
.intro .group .box3 ul.list1 li .ico9 {display:block;width:70px;height:70px;margin:0 auto 10px;background: url(/kr/img/intro_only/ico_kakao.png)no-repeat;}
.intro .group .box3 ul.list1 li .ico10 {display:block;width:70px;height:70px;margin:0 auto 10px;background: url(/kr/img/intro_only/ico_why.png)no-repeat;}

.intro .copy {
  margin-top: 10px;
  padding: 20px;font-size: 15px;color: #5e5e5e;
  /* background-color: #919191; */
}


@media(max-width:1259px){
  .intro .group {max-width:100%; padding:0 30px;}
  .slideBox .control {right:-10px;}
}

@media(max-width:1199px){
  .intro .group .top_btn {order:1;}
  .intro .group .box1 {float:none; width:100%; margin:0 0 50px; order:2;}
  .intro .group .box2 {float:none; width:100%; margin:0 0 50px; order:3;}
  .intro .group .box4 {float:none; width:100%; margin:0 0 50px; order:4;}
  .intro .group .box3 {float:none; width:100%; margin:0 0 50px; order:5;}
  .intro .group .bannerbox {float:none; width:100%; margin:0 0 50px; order:6;}
  /* .intro .group .box3 {float:none; width:100%; margin:0 0 50px; order:4;}
  .intro .group .box4 {float:none; width:100%; order:5; margin-top:0; margin:0 0 50px;} */
  .intro .group {display:flex; flex-direction:column;}
  /* .intro .group .box4 */

      
}
@media(max-width:726px){
  .intro .group .box1:after {display:none;}    
  .intro .group .box2:after {display:none;}  
  .intro .group .box3 ul.list1 {margin:0 -10px; } 
  .intro .group .box3 ul.list1 li {width:calc(30% - 10px);  margin:0 10px 20px;}
  .intro .group .box3 ul.list1 li:nth-child(1), .intro .group .box3 ul.list1 li:nth-child(5) {margin:0 10px 20px;}  
  .banner { width: 48%;}
  .banner:nth-child(1), .banner:nth-child(3) {margin: 0 2% 10px 0}
  .banner:nth-child(2), .banner:nth-child(4) {margin: 0 0 0 0}
  .banner .detail { display: none;}

/* .intro .group .box1 ul.btn_list li {width:100%;}  */

.intro .group .box1 ul li {padding:25px 0px 0px 10px}
.intro .group .box1 ul.btn_list li {width:100%; padding:0px 0px 0px 20px}
.intro .group .box1 ul.btn_list li:nth-child(2) {margin:10px 0px 10px 0px;} 
.intro .group .box1 ul li:after {display: none;}
.intro .group .box1 ul.btn_list li:after {display: inline-block;}
.intro .group .box2 ul li {padding:25px 0px 0px 10px}
.intro .group .box2 ul.btn_list li {width:100%; padding:0px 0px 0px 20px}
.intro .group .box2 ul.btn_list li:nth-child(2) {margin:10px 0px 10px 0px;} 
.intro .group .box2 ul li:after {display: none;}
.intro .group .box2 ul.btn_list li:after {display: inline-block;}
.intro .group .box4 ul li {padding:12px 0px 0px 10px}
.intro .group .box4 ul li:after {display: none;}
.intro .group .box4 .inner {padding:10px 10px 10px 10px;}
.intro .group .box4:after {content:''; width:107px; height:154px; background:url(/kr/img/intro_only/medal3.png)no-repeat; position:absolute; right:5px; top:50px;}
.intro .group .box .tit h1 {font-size:22px; font-weight: 600; color:#ebebeb;}

/* .intro .group .box1 .inner {padding:10px 10px 10px 10px;} */
}

@media(max-width:580px){
  .intro .group {padding:0 20px;}
  .intro > .tit {padding:0 20px}
  .slideBox {padding:20px 20px 30px;}
  .slideBox .photo_list--wrap {padding:10px;}
  .intro .group .box3 ul.list1 {margin:0 -10px; }   
  .intro .slogan {display:none;}
  .intro .group .box3 ul.list1 li {width:calc(48% - 20px);margin:0 10px 20px;}  
  .intro .group .box3 ul.list1 li:nth-child(1), .intro .group .box3 ul.list1 li:nth-child(6) {margin:0 10px 20px;}  
  .intro .group .box4 .inner > ul > li {margin:-10px -10px 0px -10px;}
  .intro .group .box4 .inner > ul > li > ul {margin:-5px;}
  .intro .group .box4 .inner > ul > li > ul > li {margin-top:-15px}
}
.intro > .tit.tit_mo {display:none;}

@media(max-width:500px){
  .slideBox ul.btn_list li{width:100%;}
  .slideBox ul.btn_list li ~ li {margin-left:0;}  
}
@media(max-width:450px){
  .intro .group .top_btn ul li:first-child {float:left;}
  .intro .group .top_btn ul li:last-child {float:left;}
  .intro .group .top_btn ul li {width:50%;}
}
@media(max-width:420px){
  /* .intro .group .box1 {padding: 45px 30px 45px 30px;} */
/*     .intro .group .box1 ul li {padding:30px 0 0 0; font-size:16px;} */
/*     .intro .group .box1 ul li:last-child {padding:57px 0 0 0;} */
/*     .intro .group .box1 ul li:after {display:none;} */
  /* .intro .group .box4 {padding: 35px 20px 42px 20px;} */
}


@media (max-width:767px){
  .intro > .tit {margin:0 30px;}
}
@media (max-width:600px){
  .intro > .tit.tit_pc {display:none;}
  .intro > .tit.tit_mo {display:block;}
.intro .group .box1 ul.btn_list li {width:100%;}
}
