@charset "utf-8";

/* 공통 */

.doc-tit {margin-bottom:35px; font-size:28px; font-weight:700; letter-spacing:-.04em; line-height:1.5em; color:#000064;}

.sub-sec.first {padding-top:0;}
.sub-sec {padding:90px 0;}

.sub-sec-inner {margin-bottom:90px;}
.sub-sec-inner:last-child {margin-bottom:0;}

.doc-pb {margin-bottom:40px;}
.doc-pb:last-child {padding-bottom:0;}

.num-list ul {counter-reset:number 0;}
.num-list ul li {margin-bottom:30px; position:relative; padding-left:42px;}
/* .num-list ul li:before {counter-increment:number 1; content:counter(number); background:#000064; position:absolute; left:0; top:5px; display:flex; justify-content:center; vertical-align:top; align-items:center; width:28px; height:28px; border-radius:50%; color:#fff; line-height:28px; font-size:17px; font-weight:700;} */
.num-list ul li:last-child {margin-bottom:0;}

.num-list ul li .tit {font-size:20px; font-weight:700; letter-spacing:-.04em; color:#2c2c2c; line-height:1.6em;}
.num-list ul li .txt {font-size:17px; font-weight:300; letter-spacing:-.04em; color:#505050; line-height:1.765em;}

.pro-list ul {display:flex; flex-wrap:wrap; margin:-20px;}
.pro-list ul li {width:50%; padding:20px;}
.pro-list ul li.col-x2 {width:100%; display:flex; align-items:center;}
.pro-list ul li.col-x2 .thumb-wrap {width:580px; margin-right:48px;}
.pro-list ul li a {display:block;}
.pro-list ul li p {color:#505050; font-weight:300; letter-spacing:-.04em;}
.pro-list .thumb {box-shadow:12px 12px 6px rgba(0,0,0,0.03); position:relative;padding-bottom:56.25%;height:0;overflow:hidden;background:#fff;}
.pro-list .thumb:after {content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid #ddd;}
.pro-list .thumb.video iframe,
.pro-list .thumb.video object,
.pro-list .thumb.video embed,
.pro-list .thumb.video video {position:absolute; top:0; left:0; width:100%; height:100%;}
.pro-list .thumb.img img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}

.pro-list.type2 {margin-top:20px;}
.pro-list.type2 ul li {width:25%;}
.pro-list.type2 .thumb {padding-bottom:115.926%;}

.video-area {width:62.5vw; max-width:1200px;}

.viewing {box-shadow:3px 3px 6px rgba(0,0,0,0.11);}
.viewing + .fancybox-overlay {background:rgba(0,0,0,0.5);}
.viewing .fancybox-close {background:url("../images/sub/close.jpg") no-repeat 50% 50% / contain; top:0; right:0;}