@charset "utf-8";

/* 단일클러스터 추가시 하기 내용 home.css에 추가 및 html 내 home-1tile.css 호출 삭제 */
/* If a single cluster is added, attach below codes to 'home.css', and delete the link tag referring to 'home-1tile.css' in HTML document. */

@font-face {
font-family:'sssB';
src:url('../fonts/samsungsharpsans-bold_v2.eot');
src:url('../fonts/samsungsharpsans-bold_v2.eot?#iefix') format('embedded-opentype'),
url('../fonts/samsungsharpsans-bold_v2.woff') format('woff'),
url('../fonts/samsungsharpsans-bold_v2.svg#SamsungSharpSans-Bold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
    font-family: 'SamsungOne400';
    src: url('../fonts/samsungone-400.eot'); /* IE9 Compat Modes */
    src: url('../fonts/samsungone-400.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/samsungone-400.woff') format('woff'), /* Modern Browsers */
         url('../fonts/samsungone-400.ttf') format('truetype'); /* Safari, Android, iOS */
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

/* single cluster */
.single-area{height:100%;background:#000;opacity:0}
.single-area.has-animated{opacity:1}
.single-area .section-wrap{max-height:100%}
.single-area .prd-item{max-height:700px;float:none;width:100%}
.single-area .prd-item:before{content:'';display:block;padding-top:58.4%}
.single-area .prd-text-area{position:absolute;height:50%;top:50%;left:0;right:0;bottom:0}
.single-area .prd-vertical-wrap{position:relative;width:100%;top:50%;left:0;right:0;bottom:0;  -webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%)}
.single-area .prd-img{position:absolute;top:0;left:0;right:0;bottom:50%}
.single-area .button-prd{margin-top:3%}
.single-area .button-prd:hover{border-color: #fff;background-color: #fff;color: #000;font-color: #000}
.single-area .button-prd:focus{border-color: #fff;background-color: #fff;color: #000; font-color: #000}
.single-area .prd-heading{width:100%;text-align:center;font-size:2.6vw;line-height:1;padding:0;position:absolute;top:0;left:0}
.single-area .prd-heading strong{display:inline-block;font-weight:normal}
.single-area .prd-img{width:100%;margin:0;overflow:hidden;text-align:center}
.single-area .prd-info{width:100%;max-width:100%;text-align:center;display:table;vertical-align:middle;position:static}
.single-area .prd-info .prd-tit{font-size:4.2vw;display:table-row;vertical-align:middle;text-transform:none;line-height:120%}
.single-area .prd-info .prd-txt{margin-top:1.6%;font-size:1.8vw}
.single-area .prd-img.prd-align-left{text-align:left}
.single-area .prd-img.prd-align-right{text-align:right}

.single-area .type-1 .prd-img{bottom:45.5%}
.single-area .type-1 .prd-heading{top:5%}
.single-area .type-1 .prd-text-area{top:54.5%;height:45%}
.single-area .type-1 .prd-info{padding-top:2%}

.single-area .type-2 .prd-text-area{top:0;height:45%}
.single-area .type-2 .prd-heading{top:9%}
.single-area .type-2 .prd-info{padding-top:2%}
.single-area .type-2 .prd-img{top:45.5%;bottom:0}

.single-area .type-3{padding:0}
.single-area .type-3 .prd-heading{position:absolute;top:3.5%;left:0;text-align:left}
.single-area .type-3 .prd-img{width:53%;height:89%;top:11%;right:0;left:auto}
.single-area .type-3 .prd-img img{width:100%;height:auto;position:absolute;left:0;bottom:0}
.single-area .type-3 .prd-text-area{width:49%;left:0;top:10%;height:80%}
.single-area .type-3 .prd-info{text-align:left}
.single-area .type-3 .prd-tit{font-size:60px;display:table-row;vertical-align:middle;text-transform:none;line-height:120%;color:#fff;font-family:'sssB';}
.single-area .type-3 .prd-tit span{display:block;}
.single-area .type-3 .prd-txt{font-family: 'SamsungOne400';font-size:20px; color:#fff; line-height:28px; margin-top:10px;width:80%;}
.single-area .type-3 .prd-txt span{display:block;}
.single-area .type-3 .button-prd{margin-top:40px; text-transform:uppercase; border:2px solid #fff; border-radius:5px; color:#fff; font-family: 'SamsungOne400';font-size:13px; font-weight:bold;}
.single-area .type-3 .button-prd:hover{color:#000;font-weight:bold;}
.single-area .type-3 .button-prd:focus{color:#000;font-weight:bold;}

.single-area .type-4{padding:0}
.single-area .type-4 .prd-heading{position:absolute;top:3.5%;left:0;text-align:left}
.single-area .type-4 .prd-img{width:53%;height:89%;top:11%;left:0}
.single-area .type-4 .prd-img img{width:100%;height:auto;position:absolute;left:0;bottom:0}
.single-area .type-4 .prd-text-area{width:44%;right:0;left:auto;top:11%;height:89%}
.single-area .type-4 .prd-info{text-align:left}
.single-area .type-4 .prd-txt{margin-top:4%}
.single-area .type-4 .button-prd{margin-top:8%}

.lt-ie8 .single-area .prd-vertical-wrap{top:0}
.lt-ie8 .single-area .type-2 .prd-text-area,
.lt-ie8 .single-area .type-3 .prd-vertical-wrap,
.lt-ie8 .single-area .type-4 .prd-vertical-wrap{top:50px}

@media screen and (max-width:1280px){
.single-area .type-3 .prd-tit{font-size:50px}
.single-area .type-3 .prd-txt{font-size:18px;line-height:120%;}
.single-area .type-3 .button-prd{margin-top:30px;}
}
@media screen and (max-width:1024px){
body{background-color:#fff}
.single-area{max-height:600px}
.single-area .section-wrap{padding:0 20px 0;margin:0}
.single-area .type-1{padding:0}
.single-area .type-2{padding:0}
.single-area .type-3{padding:0}
.single-area .type-4{padding:0}
.single-area .prd-info .prd-txt{font-size:1.6vw}
.single-area .type-2 .prd-info{padding-top:4%}
.single-area .type-3 .prd-tit{font-size:30px}
.single-area .type-3 .prd-txt{font-size:14px;line-height:120%}
.single-area .type-3 .button-prd{font-size:12px; margin-top:20px;}
.single-area .type-3 .prd-img {width:45%;}
}

@media screen and (max-width:767px){
.single-area{min-height:468px;height:auto;max-height:1000px;}
.single-area .section-wrap{padding:0;margin:0}
.single-area .prd-item{margin:0; height:auto; max-height:1000px;}
.single-area .prd-item:before{display:none}
.single-area .prd-img{height:auto;position:static;text-align:center}
.single-area .prd-img img,
.single-area .type-2 .prd-img img,
.single-area .type-3 .prd-img img,
.single-area .type-4 .prd-img img{width:100%;height:auto;position:static;box-sizing:border-box}
.single-area .prd-text-area,
.single-area .type-1 .prd-text-area,
.single-area .type-2 .prd-text-area{height:253px;position:relative}
.single-area .prd-heading{font-size:16px}
.single-area .prd-info .prd-tit{font-size:33px;line-height:90%}
.single-area .prd-info .prd-txt{font-size:12px;display:block;line-height:130%;width:90%;margin:2% auto 0}
.single-area .button-prd{margin-top:20px}
.single-area .type-3 .prd-heading{top:5%}
.single-area .type-4 .prd-heading{top:50%}
.single-area .type-3 .prd-text-area,
.single-area .type-4 .prd-text-area{width:100%;height:290px;position:static;text-align:center}
.single-area .type-3 .prd-img,
.single-area .type-4 .prd-img{width:100%;position:static;text-align:center}
.single-area .type-3 .prd-info,
.single-area .type-3 .prd-heading,
.single-area .type-4 .prd-info,
.single-area .type-4 .prd-heading{text-align:center}
.single-area .type-1 .button-prd,
.single-area .type-2 .button-prd,
.single-area .type-3 .button-prd,
.single-area .type-4 .button-prd{margin-top:20px}
.single-area .type-3 .prd-info{padding-top:4%}
.single-area .type-4 .prd-info{padding-top:2%}
.single-area .type-3 .prd-info .prd-tit{line-height:43px; width:90%; margin:0 auto; display:block;}
.single-area .type-1 .prd-img img,
.single-area .type-2 .prd-img img{position:relative;top:50%;bottom:auto;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%)}
.btn-prev, .btn-next{display:none}
.single-area .type-3 .prd-txt span{display:inline;}
.single-area .type-3 .prd-txt {margin-top:30px; font-size:20px; line-height:1.4;}
.single-area .type-3 .prd-tit span{display:inline;}
.single-area .type-3 .prd-tit {font-size:38px; line-height:1.4;}
}

@media screen and (max-width:350px){
.single-area .prd-img img,
.single-area .type-2 .prd-img img,
.single-area .type-3 .prd-img img,
.single-area .type-4 .prd-img img{margin-top:30px;}
.single-area .type-3 .prd-info .prd-tit{margin-top:30px;}
}