@charset "UTF-8";

.dog_tit {font-size:2.5rem;line-height:3.357rem;font-weight:500;text-align:center}
@media screen and (max-width:960px){
    .dog_tit {font-size:2.1rem;line-height:3.1rem}
}

/* 소개 */
.dog_history {position:relative;}
.dog_history .dog_history_cont {margin-top:42px;}
.dog_history .dog_history_cont .d_img {position:relative;float:left;width:24.71rem}
.dog_history .dog_history_cont .d_img img {max-width:100%;height:auto}
.dog_history .dog_history_cont .d_cont {position:relative;float:right;width:calc(100% - 29.14rem);font-size:1.286rem;line-height:2.5rem}
@media screen and (max-width:1258px){
    .dog_history .dog_history_cont .d_cont .block {display:inline}
}
@media screen and (max-width:960px){
    .dog_history .dog_history_cont .d_img {width:20rem}
    .dog_history .dog_history_cont .d_cont {width:calc(100% - 23rem)}
}
@media screen and (max-width:600px){
    .dog_history .dog_history_cont .d_img,
    .dog_history .dog_history_cont .d_cont {float:none;width:100%;}
    .dog_history .dog_history_cont .d_cont {margin-top:2rem}
}

/* 삽살개는 왜 사라졌는가 */
.dog_cont_box {text-align:center;padding:5.571rem 1rem;background-color:#f1f1f1}
.dog_lost_list {padding-top:2.643rem;margin:-0.9286rem}
.dog_lost_list li {display:inline-block;vertical-align:top;padding:0.9286rem}
.dog_lost_list li .cont {margin-top:1.071rem}
.dog_lost_list li .cont p,
.dog_lost_list li .cont strong {display:block;font-size:1.071rem;line-height:1.643rem;color:#666666}
.dog_lost_list li .cont strong {font-weight:500;color:#333333}
@media screen and (max-width:1144px){ 
    .dog_lost .block {display: inline}
}
@media screen and (max-width:960px){ 
    .dog_restore .dog_tit br,
    .dog_lost .dog_tit br {display:none}
    .dog_cont_box {padding-top:3rem;padding-bottom:3rem}
}

/* 연구 */
.rnd_box1 {position:relative;}
.rnd_box1 .right {position:relative;margin-top:3rem}
.rnd_box1 .rnd_list {margin:-1.857rem}
.rnd_box1 .rnd_list:after {display:block;content:"";clear:both}
.rnd_box1 .rnd_list li {float:left;position:relative;vertical-align:top;padding:1.857rem}
.rnd_box1 .rnd_list li img {max-width:100%}
.rnd_box1 .rnd_list li .txt {margin-top:0.7143rem;text-align:center;font-size:1rem;line-height:1.429rem;color:777}
.rnd_box1 .rnd_list li .txt strong {font-weight:500;color:#222}
.rnd_box1 .left {position:relative;}
.rnd_box2 {position:relative;}
.rnd_box2 .left {float:left;position:relative;width:38.07rem}
.rnd_box2 .right {float:right;position:relative;width:calc(100% - 40rem)}
.rnd_box2 .right ul {position:relative;float:left;width:33.33333333%}
.rnd_box2 .right ul li {font-size:0.9286rem;line-height:1.786rem;color:#333}
.rnd_box3 {margin-top:2.857rem}
.rnd_box3 .left {float:left;position:relative;width:33.57rem}
.rnd_box3 .right {float:right;position:relative;width:calc(100% - 35.71rem);}
@media screen and (max-width:1128px){
    .rnd_box2 .left,
    .rnd_box2 .right {float:none;width:100%;}
    .rnd_box2 .right {margin-top:2rem}
    .rnd_box2 .right ul li {font-size:1.1rem}
}
@media screen and (max-width:1100px){
    .rnd_box1 .left,
    .rnd_box1 .right {float:none;width:100%}
    .rnd_box1 .right {margin-top:2rem}
    .rnd_box1 .rnd_list li {width:auto}
}
@media screen and (max-width:960px){    
    .rnd_box3 .left {width:30rem}
    .rnd_box3 .right {width:calc(100% - 32rem);}
}
@media screen and (max-width:800px){    
    .rnd_box3 .left,
    .rnd_box3 .right {float:none;width:100%;}
    .rnd_box3 .right {margin-top:3rem}
}
@media screen and (max-width:600px){    
    .rnd_box2 .right ul li {font-size:1rem}
}
@media screen and (max-width:500px){    
    .rnd_box2 .right ul {width:100%}
    .rnd_box2 .right ul li {font-size:1.1rem}
}

/* 특징 */
.dog_cont_box2 {background-color:#f1f1f1;padding:2.857rem 3.571rem;margin-bottom:4.786rem}
.dog_cont_box2 .left {float:left;position:relative;width:24.86rem}
.dog_cont_box2 .right {float:right;position:relative;width:calc(100% - 26.93rem);padding-top:2.571rem}
.dog_cont_box3 {margin-top:4.5rem}
.dog_cont_box3 .left {float:left;position:relative;width:24.86rem}
.dog_cont_box3 .right {float:right;position:relative;width:calc(100% - 26.93rem);padding-top:2.571rem}
.dog_fea_list {margin-top:4.5rem}
.dog_fea_list ul {margin:-3px}
.dog_fea_list ul li {float:left;width:50%;padding:3px}
.dog_fea_list ul li:nth-child(3) {clear:left;}
.dog_fea_list ul li .cont {min-height:33.21rem;padding:2.357rem;border:1px solid #ddd;text-align:center}
.dog_fea_list ul li .cont strong {display:block}
.dog_fea_list ul li .cont .img {margin-bottom:1.643rem}
.dog_cont_box4 {padding:3.429rem 3.857rem;background-color:#f1f1f1}
.dog_cont_box4 .left {float:left;position:relative;width:24.86rem}
.dog_cont_box4 .right {float:right;position:relative;width:calc(100% - 26.71rem)}
@media screen and (max-width:960px){
    .dog_features .subtit25 {line-height:2rem}
    .dog_cont_box4,
    .dog_cont_box2 {padding:2.5rem}
    .dog_cont_box4 .left,
    .dog_cont_box3 .left,
    .dog_cont_box2 .left {width:20rem}
    .dog_cont_box4 .right,
    .dog_cont_box3 .right,
    .dog_cont_box2 .right {width:calc(100% - 22rem);padding-top:0}
}
@media screen and (max-width:600px){
    .dog_cont_box4 .left,
    .dog_cont_box3 .left,
    .dog_cont_box2 .left {width:100%}
    .dog_cont_box4 .right,
    .dog_cont_box3 .right,
    .dog_cont_box2 .right {width:100%;padding-top:0}
    .dog_cont_box4 .right,
    .dog_cont_box3 .right,
    .dog_cont_box2 .right {padding-top:3rem}
    .dog_fea_list ul li {width:100%}
}

.img_box_list {padding-top:1.214rem;margin:-4.5px}
.img_box_list .list {float:left;width:50%;padding:4.5px}
.img_box_list .list .list_cont {border:3px solid #ddd;text-align:center;padding:2.857rem 1rem}
.img_box_list .list .list_cont img {max-width:100%;height:auto;}
.img_box_list .list .list_cont .tit {font-size:1.286rem;line-height:1.714rem;color:#85681e;font-weight:500}
.img_box_list .list .list_cont .txt {font-size:1.143rem;color:#333333}

.step_list {padding-top:5.714rem;margin:-1.429rem;padding-left:1.429rem}
.step_list .list {position:relative;float:left;padding:1.429rem;width:33.333333333%}
.step_list .list:before {
    display:block;
    content:"";
    position:absolute;
    top:50%;
    left:-1.786rem;
    transform:translateY(-50%);
    width:3.571rem;
    height:3.571rem;
    background:url(../imgs/dog/arr.png) no-repeat 0 0;
    background-size:100% auto;
}
.step_list .list .step_cont {background-color:#dddddd;padding:1.429rem}
.step_list .list .step_cont .top_cont, 
.step_list .list .step_cont .bt_cont {display:table;width:100%;}
.step_list .list .step_cont .top_cont {margin-bottom:1.429rem;}
.step_list .list .step_cont .bt_cont .bt_txt,
.step_list .list .step_cont .top_cont .top_txt {display:table-cell;background-color:#fff;width:100%;height:10.93rem;vertical-align:middle;padding:1.857rem;font-size:1.286rem;line-height:1.786rem;color:#555;font-weight:500;text-align:center;}
.step_list .list .step_cont .mid_cont {display:table;width:100%;}
.step_list .list .step_cont .mid_cont .mid_txt {
    display:table-cell;
    width:100%;
    height:6.071rem;
    vertical-align:middle;
    padding:1.857rem 0;
    font-size:1.786rem;
    color:#b28614;
    font-weight:700;
    text-align:center;
    background-color:#fff;
    font-family:"Montserrat","Roboto",sans-serif;
    letter-spacing:-0.1rem;
}
.step_list .list .step_cont .line {
    padding:3px !important;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b38614+0,85681e+100 */
    background: rgb(179,134,20); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(179,134,20,1) 0%, rgba(133,104,30,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(179,134,20,1) 0%,rgba(133,104,30,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(179,134,20,1) 0%,rgba(133,104,30,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b38614', endColorstr='#85681e',GradientType=0 ); /* IE6-9 */

}
.step_list .list .step_cont .bt_cont {margin-top:1.429rem;}
@media screen and (max-width:680px){
    .step_list .list {width:100%}
    .step_list .list .step_cont {height:auto !important}
    .step_list .list .step_cont .bt_cont .bt_txt,
    .step_list .list .step_cont .top_cont .top_txt,
    .step_list .list .step_cont .mid_cont .mid_txt {height:auto !important}
    .step_list .list:before {left:-10px}
}
@media screen and (max-width:560px){
    .img_box_list .list {width:100%;}
    .img_box_list .list .list_cont {height:auto !important}
}