@charset "utf-8";

/* <article id="bo_v" class="pf_pd pf_pd_0”> */
#bo_v {}
#bo_v.pf_pd, #bo_v.pf_wd{ margin-bottom: 70px;}
@media screen and (max-width:900px){
    #bo_v.pf_pd, #bo_v.pf_wd{ margin-bottom: 35px;}
}

/*#bo_v 하위 1200 정렬 wrap DIV*/
#bo_v_head_wrap, .con_wrap_x_in { max-width: 1200px; margin:0 auto; position: relative;}
#bo_v_con {width:100%;min-height:200px; min-height:200px;}
#bo_v_con img {max-width:100%;height:auto}
@media screen and (max-width:900px){
    #bo_v_head_wrap, .con_wrap_x_in { text-align: center;}
}


/*right_box-Bg*/
#bo_v_head_wrap:before {content: ""; position: absolute; top:-60px; right:-430px; width: 1200px; height:564px; 
background: #555da6; background: -moz-linear-gradient(-45deg, #555da6 0%, #5896c0 100%); background: -webkit-linear-gradient(-45deg, #555da6 0%,#5896c0 100%); background: linear-gradient(135deg, #555da6 0%,#5896c0 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#555da6', endColorstr='#5896c0',GradientType=1 ); }
/*left_box-Bg*/
#bo_v_head_wrap:after {content: ""; position: absolute; top:213px; right:511px; width:1500px; height:420px; opacity: 0.5; z-index: 1; mix-blend-mode: multiply;
background: #5896c0; background: -moz-linear-gradient(left, #5896c0 0%, #555da6 100%); background: -webkit-linear-gradient(left, #5896c0 0%,#555da6 100%); background: linear-gradient(to right, #5896c0 0%,#555da6 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5896c0', endColorstr='#555da6',GradientType=1 );}
@media screen and (max-width:1200px){
    #bo_v_head_wrap:before {right:0px; width:770px; }
    #bo_v_head_wrap:after { width:680px; right: initial; left: 0;}
}
@media screen and (max-width:1130px){
    #bo_v_head_wrap:before { height:540px; }
    #bo_v_head_wrap:after { width:627px; height: 380px;}
}
@media screen and (max-width:1030px){
    #bo_v_head_wrap:after { width:580px; }
}
@media screen and (max-width:995px){
    #bo_v_head_wrap:after { width:555px; height: 370px;}
}
@media screen and (max-width:900px){
    #bo_v_head_wrap {text-align: center;}
    #bo_v_head_wrap:after {display: none;}
    #bo_v_head_wrap:before {width: 100%; z-index: -1;}
}



