@charset "utf-8";

/* 월간 문화재 사랑 */
.webzin{width:100%; height:430px; background:url(../images/news/webzin_bg01.gif); display:table; }
.webzin dl{width:100%; height:100%; display:table; background: url(../images/news/webzin_bg02.png) no-repeat right bottom, url(../images/news/webzin_bg03.png) no-repeat center top; }
.webzin dt{width:40%; height:100%; display:table-cell; vertical-align:middle; text-align:center}
.webzin dd{padding-right:70px; display:table-cell; vertical-align:middle;}
.webzin p { padding-top:20px; }
.webzin p span{font-size:18px; color:#000;font-weight:500}


/* 뉴스레터 */
.newsletter{width:100%; height:430px; background:url(../images/news/webzin_bg01.gif); display:table; position:relative; }
.newsletter dl{width:100%; height:100%; position:relative; display:table; background: url(../images/news/webzin_bg03.png) no-repeat center top, url(../images/news/newsletter_05.png) no-repeat right top}
.newsletter dt{width:60%; position:absolute; bottom:0; padding-left:70px}
.newsletter dd{padding: 0 100px 0 420px; display:table-cell; vertical-align:middle; text-align:right}
.newsletter p{padding-top:20px; text-align:right}
.newsletter p span{font-size:18px; color:#000;font-weight:500}

.newsletter p.newsletter_bottom{position:absolute; bottom:0; width:100%; text-align:center}

/* korean heritage 웹진 */
.khwebzin{width:100%; height:430px; background:url(/images/news/heritage_bg.png); display:table; }
.khwebzin dl{width: 100%; height: 100%; display: table; }
.khwebzin dt {width: 40%; height: 100%; display : table-cell; vertical-align:middle;  text-align: center; }
.khwebzin dd {padding-right: 70px; display: table-cell; vertical-align: middle;}
@media all and (max-width:800px){
    .khwebzin dt{width:50%; padding:0 20px }
    .khwebzin dt img{width:200px}
    .khwebzin dd{padding:0 30px 0 0;display:table-cell;vertical-align:middle;}
    .khwebzin dd img{width:160px}
}
@media all and (max-width:480px){
    .khwebzin dt{width:100%; padding:20px 0; display:block; text-align:center;height:auto}
    .khwebzin dt img{width:150px}
    .khwebzin dd{width:100%; padding:0; display:block; text-align:center;}
    .khwebzin dd img{width:140px}
    .khwebzin dd p{padding:10px 20px; text-align:center}
}


/* 문화유산 관람안내 */
.viewGuide .page_exp{padding:37px 22px 37px 184px;min-height:inherit}
.viewG_tit{margin-top:50px;font-size:23px;color:#333;padding:13px 92px 11px 2px;border-bottom:1px solid #7f7f7f;font-weight:normal;letter-spacing:-0.02em;line-height:27px;word-wrap:break-word;word-break:keep-all}
.viewG_tit.t01{background:url(../images/news/img_viewG_tit01.png) right bottom no-repeat}
.viewG_tit.t02{background:url(../images/news/img_viewG_tit02.png) right bottom no-repeat}
.viewG_tit.t03{background:url(../images/news/img_viewG_tit03.png) right bottom no-repeat}
.viewG_list{overflow:hidden}
.viewG_list li{box-sizing:border-box;float:left;margin-top:19px;width:16.667%;padding:13px 12px}
.viewG_list li a{display:block;text-align:center}
.viewG_list li a img{transition:all .3s}
.viewG_list li a:hover img{transform:translateY(-10px)}
.viewG_list li a strong{display:block;margin-top:10px;font-weight:normal;font-size:15px}
@media all and (max-width:1200px){
    .viewG_list li{width:20%}
}
@media all and (max-width:1010px){
    .viewG_list li{width:25%}
}
@media all and (max-width:640px){
    .viewG_list li{width:33.3%}
    .viewG_list li:nth-child(3n+1){clear:both}
}
@media all and (max-width:440px){
    .viewG_tit{margin-top:30px}
    .viewG_list li{width:50%;margin-top:10px}
    .viewG_list li:nth-child(3n+1){clear:none}
    .viewG_list li:nth-child(2n+1){clear:both}

}

/* 월간 문화재 사랑_기존 */
.lovepaper_wrap{overflow:hidden;border:1px solid #d5d5db;border-radius:5px}
.lovepaper_wrap p{text-align:center;padding:30px;border-bottom:1px solid #d5d5db}
.lovepaper_wrap p span{display:block}
.lovepaper_wrap .lp_img img{width:100%}

.lovepaper_btn{overflow:hidden;display:inline-block;margin:0 auto}
.lovepaper_btn li{float:left;margin:0 0 5px 5px}
.lovepaper_btn li:first-child{margin-left:0}

.cert_top{border:1px solid #d6d6d6;font-size:15px;padding:32px 30px 32px 136px;background:url(/images/news/img_security.png) 48px center no-repeat}

.certWrap{margin-top:50px}
.certWrap:after{content:"";clear:both;display:block}
.certWrap li{float:left;width:48%;}
.certWrap li:first-child{margin-right:2%}
.certWrap li .certBox{border:5px solid #eff0f3}
.certWrap li .certBox strong{display:block;padding:25px 0;background:#eff0f3;color:#444;font-size:19px;text-align:center}
.certWrap li .certBox div{padding:25px 15px 15px;text-align:center}
.certWrap li .certBox p{text-align:center}
.certWrap li .certBox.cPhone p{margin:28px 0}
.certWrap li .certBox.cIpin p{margin:18px 0 17px}
.certWrap li .certBox a{display:block;padding:10px 0;border:1px solid #999;color:#444;font-size:16px;text-align:center;transition:all .3s}
.certWrap li .certBox a:hover{background:#51576e;color:#fff}

/* 주간 뉴스레터 */
.area001{box-sizing:border-box;width:100%;padding:10px;border:1px solid #d5d5db}
.agree_box{margin-top:20px}
.agree_box>span{margin-right:10px}
.agree_box>span + span{margin-right:0}
.agree_box .agreeBtn{margin-top:20px}
.agree_box .agreeBtn span{display:inline-block}
.agree_box .agreeBtn a{margin-bottom:5px}

.infoBox{border:1px solid #d5d5db;padding:20px 25px;margin-top:20px}
.infoBox>div{position:relative;}
.infoBox span{position:absolute;left:0;top:0}
.infoBox p{padding-left:52px;min-height: 46px}
.infoBox b{display:inline-block}

.update_name{padding:10px;background:#f7f7f7;border:1px solid #e3e3e3}

.confirmBox{margin:0 auto;border:1px solid #d5d5db;padding:35px 25px;background:#f9f9f7}
.confirmBox .confirmInput{width:308px;max-width:250px;margin:0 auto;padding-left:98px;background:url(/images/news/img_cert_ipin.png) left top no-repeat}
.confirmBox .confirmInput>div{overflow:hidden;margin-bottom:5px}
.confirmBox .confirmInput label{float:left;display:inline-block;width:60px}
.confirmBox .confirmInput div .confirm_text{float:left;box-sizing:border-box;width:calc(100% - 60px)}
.confirmBox .confirmBtn{margin-top:10px;text-align:right}

/* Responsive */

@media all and (max-width:1140px){
    .newsletter p br{display:none}

}


@media all and (max-width:900px){
    .newsletter dd{padding: 0 50px 0 420px;}

}


@media all and (max-width:800px){

    .webzin dt{width:50%; padding:0 20px }
    .webzin dt img{width:200px}
    .webzin dd{padding:0 30px 0 0; display:table-cell; vertical-align:middle;}
    .webzin dd img{width:160px}

}



@media all and (max-width:768px){
    .lovepaper_wrap p span{display:inline}
}

@media all and (max-width:753px){
    .certWrap li div p{min-height:63px;}
}

@media all and (max-width:700px){
    .newsletter dt{width:50%; position:relative; bottom:0; padding-left:50px; display:table-cell; vertical-align:middle; text-align:left}
    .newsletter dt img{width:100%}
    .newsletter dd{width:40%; padding:0 5%; display:table-cell; vertical-align:middle; text-align:right}
    .newsletter dd img{width:140px}

}



@media all and (max-width:640px){
    .cert_top{padding:20px 20px 20px 90px;background-position:20px 20px}

    .certWrap{margin-top:30px}
    .certWrap li{float:none;width:100%;margin-left:0;margin-bottom:20px}

    .lovepaper_wrap p{padding:15px}
    .lovepaper_btn li:first-child + li + li{clear:both;margin-left:0}
    .lovepaper_btn li:first-child + li + li + li + li{clear:both;margin-left:0}
}

@media all and (max-width:500px){
    .viewGuide .page_exp{padding:20px}
}

@media all and (max-width:480px){
    .newsletter dt{width:100%; padding:20px 0 0 0; text-align:center; display:block}
    .newsletter dt img{width:160px}
    .newsletter dd{width:100%; padding:10px 0 0 0; text-align:center;  display:block}
    .newsletter dd img{width:120px}
    .newsletter dd p{text-align:center; padding:10px 10px 30px 10px}
    .newsletter p.newsletter_bottom img{width:200px}


    .webzin dt{width:100%; padding:20px 0; display:block; text-align:center;height:auto}
    .webzin dt img{width:150px}
    .webzin dd{width:100%; padding:0; display:block; text-align:center;}
    .webzin dd img{width:140px}
    .webzin dd p{padding:10px 20px; text-align:center}


}

@media all and (max-width:400px){
    .confirmBox .confirmInput{width:auto;padding-left:75px;background-size:60px 59px}
}