@charset "utf-8";

button[data-control],
.slick-arrow{position:relative;display:inline-block;margin:0 -4px;width:25px;height:25px;vertical-align:middle;overflow: hidden;}
.slick-arrow:before,
.slick-arrow:after,
button[data-control]:before,
button[data-control]:after {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;margin: auto;}
button[data-control="prev"]:before,
button[data-control="next"]:before{width: calc(100%/2.5);height: calc(100%/2.5);border-width:2px;border-style: solid;border-color: #333;transform: rotate(45deg);}
button[data-control="prev"]:before{right: -5px;border-width: 0 0 2px 2px;}
button[data-control="next"]:before{left: -5px;border-width: 2px 2px 0 0;}
button[data-control="stop"]:before{width: 2px;height: calc(100%/2);box-shadow: -3px 0 #333, 3px 0 #333;}
button[data-control="play"]:before{right: -5px;width: 0;height: 0;border-width: 10px 0 10px 15px;border-style: solid;border-color: transparent transparent transparent #333;}

body {background:url(/kr/img/intro_only/intro_bg_winter.gif) no-repeat; background-size:cover; width:100%; height:100vh;}
.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; }
.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;}


.intro .group .box1 {float: left;width: 33%;margin: 0px 0.5% 0px 0px;background-color: rgba(255,255,255, 0.7);box-shadow: 8px 5px 20px rgb(0 0 0 / 14%);padding: 20px 30px 15px 30px;text-align: left;position:relative;overflow:hidden;border: 5px solid #a62b44e5;box-sizing:border-box; border-radius: 10px;}
.intro .group .box1:before {content:'';width:212px;height:291px;background:url(/kr/img/intro_only/box1_img01.png)no-repeat;position:absolute;right: -110px;bottom: -100px;}

.intro .group .box1 p {color: #202020;font-size:16px;margin: 5px 0 10px 20px;line-height: 153%;font-weight: 400;}
.intro .group .box1 .type1{color: #a62b43;font-size:20px;margin: 17px 0 5px 0;font-weight: 500;}
.intro .group .box1 .type2{color: #4c5870;font-size:16px;margin: 5px 0 5px 0;font-weight: 400;}

.intro .group .box1 ul li {position:relative;padding-left: 70px;margin:10px 0 10px 0;font-size:17px;color: #a62b43;letter-spacing: -0.05em;}

.intro .group .box1 ul li:after {content:'';position:absolute;width:1px;height:100%;left: 60px;top:0;background:#b7b7b7;}
.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:bold; color: #303030;position:absolute; left:0; top:0;}
.intro .group .box1 ul.btn_list {content:''; display:block; overflow:hidden; clear:both;}
.intro .group .box1 ul.btn_list li {width:calc(90% - 6px); float:left; background:#852236; margin:5px 0 0 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;}


.intro .group .box12 {float: left;width: 33%;margin: 0px 0.5% 0px 0px;background-color: rgba(255,255,255, 0.7);box-shadow: 8px 5px 20px rgb(0 0 0 / 14%);padding: 20px 30px 15px 30px;text-align: left;position:relative;overflow:hidden;border: 5px solid #3b4991;box-sizing:border-box; border-radius: 10px;}
.intro .group .box12:before {content:'';width:212px;height:291px;background:url(/kr/img/intro_only/box1_img02.png)no-repeat;position:absolute;right: -100px;bottom: -100px;}
.intro .group .box12 p {color: #202020;font-size:17px;margin: 5px 0 10px 20px;line-height: 215%;font-weight: 400;}
.intro .group .box12 .type1{color: #a62b43;font-size:20px;margin: 17px 0 5px 0;font-weight: 500;}
.intro .group .box12 .type2{color: #4c5870;font-size:16px;margin: 5px 0 5px 0;font-weight: 400;}

.intro .group .box12 ul li {position:relative;padding-left: 70px;margin:10px 0 10px 0;font-size:17px;color:  #3b4991;letter-spacing: -0.05em;}
.intro .group .box12 ul li:after {content:'';position:absolute;width:1px;height:100%;left: 60px;top:0;background:#b7b7b7;}
.intro .group .box12 ul li:last-child {line-height:25px;}
.intro .group .box12 ul li:last-child span {line-height:25px;}
.intro .group .box12 ul li span {font-weight:bold; color: #3f3f3f;position:absolute; left:0; top:0;}

.intro .group .box12 ul.btn_list {content:''; display:block; overflow:hidden; clear:both;}
.intro .group .box12 ul.btn_list li {width:calc(90% - 6px); float:left; background:#3b4991; margin:5px 0 0 0; border-radius:20px; transition:0.3s; position:relative; padding-left:30px;}
.intro .group .box12 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 .box12 ul.btn_list li:hover:after, .box12 ul.btn_list li:focus:after {background:url(/kr/img/intro_only/arrow_hover2.png);}
.intro .group .box12 ul.btn_list li:hover, .box12 ul.btn_list li:focus {background:#141d2a;}
.intro .group .box12 ul.btn_list li ~ li {margin-left:8px;}
.intro .group .box12 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 .box12 ul.btn_list li:hover a, .box12 ul.btn_list li:focus a {color:#ff3;}
.intro .group .box12 ul.btn_list li a {display: block;}

.intro .group .box13 {float: left;width: 33%;margin: 0px 0px 0px 0px;background-color: rgba(255,255,255, 0.7);box-shadow: 8px 5px 20px rgb(0 0 0 / 14%);padding: 20px 30px 15px 30px;text-align: left;position:relative;overflow:hidden;border: 5px solid #107d56;box-sizing:border-box; border-radius: 10px;} 
.intro .group .box13:before {content:'';width:212px;height:291px;background:url(/kr/img/intro_only/box3_img01.png)no-repeat;position:absolute;right: -100px;bottom: -100px;}
.intro .group .box13 p {color: #202020;font-size:15px;margin: 5px 0 10px 20px;line-height: 125%; font-weight: 400;}
.intro .group .box13 .type1{color: #a62b43;font-size:20px;margin: 17px 0 5px 0;font-weight: 500;}
.intro .group .box13 .type2{color: #4c5870;font-size:16px;margin: 5px 0 5px 0;font-weight: 400;}

.intro .group .box13 ul li {position:relative;padding-left: 70px;margin:10px 0 10px 0;font-size:17px;color: #116827;;letter-spacing: -0.05em;}
.intro .group .box13 ul li:after {content:'';position:absolute;width:1px;height:100%;left: 60px;top:0;background:#b7b7b7;}
.intro .group .box13 ul li:last-child {line-height:25px;}
.intro .group .box13 ul li:last-child span {line-height:25px;}
.intro .group .box13 ul li span {font-weight:bold; color: #303030;position:absolute; left:0; top:0;}

.intro .group .box13 ul.btn_list {content:''; display:block; overflow:hidden; clear:both;}
.intro .group .box13 ul.btn_list li {width:calc(90% - 6px); float:left; background:#116827; margin:5px 0 0 0; border-radius:30px; transition:0.3s; position:relative; padding-left:30px;}
.intro .group .box13 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 .box13 ul.btn_list li:hover:after, .box13 ul.btn_list li:focus:after {background:url(/kr/img/intro_only/arrow_hover2.png);}
.intro .group .box13 ul.btn_list li:hover, .box13 ul.btn_list li:focus {background:#852236;}
.intro .group .box13 ul.btn_list li ~ li {margin-left:8px;}
.intro .group .box13 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 .box13 ul.btn_list li:hover a, .box13 ul.btn_list li:focus a {color:#ff3;}

.intro .group .box13 ul.btn_list li a {display: block;}

.intro .group .box3 {float: left;width: 100%;margin-top: 10px;text-align: center;position:relative;}
.intro .group .box3 .tbox {margin:0 0 15px;}
.intro .group .box3 .tbox ul {margin:0 -7.5px}
.intro .group .box3 .tbox ul li {float:left; width:calc(25% - 15px); margin:0 7.5px;}
.intro .group .box3 .tbox ul li img {box-shadow: 8px 5px 20px rgb(0 0 0 / 14%);}
.intro .group .box3 .tbox ul li a {display:block; width:100%; height:100%;}

.intro .group {width:100%;max-width:1200px;margin: 15px auto;}
.intro .group:after {display:block; clear:both; visibility:hidden; content:''; }


.intro .copy {padding: 40px 20px;font-size: 15px;color: #5d5d5d;}


@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 .box12 {float:none; width:100%; margin:0 0 50px; order:3;}
	.intro .group .box13 {float:none; width:100%; margin:0 0 50px; order:4;}
    .intro .group .box2 {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 {display:flex; flex-direction:column;}  
    
}

@media (max-width:767px){
    .intro > .tit {margin:0 30px;}
}


@media(max-width:726px){
    .intro .group .box1:after {display:none;}
    .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;}
}

@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%;}
	.intro .group .box13 ul.btn_list li {width:100%;}
	.intro .group .box13 ul.btn_list li:nth-child(2) {margin:10px 10px 10px 0px;}
}


@media(max-width:580px){
    .intro .group {padding:0 20px;}
    .intro > .tit {padding:0 20px}   
    .intro .group .box3 ul.list1 {margin:0 -10px; } 
    .intro .group .box3 ul.list1 li {width:calc(50% - 20px);margin:0 10px 20px;}
    .intro .group .box3 ul.list2 li {width:50%;height: 126px;margin: 25px 0 0;}
    .intro .slogan {display:none;}

    .intro .group .box3 ul.list1 li:nth-child(1), .intro .group .box3 ul.list1 li:nth-child(6) {margin:0 10px 20px;}
	.intro .group .box3 ul.list1 li:nth-child(7) {margin:0 10px 20px; }
}
.intro > .tit.tit_mo {display:none;}



@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%;}  
	.intro .group .box3 .tbox {margin:0;width:calc(100%);}
	.intro .group .box3 .tbox ul {margin:0}
    .intro .group .box3 .tbox ul li {float:none; width:calc(100%); margin:0 0 15px; text-align:center;}
}


@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:320px){
    .intro .group .box2 ul li {padding-top:54px}
    .intro .group .box1 ul.btn_list li:after {display: none;}
}