@charset "utf-8";

/* Main / Slide / Scroll */

#wrap header {z-index:100000; min-width:auto;}
#wrap footer {background:#fff; position:relative; z-index:1000;}

#content {width:100%; float:none; clear:both;}
#content > div {padding:0;}

.main-type01 {position:relative; z-index:10; min-width:auto; text-align:left;}
.scroll-area {position:relative; z-index:10;}
.scroll-area > div {width:100%; min-width:auto; overflow:hidden; position:relative; z-index:100;}
.scroll-area > div h2 {text-align:center; padding-top:100px;}
.scroll-area > div.main0101 {position:fixed; left:0; top:0; width:100%; z-index:10; background:#162252 url('../images/main/main01_type0102.jpg') no-repeat center center;}
.scroll-area > div.main0102 {min-width:auto; position:relative; background:#fff;}
.scroll-area > div.main0102 h2 {width:100%; position:absolute; left:0; top:0;}
.scroll-area > div.main0103 {width:100%; min-width:auto; position:relative; z-index:1000; background:#030512 url('../images/main/main01_type03.jpg') no-repeat center center fixed;} 
.scroll-area > div.main0104 {width:100%; min-width:auto; position:relative; background:#6e6b66 url('../images/main/main01_type04.jpg') no-repeat center top fixed;} 


#content.main-type01 > div.scrolling {width:22px; position:fixed; right:37px; top:50%; margin-top:-63px; padding-top:10px; z-index:1000; background:url('../images/main/bg_scrolling01.png') no-repeat center top;}
.main-type01 > div.scrolling:after {content:""; width:22px; height:10px; position:absolute; left:0; bottom:-10px; background:url('../images/main/bg_scrolling02.png') no-repeat center center;}
.main-type01 > div.scrolling > a {display:block; width:10px; height:10px; margin:0 auto; background:url('../images/main/btn_control.png') no-repeat left -20px;}
.main-type01 > div.scrolling > a.on {background-position:0 0;}
.main-type01 > div.scrolling > a + a {margin-top:14px;}

.scroll-area > div.main0102 .roll_00 {min-width:auto; background:#FFF;}
.scroll-area > div.main0102 .roll_00 > a {display:block; width:100%; height:100%;}
.scroll-area > div.main0102 .roll_01 {min-width:auto; position:relative; background:url('../images/main/main01_type0202.jpg') no-repeat center top;}
.scroll-area > div.main0102 .roll_01 > a {position:absolute; left:50%; top:67%; margin-left:-600px;}


.main-type01 .main-slide {position:relative; min-width:auto;}
.main-slide ul {position:relative;}
.main-type01 .main-slide ul > li {width:100%; min-width:auto; position:absolute; left:0; top:0;}
.main-type01 .main-slide ul > li > a {display:block; width:100%; height:100%;}
.main-type01 .main-slide ul > li.type0101 {background:url('../images/main/main01_type0101.jpg') no-repeat center center;}
.main-type01 .main-slide ul > li.type0102 {background:url('../images/main/main01_type0102.jpg') no-repeat center center;}

.main-slide > button, .main-slide2 > button {width:60px; height:60px; position:absolute; top:50%; z-index:100; cursor:pointer; background:url('../images/main/btn_slide.png') no-repeat left top;}
.main-slide > button.btn-prev, .main-slide2 > button.btn-prev {left:122px;}
.main-slide > button.btn-next, .main-slide2 > button.btn-next {right:122px; background-position:0 -60px;}
.main-slide > div.control, .main-slide2 > div.control {height:9px; position:absolute; left:50%; bottom:100px; margin-left:-39px; padding:10px 6px 10px 20px; z-index:1000; background:url('../images/main/bg_control01.png') no-repeat left top;}
.main-slide > div.control:before, .main-slide2 > div.control:before {content:""; width:14px; height:29px; position:absolute; right:-14px; top:0; background:url('../images/main/bg_control02.png') no-repeat left top;}
.main-slide > div.control button, .main-slide2 > div.control button {width:9px; height:9px; display:inline-block; vertical-align:top; background:url('../images/main/btn_control.png') no-repeat left -59px;}

.main-slide > div.control button.on, .main-slide2 > div.control button.on {background-position:left -40px;}
.main-slide > div.control > button.btn-pause, .main-slide2 > div.control > button.btn-pause {background-position:0 -78px; margin-left:2px;}
.main-slide > div.control > button.btn-play, .main-slide2 > div.control > button.btn-play {background-position:0 -97px;}

.main-slide2 {position:relative; min-width:auto; overflow:hidden;}
.main-slide2 ul {position:absolute; overflow:hidden;}
.main-slide2 ul > li {float:left;}
.main-slide2 ul > li > img {width:100%;}
.main-slide2 ul > li > div {width:100%; max-width:1230px; min-width:auto; text-align:right; position:relative; margin:0 auto;}
.main-slide2 ul > li > div span {position:absolute; left:0; top:195px;}

.type0101 .motion {width:100%; max-width:1200px; position:absolute; left:50%; top:50%; margin:-150px 0 0 -600px; text-align:center;color:#fff; font-size:52px; font-weight:200; font-family:Roboto;line-height:0.5em; transform:translateX(-50%);}
.type0101 .motion > span.txt01 {margin:0 0 0 -255px; position:absolute; left:50%; top:0; font-size:0.85em; font-weight:300; letter-spacing:0.42em;line-height:1em;}
.type0101 .motion > span.txt02 {margin:0 0 0 -260px; position:absolute; left:50%; top:80px; font-size:1.3em;}
.type0101 .motion > span.txt03 {margin:0 0 0 -260px; position:absolute; left:50%; top:160px; font-size:1.2em; font-weight:400; letter-spacing:0.25em;}
.type0101 .motion > span.txt04 {margin:0 0 0 -255px; position:absolute; left:50%; top:220px; font-size:28px; font-weight:200; letter-spacing:-0.02em; line-height:1.4em; opacity:0.5; font-family:Nanum Gothic;}
.type0101 .motion > span.txt04 > em.smtxt {font-size:18px;}

.type0102 .motion {width:100%; max-width:1200px; position:absolute; left:50%; top:50%; margin:-150px 0 0 -600px; text-align:center;color:#fff; font-size:52px; font-weight:200; font-family:Roboto;line-height:0.5em; transform:translateX(-50%);}
.type0102 .motion > span.txt01 {margin:0 0 0 -255px; position:absolute; left:50%; top:0; display:none; font-size:0.85em; font-weight:300; letter-spacing:0.42em;line-height:1em;}
.type0102 .motion > span.txt02 {margin:0 0 0 -260px; position:absolute; left:50%; top:80px; display:none; font-size:1.3em;}
.type0102 .motion > span.txt03 {margin:0 0 0 -260px; position:absolute; left:50%; top:160px; display:none; font-size:1.2em; font-weight:400; letter-spacing:0.25em;}
.type0102 .motion > span.txt04 {margin:0 0 0 -255px; position:absolute; left:50%; top:220px; font-size:28px; font-weight:200; letter-spacing:-0.02em; line-height:1.4em; opacity:0.5; font-family:Nanum Gothic;}
.type0102 .motion > span.txt04 > em.smtxt {font-size:18px;}


.scrolling > a > span, .main-type02 .quick > ul > li a span {font-size:0; width:0; height:0; line-height:0; position:absolute; text-indent:-3000px; overflow:hidden; background:none;}
