﻿@charset "utf-8";

/* header 스타일 01*/
header.NormalHeader{position:fixed;width:100%;overflow:visible;z-index:100;}
header.NormalHeader .TopGnb{position:relative;height:40px;}
header.NormalHeader h1{position: absolute;top:0;left:0;width:138px;height:30px;background:url('/img/common.png') no-repeat 0 -40px;font-size:0;margin:2px}
header.NormalHeader nav.topmenuNavi{overflow:hidden;margin:0 40px 0 140px;height:40px;line-height:40px;}
header.NormalHeader nav.topmenuNavi  >  div{float:left;width:20%;text-align:center;}
header.NormalHeader nav.topmenuNavi  >  div a{color:#fff;font-size:1.3em;font-weight:bold;font-family: 'PT Sans', sans-serif;-webkit-transition:0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease}
header.NormalHeader nav.topmenuNavi  >  div a:hover{letter-spacing : 6px; letter-spacing: 0.3em;}

/* header 스타일 02*/

header.ScrollHeader{position:fixed;width:100%;overflow:visible;z-index:100;}
header.ScrollHeader .TopGnb{position:relative;height:40px;background:#fff;opacity:0.9;filter:alpha(opacity=90)}
header.ScrollHeader h1{position: absolute;top:0;left:0;width:138px;height:30px;background:url('/img/common.png') no-repeat 0 0px;font-size:0;margin:2px}
header.ScrollHeader nav.topmenuNavi{overflow:hidden;margin:0 40px 0 140px;height:40px;line-height:40px}
header.ScrollHeader nav.topmenuNavi  >  div{float:left;width:20%;text-align:center;}
header.ScrollHeader nav.topmenuNavi  >  div a{color:#000;font-size:1.3em;font-weight:bold;font-family: 'PT Sans', sans-serif;-webkit-transition:0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease}
header.ScrollHeader nav.topmenuNavi  >  div a:hover{letter-spacing : 6px; letter-spacing: 0.3em;}
header .fullmenuGnb{display:none;position: absolute;top:0;right:0;width:37px;height:30px;background:url('/img/common.png') no-repeat -165px 0px;font-size:0; cursor:pointer;margin:5px;}

header .fullmenuGnbScroll{display:none;position: absolute;top:0;right:0;width:37px;height:30px;background:url('/img/common.png') no-repeat -165px -46px;font-size:0; cursor:pointer;margin:5px;}

.locationWrap{background:#ff8122;height:30px}
.locationWrap nav.pageNavi{overflow:visible}
.locationWrap nav.pageNavi > div {float:left;position:relative;line-height:30px;font-size:1.2em;border-right:1px solid #ae5e22}
.locationWrap nav.pageNavi > div a{display:block;color:#fbd8bd;padding-left:30px;width:200px;background:url('/img/common.png') no-repeat right -84px;font-family:ng,나눔 고딕, 'Nanum Gothic',dotum,Dotum,돋움, 돋움체,AppleGothic,sans-serif;font-weight:bold;}
.locationWrap nav.pageNavi div.on a{color:#fff;background:url('/img/common.png') no-repeat right -123px} 
.locationWrap nav.pageNavi > div a:hover{background:#d86916 url('/img/common.png') no-repeat right -164px;}
.locationWrap nav.pageNavi ul{position: absolute;top:30px;left:-1px;border:1px solid #ae5e22;background:#ff8122;padding:5px 0}
.locationWrap nav.pageNavi ul li{display:block}
.locationWrap nav.pageNavi ul li a{color:#fff;background:none;font-size:.9em;}
.locationWrap nav.pageNavi .on ul li a{color:#fbd8bd;background:none;font-size:.9em;}
.locationWrap nav.pageNavi .on ul li a:hover{color:#fff;background:url('/img/common.png') no-repeat right -164px;}

/* 열리는 메뉴*/

.MobileMenuWrap{width:290px;background:#fff;z-index:130;position:fixed;top:0px;right:-290px;height:100%;}
.MobileMenuWrap .MobileMenuTop{background:#ff7e16;overflow:hidden;padding:10px}
.MobileMenuWrap .MobileMenuTop h2{float:left;width:100px;height:25px;background:url('/img/common.png') no-repeat 0 -96px;font-size:0}
.MobileMenuWrap .MobileMenuTop .closed{float:right;;width:25px;height:25px;background:url('/img/common.png') no-repeat -137px -99px;border:0;cursor:pointer;}
.MobileMenuWrap nav.MobileMenu{}
.MobileMenuWrap nav.MobileMenu div span{display:block;cursor:pointer;border-bottom:1px solid #ccc;background:url('/img/common.png') no-repeat right -198px;font-size:1.3em;font-weight:bold;color:#4e4e4e;padding:15px 0 15px 20px}
.MobileMenuWrap nav.MobileMenu div.on span{background:url('/img/common.png') no-repeat right -240px;}
.MobileMenuWrap nav.MobileMenu div ul{background:#757c89}
.MobileMenuWrap nav.MobileMenu div li a{display:block;padding:8px 0 8px 20px;border-bottom:1px solid #565f6e;color:#fff;font-size:1.1em;}
.MobileMenuWrap nav.MobileMenu div li a:hover{background:#565f6e}


.SubContentsVisual{width:100%;height:490px;-webkit-transition:0.6s ease;-moz-transition: all 0.6s ease;-ms-transition: all 0.6s ease;transition: all 0.6s ease;}
.VisualSubImg{height:100%;/*webkit-transition:1.0s ease;-moz-transition: all 1.0s ease;-ms-transition: all 1.0s ease;transition: all 1.0s ease*/}
.SubVisualSlogan{padding-top:200px;text-align:center;color:#fff;font-size:1.2em;-webkit-transition:1.0s ease;-moz-transition: all 1.0s ease;-ms-transition: all 1.0s ease;transition: all 1.0s ease;font-family:ng,나눔 고딕, 'Nanum Gothic',dotum,Dotum,돋움, 돋움체,AppleGothic,sans-serif;font-weight:bold;}
.SubVisualSlogan h2{font-size:2.6em;font-weight:normal;margin-bottom:.8em}
.SubVisualSlogan span.txt01{padding:0 10px}
.SubVisualSlogan p.type01{margin-top:5px}
.SubVisualSlogan a{display:inline-block;border:1px solid #fff;border-radius:3px;padding:4px 10px;color:#fff}
.SubVisualSlogan a:hover{border:1px solid #ff800f;background:#ff800f;-webkit-transition:0.5s ease;-moz-transition: all 0.5s ease;transition: all 0.5s ease}

.Subline{border-top:1px solid #dbdbdb}



/**************************************   미디어스크린 조절 시작 **************************************/
@media screen and (max-width:1100px){
.SubContentsVisual{height:430px;-webkit-transition:0.6s ease;-moz-transition: all 0.6s ease;-ms-transition: all 0.6s ease;transition: all 0.6s ease;}
.VisualSubImg {background-size:cover;}
}

/**/
@media screen and (max-width:560px){

header nav.topmenuNavi{display:none}
header .fullmenuGnb{display:block;}
header .fullmenuGnbScroll{	display:block;}
.SubContentsVisual{height:350px ;}
.VisualSubImg {background-size:cover;}
.SubVisualSlogan{padding-top:150px;text-align:center;color:#fff;font-size:.9em;/*-webkit-transition:1.0s ease;-moz-transition: all 1.0s ease;-ms-transition: all 1.0s ease;transition: all 1.0s ease*/}
.Subline{display:none}

#topMenu{display:none;}
.locationWrap nav.pageNavi > div {float:none;padding-right:20px;}
.locationWrap nav.pageNavi > div a, .locationWrap nav.pageNavi div.on a, .locationWrap nav.pageNavi ul{width:100%}

}

@media screen and (max-width:850px){
    .ContentsWrapper #modelCreate {
        width: 100% !important;
        left: 0% !important;
    }
}