/* head title */
#bo_v_atc_title {display: none;}
#bo_v_title {width: 337px; height: 337px; border:5px solid #fff;position: absolute; top:100px; right:100px; color:#fff; padding: 25px;}
#bo_v_title:after {display: block; content: ""; background: url(http://codediver.dothome.co.kr/PFimg/0/wave1-2.svg)no-repeat; width:67px; height: 22px; transform: rotate(90deg); position: absolute; bottom:0;}
#bo_v_title .bo_v_cate2{display: inline-block; position: absolute;bottom:0; right:0; transform: rotate(-90deg); font-size: 15px; font-weight: 500;}
.pf_co #bo_v_title .bo_v_cate2{bottom:65px; right:-45px;}
.pf_wd #bo_v_title .bo_v_cate2{bottom:40px; right:-24px;}
.pf_pd #bo_v_title .bo_v_cate2{bottom:43px; right:-25px;}
#bo_v_title .bo_v_tit{display:block;font-size:55px;line-height:70px;}
.pf_wd_10 #bo_v_title .bo_v_tit,
.pf_pd_1 #bo_v_title .bo_v_tit,
.pf_pd_3 #bo_v_title .bo_v_tit{font-size:48px;line-height:60px;} /*long title*/
#bo_v_title .bo_v_tit span {display: block;}
.bo_v_head_img { width:100%; position: relative; z-index: 2; padding: 150px 0 20px 40px;}
.bo_v_head_img img {width: 610px;}
.pf_co .bo_v_head_img img {box-shadow: 0 0 15px rgba(0,0,0,.3); border-radius: 5px;}
.bo_v_head_btn{display: inline-block; position: absolute; top:-200px; right:150px;}
.bo_v_head_btn a:first-child {margin-right: 20px}
.bo_v_head_btn.single {right: 345px;}
.bo_v_head_btn.single a:first-child {margin-right: 0}
#bo_v_atc_title {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_con .pf_monitor {width:300px; height: 200px; border:8px solid #999; border-radius: 5px;}
#bo_v_con .pf_monitor_scroll {width: 100%; height: 100%; overflow-y: scroll}
#bo_v_con .pf_monitor img {width: 100%; height: auto}
@media screen and (max-width:1200px){
    #bo_v_title {right: 80px;}
    .bo_v_head_btn {right:130px}
}
@media screen and (max-width:1130px){
    #bo_v_title {width: 300px; height: 300px; padding: 20px;}
    #bo_v_title .bo_v_cate2 {font-size:14px; }
    .pf_co #bo_v_title .bo_v_cate2{bottom: 59px; right: -43px;}/*develop*/
    .pf_wd #bo_v_title .bo_v_cate2{bottom: 41px; right: -20px;}
    .pf_pd #bo_v_title .bo_v_cate2{bottom: 40px; right: -23px;}
    #bo_v_title .bo_v_tit {font-size: 45px; line-height: 55px}
    .pf_pd_1 #bo_v_title .bo_v_tit,
    .pf_pd_3 #bo_v_title .bo_v_tit{font-size:44px;line-height:55px;} /*long title*/
    .bo_v_head_img img {width: 555px;}
    .bo_v_head_btn {right:105px; top: -180px}
    .bo_v_head_btn.single {right: 290px;}
}
@media screen and (max-width:1030px){
    .bo_v_head_img {padding: 150px 0 20px 0; margin-left: -20px;}
}
@media screen and (max-width:995px){
    #bo_v_title {right: 50px}
    .bo_v_head_img img {width: 525px;}
    .bo_v_head_btn {right:80px;}
    .bo_v_head_btn.single {right: 283px;}
}
@media screen and (max-width:900px){
    #bo_v_title {position: static; width:100%; height: auto; border: 0 none; text-align: center; padding:95px 40px 0 40px}
    #bo_v_title:after {bottom: initial; top:199px; right: 66px; z-index: 10; width: 49px;}
    #bo_v_title .bo_v_tit {height: 132px; font-size: 40px; line-height:40px; border:5px solid #fff; border-bottom: 0 none; padding: 10px 15px}
    .pf_pd_1 #bo_v_title .bo_v_tit,
    .pf_pd_3 #bo_v_title .bo_v_tit{font-size:40px;line-height:40px;} /*long title*/
    #bo_v_title .bo_v_tit span {display: inline-block; padding-left: 10px; margin-top: 10px}
    #bo_v_title .bo_v_cate2 {font-size: 13px; font-weight: 300;}
    .pf_co #bo_v_title .bo_v_cate2 {bottom: initial; top:141px; right:-21px}
    .pf_wd #bo_v_title .bo_v_cate2 {bottom: initial; top:121px; right:-1px}
    .pf_pd #bo_v_title .bo_v_cate2 {bottom: initial; top:121px; right:-3px}
    .bo_v_head_img {display: inline-block; padding: 0 25px; margin: -20px 0 0 0; }
    .bo_v_head_img img {width: 100%;}
    .bo_v_head_btn {position: static; margin:30px 0 50px 0;}
}
@media screen and (max-width:650px){
    #bo_v_title .bo_v_tit {height: 200px; font-size: 35px; line-height:35px; }
    .pf_pd_1 #bo_v_title .bo_v_tit,
    .pf_pd_3 #bo_v_title .bo_v_tit{font-size:33px;line-height:33px;} /*long title*/
    #bo_v_title .bo_v_tit span {display: block; text-align: left}
}

