@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/*reset*/
*{margin:0;padding:0;box-sizing:border-box}
li{list-style:none}
img{border:0;vertical-align:top}
body, td, p, input, button, textarea, select,a{font-family:'나눔고딕','NanumGothic','Nanum Gothic','돋움',dotum; font-size:12px; color:#555;}
h1,h2,h3,h4,h5,h6,strong,b,dt{font-weight:600}
a,a:hover,a:active,a:focus{text-decoration:none}


/*common*/
body{min-width:1000px;min-height:900px;overflow-y:scroll}
html,body{height:100%}



/*aside*/
#aside{position:fixed;left:0;top:0;width:200px;background:#ff7800;min-height:900px;height:100%;z-index:10;border-right:1px solid #ddd}
#aside h1 a{display:table-cell;background:#fff;width:200px;height:150px;vertical-align:middle;text-align:center}

#aside .snb{position:relative;z-index:1;padding-left:20px;margin-top:50px}
#aside .snb . li{position:relative}
#aside .snb li > a{display:block;font-size:18px;color:#fff;padding-left:10px;line-height:40px;border-bottom:1px solid #ffc963}
#aside .snb li > a:hover,
#aside .snb li.on > a{}
#aside .snb dl{margin-left:-20px;padding:8px 0;padding-left:40px;background:#61c39f;display:none}
#aside .snb dd{}
#aside .snb dd > a{color:#fff;font-size:13px;font-weight:600;line-height:24px}

#aside .info{position:absolute;bottom:10px}
#aside .info .shop{padding:10px;color:#fff;font-size:12px;line-height:1.45;letter-spacing:-0.5px}
#aside .info .copy{padding:10px;color:#ccc;font-size:12px;line-height:1.45;letter-spacing:-0.5px}
#aside .info .madeby a{display:block;padding:0 10px;background:#000;color:#ccc;font-size:12px;height:22px;line-height:20px;letter-spacing:-0.5px;font-weight:600}


/*quick*/
#quick{position:fixed;top:0;right:0;width:296px;border-left:1px solid #ddd;min-height:900px;height:100%;z-index:10;background:#e57c27;transition:0.3s;display:none}
#quick.off{right:-296px;transition:0.3s;}

#quick .qs1 .title{padding:20px 0 10px;background:#fff}
#quick .qs1 .con{overflow:hidden}
#quick .qs1 .con > div{float:left;width:50%}
#quick .qs1 .con > div strong{display:block;height:30px;line-height:30px;background:#90b213;color:#fff;padding-left:10px;font-size:13px;font-weight:400}
#quick .qs1 .con > div:first-child strong{background:#6ab239}

#quick .qs2 .title{padding:20px 0 10px;background:#fff}

#quick .qs5{position:absolute;bottom:0;width:100%}
#quick .qs5 .d_banner{position:relative;width:100%;height:116px;overflow:hidden;background:#fff}
#quick .qs5 .d_banner .img{position:relative;width:100%;height:100%;overflow:hidden}
#quick .qs5 .d_banner .img li{position:absolute;left:0;top:0;display:none}
#quick .qs5 .d_banner .img li:first-child{display:block}
#quick .qs5 .d_banner .img li a{display:block;height:100%}
#quick .qs5 .d_banner .btn{position:absolute;left:10px;top:10px;z-index:1}
#quick .qs5 .d_banner .btn li{display:inline-block;width:8px;height:8px;background:#000;margin:0 2px;cursor:pointer;text-indent:-9999px;border-radius:10px}
#quick .qs5 .d_banner .btn li.on{background:#e62d2d}

#quick .toggle{position:absolute;left:-30px;top:30px;width:30px;height:126px;background:url('../images/qs_toggle.png') no-repeat;cursor:pointer}
#quick.off .toggle{;background:url('../images/qs_toggle_on.png') no-repeat}

.thumb-scale{display:block;overflow:hidden}
.thumb-scale img{transition:.3s;transform:scale(1)}
.thumb-scale:hover img{transition:.3s;transform:scale(1.05)}


/*main*/
#main{height:100%;padding-left:200px}
#ms1{position:fixed;right:0;top:0;height:100%;border-left:1px solid #ddd}
#ms1 .tagline{position:absolute;left:5%;top:25%;z-index:1}
#ms1 .d3{position:absolute;left:5%;top:45%;z-index:10}


#ms1 .d_banner{position:relative;width:100%;height:100%;overflow:hidden;}
#ms1 .d_banner .img{position:relative;width:100%;height:100%;overflow:hidden}
#ms1 .d_banner .img li{position:absolute;left:0;top:0;width:100%;height:100%;display:none;background-size:cover !important}
#ms1 .d_banner .img li:first-child{display:block}
#ms1 .d_banner .img li a{display:block;height:100%}
#ms1 .d_banner .btn{position:absolute;width:100%;bottom:100px;text-align:center}
#ms1 .d_banner .btn li{display:inline-block;width:20px;height:20px;background:url('../images/ms1_btn.png') no-repeat;;margin:0 5px;cursor:pointer;text-indent:-9999px}
#ms1 .d_banner .btn li.on{background:url('../images/ms1_btn_on.png') no-repeat}
#ms1 .d_banner .arrow{position:absolute;width:1000px;left:50%;margin-left:-500px;top:50%;margin-top:-100px;}
#ms1 .d_banner .prev{position:absolute;left:0px;margin-left:0;cursor:pointer;transition:0.2s;background:url('../images/ms1_prev.png') no-repeat center;width:50px;height:50px}
#ms1 .d_banner .next{position:absolute;right:0px;margin-right:0;cursor:pointer;transition:0.2s;background:url('../images/ms1_next.png') no-repeat center;width:50px;height:50px}
#ms1 .d_banner:hover .prev{margin-left:-10px;transition:0.2s}
#ms1 .d_banner:hover .next{margin-right:-10px;transition:0.2s}








/*contents*/
#contents{float:left;width:1004px;min-height:900px}
#contents > .container{padding:40px 50px 70px}

.h2{font-size:45px;color:#000;font-weight:600}
.h2 i{display:block;width:75px;height:3px;background:#e57c27;margin:40px 0}
.h3{font-size:30px;color:#cc0000;font-weight:400}

.fs16{font-size:16px}
.fs20{font-size:20px}

.fc{color:#000}
.fc-gray{color:#666}
.fc-red{color:#cc0000}

.p{margin:40px 0;line-height:1.5}

.mt10{margin-top:10px}
.mt20{margin-top:20px}
.mt30{margin-top:30px}
.mt40{margin-top:40px}
.mt50{margin-top:50px}
.mt60{margin-top:60px}
.mt70{margin-top:70px}
.mt80{margin-top:80px}
.mt90{margin-top:90px}
.mt100{margin-top:100px}