/*button group*/
#bo_v a.btn_b01 {}
#bo_v a.btn_b01:focus, #bo_v a.btn_b01:hover {}
#bo_v a.btn_b02 {}
#bo_v a.btn_b02:focus, #bo_v a.btn_b02:hover {}
#bo_v a.btn_admin {} /* 관리자 전용 버튼 */
#bo_v a.btn_admin:focus, #bo_v a.btn_admin:hover {}
#bo_v_top {zoom:1; z-index: 999}
#bo_v_top:after {display:block;visibility:hidden;clear:both;content:""}
#bo_v_top h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_v_top ul {padding:0;list-style:none;word-break:break-all}
.bo_v_hiddenmenu {position: absolute; top:130px; left:40px; z-index: 999}
.bo_v_hiddenmenu li {display: inline-block; }
.bo_v_hiddenmenu li a {display: block; color:#999; padding:0 10px; font-size: 12px;}
.bo_v_left {display: inline-block; width: 40px; height: 40px; position: absolute; top:30px; left: 50px; z-index: 999}
.bo_v_left a { display: block; width: 40px; height: 40px; background: url(http://codediver.dothome.co.kr/PFimg/0/list.svg)no-repeat; font-size: 0; background-size: 25px; background-position: 7px}
/*next/prev btn*/
.bo_v_nb {display: inline-block; position: absolute; top:30px; right:0; font-size: 0; z-index: 999}
.bo_v_nb li {display: inline-block; font-size: 0px; width: 40px; height: 40px;}
.bo_v_nb li .nb_tit{display:none;}
.bo_v_nb li a{display: block; height: 100%; }
.bo_v_nb li.btn_prv a{background: url(http://codediver.dothome.co.kr/PFimg/0/arrow1_white.svg)no-repeat; background-size: 21px 18px; background-position: center;}
.bo_v_nb li.btn_next a{background: url(http://codediver.dothome.co.kr/PFimg/0/arrow1_white_r.svg)no-repeat; background-size: 21px 18px; background-position: center;}
@media screen and (max-width:1200px){
    .bo_v_nb {right: 15px;}
    .bo_v_left {left: 15px;}
}
@media screen and (max-width:900px){
    .bo_v_hiddenmenu {display: none}
    .bo_v_left a { background: url(http://codediver.dothome.co.kr/PFimg/0/list_w.svg)no-repeat; background-size: 25px; background-position: 7px}
}


/* Title */
/*PC: 120px-title-45px-content-70px*/
/*MO:  60px-title-45px-content-35px*/
.detail_tit {width: 100%; margin: 120px 0 45px 0; text-align: center;}
.detail_tit img{display: inline-block; width: 38px; margin-bottom:7px}
.detail_tit span{display:block; width: 100%; font-size: 20px; font-weight: 600;letter-spacing: 1px;}
@media screen and (max-width:900px){
    .detail_tit {margin: 60px 0 45px 0;}
    .detail_tit img {width: 23px}
    .detail_tit span {font-size: 18px;}
}

/* Introduction */
.intro_t_box {margin:30px 0; text-align: left}
.intro_t_box p{display: block; font-size: 15px; font-weight: 300; padding:15px 0; line-height: 25px}
.intro_pf {padding-top: 55px; }
.intro_pf:after { content:""; display:block; clear:both; }
.intro_pf li{width: calc(25% - 11.25px); float:left; box-shadow:0 0 24px rgba(0,0,0,0.1); border-radius: 20px; margin-left:15px; padding: 25px; background: #fff; }
.intro_pf li:first-child{margin-left: 0}
.in_icon{display: block; width: 51px; height: 51px; background:rgba(88,150,192,.2); border-radius: 50%; }
.in_icon img {width: 33px; margin:9px}
.intro_pf li:nth-child(even) .in_icon {background:rgba(85,93,166,.2);}
.inpf_tit > span {display: block;}
.inpf_tit_t {font-size:18px; font-weight: 700; margin: 30px 0 20px 0}
.inpf_tit_p {font-size:15px; font-weight: 300; color:#5f5f5f; line-height: 20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-box-orient:vertical; word-wrap:break-word;}
.pf_co .inpf_tit_p{height:100px; -webkit-line-clamp:5;}
.pf_wd .inpf_tit_p{height:80px; -webkit-line-clamp:4;}
.pf_pd .inpf_tit_p{height:40px; -webkit-line-clamp:2;}

@media screen and (max-width:1200px){
    .intro_t_box p{padding:15px 100px}
    .intro_pf {padding:15px 100px}
}
@media screen and (max-width:1150px){
    .intro_pf li{width: calc(50% - 10px); margin-left:20px; }
    .intro_pf li:nth-child(3){margin:20px 0 0 0}
    .intro_pf li:nth-child(4){margin:20px 0 0 20px}
    .pf_co .inpf_tit_p,
    .pf_wd .inpf_tit_p {height:60px; -webkit-line-clamp:3; }
}
@media screen and (max-width:900px){
    .intro_t_box p{padding:15px 50px; font-size: 13px;}
    .in_icon{width: 36px; height: 36px;}
    .in_icon img {width:23px; margin:6px}
    .intro_pf {padding:15px 50px; text-align: left;}
    .intro_pf li{width: calc(50% - 10px); margin-left:20px; padding: 0; box-shadow: none;}
    .inpf_tit_t {font-size:16px; margin: 20px 0 10px 0}
    .inpf_tit_p {font-size:13px;}
}
@media screen and (max-width:670px){
    .pf_co .inpf_tit_p,
    .pf_wd .inpf_tit_p {height:100px; -webkit-line-clamp:5; }
}
@media screen and (max-width:450px){
    .intro_t_box p{padding:15px 30px;}
    .intro_pf {padding:15px 30px;}
}

/* ( pd / wd ) img wrap */
.pf_pd .intro_pf{margin-bottom: 70px}
.detail_img_group {text-align: center; max-width: 1200px; margin: 0 auto;}
.detail_img_group .detail_textWrap {display: block; padding:30px 300px;}
.detail_img_group .detail_textWrap span {font-size: 15px; font-weight: 300; line-height: 25px;}
@media screen and (max-width:1300px){
    
}
@media screen and (max-width:900px){
    .pf_pd .intro_pf {margin-bottom: 35px}
    .detail_img_group .detail_textWrap {padding:30px 100px;}
}

/*pd/wd array*/
.three_stage_array {padding:10px 50px; position: relative;}
.three_stage_array ul:after { content:""; display:block; clear:both; }
.three_stage_array > ul > li{float:left; padding:1px}
.three_stage_array.steps > ul > li{margin-top: 0;}
.three_stage_array.w2 > ul > li {width: 50%; }
.three_stage_array.w3 > ul > li {width: 33.33333%; }
.three_stage_array > ul > li ul {padding:5px 10px;}
/*des*/
.three_stage_array.w2.des > ul {position: relative; background: rgba(256, 256, 256, 0.3); margin-bottom: 10px; height: 250px;}
.three_stage_array.w2.des > ul > li {height: 100%; margin:0}
.three_stage_array.w2.des > ul > li:before { display: inline-block; width: 0; height:100%; content: ""; vertical-align: middle;}
.three_stage_array.w2.des > ul > li:first-child {width:30%; border:1px solid rgba(0,0,0,0.1); padding:0; overflow: hidden;}
.three_stage_array.w2.des > ul > li img{ display: inline-block; vertical-align: middle;}
.three_stage_array.w2.des > ul > li:nth-child(2) > div { display: inline-block; vertical-align: middle; }
.three_stage_array.w2.des > ul > li:nth-child(2) {width: 70%; }
.three_stage_array.w2.des > ul > li:nth-child(2) > div {padding:0 0 0 20px}
.three_stage_array.w2.des > ul.right > li:first-child {float:right;}
.three_stage_array.w2.des > ul.right > li:nth-child(2) { }
.three_stage_array.w2.des > ul.right > li:nth-child(2) div {padding:0 20px 0 0}
.three_stage_array.w2.des .etl_tit {margin-bottom: 10px;}
.etl_tit, .img_caption {font-size: 15px; font-weight: 300; line-height: 40px;}
/*logo_list*/
.logo_list li:before { display: inline-block; width: 0; height:100%; content: ""; vertical-align: middle;}
.logo_list li span{display:inline-block; vertical-align: middle; line-height: 300px; width: 100%; height: 300px; border-radius:20px; }
.wplo_1 img, .wplo_2 img {width: 270px;}
.wplo_1 {background: #e8ecee;}
.wplo_2 {background: #e8eaee;}

/*wordpress list*/
.wd10_list_box {}
.wd10_list_box a {display: block;  border: 1px solid rgba(0,0,0,0.2); }
.wd10_imgbox {display: block; height: 100%; position: relative; overflow: hidden; padding-top: 10px}
.wd10_window {display: block; width: 100%; height: 10px; position: absolute; top:0; left: 0; background: #999; border-radius: 3px 3px 0 0;}
.wd10_window > span {display: block; content: ''; width: 4px; height: 4px; position: absolute; top:3px; left: 0; border-radius: 50%; }
.wd10_window > span:nth-child(1) {left: 5px; background: #ff5f58;}
.wd10_window > span:nth-child(2) {left: 12px; background: #f5bf4f;}
.wd10_window > span:nth-child(3) {left: 19px; background: #62c554;}
.wd10_txtbox {display: block; text-align: left; padding:20px 25px 67px 25px; border-top: 1px solid rgba(0,0,0,0.2); position: relative;}
.wd10_txtbox .h5 {font-size: 20px; font-weight: 600; margin: 10px 0; height:50px; line-height:25px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; }           
.wd10_txtbox .h6 {line-height: 20px; font-weight: 300; font-size: 15px; white-space:nowrap; overflow:hidden; text-overflow: ellipsis; }
.wd10_txtbox .wd10_btn {display: inline-block; height: 37px; border-radius: 19px; background: #deeaf2; padding:0 20px; line-height: 37px; font-size: 13px; font-weight: 700; color:#5896c0; text-transform: uppercase; position: absolute; bottom:20px; right:20px;}
.wd10_list_box a:hover .wd10_txtbox .wd10_btn {background: #5896c0; color:#fff;}

@media screen and (max-width:1000px){
    .three_stage_array.w3 > ul > li{width:50%;}
}
@media screen and (max-width:900px){
    .etl_tit {font-size: 18px;}
    .three_stage_array.w2.des .etl_tit {margin-top: 10px}
    .three_stage_array.w2.des > ul {height: auto; background:none;}
    .three_stage_array.w2.des > ul > li:first-child,
    .three_stage_array.w2.des > ul > li:nth-child(2) {width: 100%; }
    .three_stage_array.w2.des > ul > li:nth-child(2) > div,
    .three_stage_array.w2.des > ul.right > li:nth-child(2) div {padding:0 0 0 0}
    .etl_tit, .img_caption {font-size: 13px; line-height: 25px;}
    .three_stage_array.w2.logo_list > ul > li {width: 100%;}
    
    .wd10_txtbox {padding:20px 20px 67px 20px; }
    .wd10_txtbox .h5 {font-size: 16px; margin: 5px 0; height:36px; line-height:18px;}           
    .wd10_txtbox .h6 {font-size: 13px; }
    .wd10_txtbox .wd10_btn {display: inline-block; height: 30px; border-radius: 16px; padding:0 15px; line-height: 30px; font-size: 11px; bottom:20px; right:20px;}
    .wd10_list_box a:hover .wd10_txtbox .wd10_btn {background: #deeaf2; color:#5896c0;}
}
@media screen and (max-width:600px){
    .three_stage_array {padding:1px 0;}
    .three_stage_array > ul > li {padding:0}
    .three_stage_array.w2 > ul > li,
    .three_stage_array.w3 > ul > li{width:100%;}
    .three_stage_array.w2 .etl_tit {margin-top: 10px;}
}

/* questioningArea-responsive web */
.responsive_quest {padding:200px 0 50px 0; position: relative; }
.res_que_tit {width: calc(50% + 300px); padding:0 0 70px 50%; font-size: 25px; line-height: 35px; }
.res_que_tit span {position: relative;}
.res_que_tit span:after {display: block; content: ""; width: 53px; height: 7px; background: url(http://codediver.dothome.co.kr/PFimg/0/wave4.svg)no-repeat; position: absolute; top:-15px; left:-3px;}
.res_que_im {width: calc(50% - 50px); position: absolute; top:0; left: 0;}
.res_que_im .res_monitor {width: 556px; position: relative;}
.res_que_im .res_screen {width: 432px; height: 275px; position: absolute; top:16px; left:50%; margin-left: -216px; overflow: hidden;}
.res_que_im .res_screen img {width: 100%; height: auto; max-height: 100%;}
.res_que_tx {width: 100%; padding-left: 50%; font-size: 15px; font-weight: 300; line-height: 25px;}
.res_bg {width: 100%; }
.res_bg span {display: block;}
.res_bg .res_bg1 {width: 920px; height: 425px; background: url(http://codediver.dothome.co.kr/PFimg/0/pattern1.svg)no-repeat; transform: rotate(25deg); position: absolute; top:80px; right:50%; margin-right:20px; z-index:-1}
.res_bg .res_bg2 {width: 920px; height: 425px; background: url(http://codediver.dothome.co.kr/PFimg/0/pattern2.svg)no-repeat; transform: rotate(25deg); position: absolute; top:130px; right:50%; margin-right:50px; z-index:-2}
.res_bg .res_bg2 span, .res_bg .res_bg3 span {position: absolute; bottom:0; left:50%; z-index:-2; }
.res_bg .res_bg2 span:nth-child(1) {width: 110px; height: 15px; background:#aaafd3; border-radius: 7.5px; margin-left: 120px; bottom:-150px }
.res_bg .res_bg2 span:nth-child(2) {width: 60px; height: 8px; background:#5896c0; border-radius:4px; margin-left: 200px; bottom:-120px }
.res_bg .res_bg2 span:nth-child(3) {width: 15px; height: 15px; background:#ccdbea; border-radius: 50%; margin-left: 300px; bottom:-150px }
.res_bg .res_bg3 {width: 100px; height: 100px; transform: rotate(25deg); position: absolute; top:0; right:0; z-index:-2}
.res_bg .res_bg3 span:nth-child(1) { width: 110px; height: 15px; background:#308fcf; border-radius: 7.5px; position: absolute; bottom:-155px; left:100px; opacity: .6;  }
.res_bg .res_bg3 span:nth-child(2) {width: 15px; height: 15px; background:#354cce; border-radius: 50%;bottom:-96px; left: 100px; opacity: .2;}
@media screen and (max-width:1300px){
    .res_que_tit {width: 900px; padding: 0 0 70px 600px}
    .res_que_tx {padding:0 50px 0 600px}
    .res_bg .res_bg1 {margin-right: 0; right: initial; left:-330px;}
    .res_bg .res_bg2 {margin-right: 0; right: initial; left:-330px;}
}
@media screen and (max-width:1100px){
    .res_que_tit {padding: 0 0 45px 600px} 
}
@media screen and (max-width:950px){
    .res_que_im {width:auto; left:30px; top:50px}
    .res_que_im .res_monitor {width:397px;}
    .res_que_im .res_screen {width:309px; height:196px; top:13px; margin-left: -154px;}
    .res_que_tit {width: 700px; padding: 0 0 45px 470px; text-align: left; font-size: 18px; font-weight: 600; line-height: 25px} 
    .res_que_tit span:after {width:40px; }
    .res_que_tx {padding:0 50px 0 470px; text-align: left; font-size: 13px;}
    .res_bg .res_bg1 {width: 700px; height: 350px; top:120px; left:-250px;}
    .res_bg .res_bg2 {width: 700px; height: 350px; top:150px; left:-250px;}  
}
@media screen and (max-width:770px){
    .res_que_tit {width: 230px; padding:0; position: absolute; top:-80px; right:10%;} 
    .res_que_tx {padding:400px 50px 0 50px;}
    /*shape*/
    .res_bg .res_bg2 span, .res_bg .res_bg3 span {bottom:0; left:50%;}
    .res_bg .res_bg2 span:nth-child(1) {width: 80px; height: 10px; border-radius: 5px; margin-left: 0; bottom:400px; left: 641px }
    .res_bg .res_bg2 span:nth-child(2) {width: 40px; height: 6px; border-radius:3px; margin-left: 0; bottom:420px; left: 703px}
    .res_bg .res_bg2 span:nth-child(3) {width: 10px; height: 10px; margin-left: 0; bottom:200px; left:800px; }
    .res_bg .res_bg3 {width: 100px; height: 100px; top:280px; right:0; }    
}
@media screen and (max-width:600px){
    .res_que_tit {right:30px;}
}
@media screen and (max-width:450px){
    .res_que_tit {width: 210px; right:initial; left:30px; top: -20px; color:#fff;}
    .res_que_im {left: 0; top: 60px}
    .res_que_tx {padding:350px 30px 0 30px;}
    .res_bg .res_bg2 span, .res_bg .res_bg3 span {display: none;}
}
@media screen and (max-width:406px){
    .res_que_im {left:-20px; }
}


/*point-swipe*/
.swiper-container {width: 100%; height:695px; margin: 10px 0 30px 0;} /* 그림자위아래20*2 + 높이625 + navi(30) = 685px */
.swiper-slide { width: 366px; height: 625px; margin-top: 20px; /* 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;/*design*/box-shadow: 2px 0 20px rgba(0,0,0,.15); position: relative;}
.swiper-slide:first-child:after {display: block; content: ""; width: 150px; height:150px; position: absolute; top:230px; left: -250px; border-radius: 30px; background: #5896c0; opacity: .2}
.swiper-slide:first-child:before {display: block; content: ""; width: 50px; height:50px; background: url(http://codediver.dothome.co.kr/PFimg/0/swipe.svg)no-repeat; position: absolute; top:282px; left:-202px;  }
/*active*/
.swiper-slide > div {opacity: .3;}
.swiper-slide .point_img img {opacity:0.2;}
.swiper-slide.swiper-slide-active > div { opacity: 1}
.swiper-slide.swiper-slide-active .point_img img {opacity:1;}
/* v2 */
.btnStyle_3.v2 {width: 180px; height: 37px; background: #deeaf2; box-shadow: none;}
.btnStyle_3.v2 span:nth-child(1) { line-height: 37px; padding-left:20px }
.btnStyle_3.v2 span:nth-child(2) { right:15px; margin-top: -7px; }
.btnStyle_3.v2:hover {background:#deeaf2; }
.btnStyle_3.v2:hover span:nth-child(1) { color:#5896c0; }
.btnStyle_3.v2:hover span:nth-child(2) { background: url(http://codediver.dothome.co.kr/PFimg/0/arrow1_blue_r.svg)no-repeat; animation:none; -webkit-animation:none; }
.swiper-slide-active .btnStyle_3.v2:hover {background:#5896c0; }
.swiper-slide-active .btnStyle_3.v2:hover span:nth-child(1) { color:#fff; }
.swiper-slide-active .btnStyle_3.v2:hover span:nth-child(2) { background: url(http://codediver.dothome.co.kr/PFimg/0/arrow1_white_r.svg)no-repeat; animation: slide-right 2s infinite; -webkit-animation: slide-right 2s infinite; }
/*li box*/
.point_wrap_pos {position: absolute; top:0; left: 0; width: 100%; height: 100%;}
.point_img {width: 100%; height: 237px; border-bottom: 1px solid rgba(0,0,0,.2); background: #7094cd;background: -moz-linear-gradient(left,  #7094cd 0%, #65a0ca 100%);background: -webkit-linear-gradient(left,  #7094cd 0%,#65a0ca 100%);background: linear-gradient(to right,  #7094cd 0%,#65a0ca 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7094cd', endColorstr='#65a0ca',GradientType=1 ); overflow: hidden; }
.point_img img{width: 100%; height: auto; min-height: 100%;}
.point_tbox {width:100%;height:388px; padding:50px 23px}
.point_ico {width: 51px; height: 51px; background:#deeaf2; border-radius: 50%; }
.point_ico img {width: 33px; margin:9px}
.point_tbox dl {margin-top: 30px}
.point_tbox dt {font-size: 20px; font-weight: 600; margin-bottom:15px}
.point_tbox dd { height:140px; line-height:20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:7; -webkit-box-orient:vertical; word-wrap:break-word; font-size: 15px; font-weight: 300;}
.point_tbox .btnStyle_3.v2 {position: absolute; bottom:20px; right:20px;}
/*No link button*/
.pf_co_1 .point_tbox dd {height:200px; -webkit-line-clamp:10;}

@media screen and (max-width:1050px){
    .swiper-slide:first-child:after {left:-200px;}
    .swiper-slide:first-child:before {left:-152px;}
}
@media screen and (max-width:900px){
    .swiper-container {height:557px;} /* 그림자20 + 높이487 + 그림자20 + Btn30 = 557px */
    .swiper-slide { width: 359px; height: 487px;}
    .point_img {height: 219px;}
    .point_ico {width: 35px; height: 35px;}
    .point_ico img {width: 23px; margin:6px}
    .point_tbox {height:auto;padding:38px 22px}
    .point_tbox dl {margin-top: 18px}
    .point_tbox dt {font-size: 16px; }
    .point_tbox dd { height:60px; line-height:20px; -webkit-line-clamp:3; font-size: 13px;}
    /*No link button*/
    .pf_co_1 .point_tbox dd {height:120px; -webkit-line-clamp:6;}
    .swiper-slide:first-child:after {width: 50px; height:50px; top:210px; left: -100px; border-radius:10px; }
    .swiper-slide:first-child:before {width: 35px; height:35px; top:219px; left:-93px; }
    /*btn*/
    .btnStyle_3.v2 {width: 150px; height: 32px;}
    .btnStyle_3.v2 span:nth-child(1) { line-height: 32px; padding-left:14px; font-size: 11px; }
    .btnStyle_3.v2 span:nth-child(2) { right:13px;}
    .btnStyle_3.v2:hover {background:#deeaf2; }
    .swiper-slide-active .btnStyle_3.v2:hover {background:#deeaf2 !important; }
    .swiper-slide-active .btnStyle_3.v2:hover span:nth-child(1) { color:#5896c0; }
    .swiper-slide-active .btnStyle_3.v2:hover span:nth-child(2) { background: url(http://codediver.dothome.co.kr/PFimg/0/arrow1_blue_r.svg)no-repeat; animation: none; -webkit-animation:none; }
}
@media screen and (max-width:640px){
    .swiper-container {height:445px;} /* 그림자20 + 높이487 + 그림자20 + Btn30 = 557px */
    .swiper-slide { width: 250px; height: 375px;}
    .point_img {height: 150px;}
    .point_tbox {padding:20px}
    .point_tbox dl {margin-top: 10px}
    .point_tbox dt {margin-bottom: 5px}
    .swiper-slide:first-child:after {top:160px; left: -65px; border-radius:50%; }
    .swiper-slide:first-child:before {top:169px; left:-58px; }
}
@media screen and (max-width:430px){
    .swiper-slide:first-child:after,
    .swiper-slide:first-child:before {display: none;}
}


/* Site Map */
.site_map_bg {background: #ededed;}
.site_map_bg > div {padding:110px 0 60px 0;}
.my-grid { padding: 0; width: 100%; height: auto; margin: 0 auto; visibility: visible; font-size: 0}
.my-grid .item { display: inline-block; width:25%; padding:10px;}
.my-grid .item.first {height: 300px}
.my-grid .item.first img {width: 23px; height: 23px;}
.my-grid .item.first strong {display: block; font-size: 25px; font-weight: 600; margin: 2px 0 20px 0}
.star_point { display: inline-block; position: relative; padding-left: 15px; font-size: 14px; font-weight: 300;}
.star_point .red_ball { position: absolute; top:7px; left: 0; width: 8px; height: 8px}
.red_ball {display: inline-block;font-size: 0; text-indent: -9999px; width:6px; height:6px;background: #5896c0; border-radius: 50%;}
.my-grid .item h6 { font-size: 14px; font-weight:600; line-height: 30px; margin:10px 0 5px 0 }
.map_dd li {width: 100%; line-height:28px; position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.map_dd li.sub {padding-left: 15px;}
.map_dd li.sub:after {display: block; content: ""; width: 10px; height: 10px; background: url(http://codediver.dothome.co.kr/PFimg/0/arrow2.svg)no-repeat; position: absolute; top:7px; left: 0; opacity: .6}
.map_dd li .red_ball { position: absolute; top:4px; right:-7px;}
.map_dd li a {display:inline-block;font-size: 14px; font-weight: 300;position: relative; }
.map_dd li a:hover {font-weight: 400}
@media screen and (max-width:1300px){
    .my-grid .item { padding:20px;}
}
@media screen and (max-width:900px){
    .site_map_bg {display: none;}
    .my-grid .item { padding:0 15px }
}

/*Policy??*/
.WebPolicy {border:1px solid rgba(0,0,0,0.2); padding:10px}
.WebPolicy ul {margin-top: 10px;}
.WebPolicy li {line-height: 22px;}

.bnr-list li{margin-bottom: 5px}