/**
* OLYM Cascading Style Sheets
* File Name : sub.css
* Description : 서브 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2016.08.09
* Update : 2016.08.09
* Copyright(c) 2015 OLYM Communications. All Rights Reserved.
*/
.wrap_box { width:1400px;}
#spot { width:100%; height:500px;}
#spot .desc_box {top: 50%;left: 0;transform: translate(0, -50%); color:#fff; }
#spot h2 {font-size:50px; font-weight: 800; padding:30px 0;}
#spot p { font-size:20px; font-weight: 300;}
.spot  { background:url("/project/design/com/spot6.jpg") no-repeat center;}
.spot1 { background:url("/project/design/com/spot1.jpg") no-repeat center;}
.spot2 { background:url("/project/design/com/spot2.jpg") no-repeat center;}
.spot3 { background:url("/project/design/com/spot3.jpg") no-repeat center;}
.spot4 { background:url("/project/design/com/spot4.jpg") no-repeat center;}
.spot5 { background:url("/project/design/com/spot5.jpg") no-repeat center;}
.spot6 { background:url("/project/design/com/spot6.jpg") no-repeat center;}
.spot7 { background:url("/project/design/com/spot7.jpg") no-repeat center;}
.spot8 { background:url("/project/design/com/spot6.jpg") no-repeat center;}

#contents_box:after { clear:both; display:block; content:"";}

.location { position:absolute;display: inline-block;right: 0;top: 11px;z-index: 1}
.location > ul:after { clear:both; display:block; content:"";}
.location > ul > li { position:relative; float:left; }
.location > ul > li > a {display:block; color:#000; min-width:180px; padding:5px 30px; background:url(/project/design/com/bg_stle_arrow.png) no-repeat 90% center;margin: 15px 0;border-right: 1px solid #ddd;font-size: 1.1em}

.location > ul > li:last-child > a{border-right: 0;color: #0c2253;font-weight: 500}
.location > ul > li.home > a::before {content: "";width: 24px;height: 24px;background:url(/project/design/com/bg_home.png) no-repeat left;position: absolute; top: 50%;transform: translate(0%, -50%);left: -30px}
.location > ul > li.stle_over > a { font-weight:600; }
.location > ul > li > ul { position:absolute; top:50px; left:0;}
.location > ul > li > ul > li > a { min-width:150px; background:#fff; display:block; color:#666; padding:10px 60px 10px 30px; line-height:1.2em; font-size:0.95em; border:1px solid #ddd; border-top:none;position: relative;left: -1px;top: -6px}
.location > ul > li > ul > li:first-child > a { border-top:1px solid #ddd;}
.location > ul > li > ul > li > a:hover { background:#f8f8f8;}
.stle_ul > li > ul { display:none; z-index:10000; }

.stleTitle{position: relative; background:url(/project/design/com/bg_stle.png) repeat-x center 80px;}
h3.stle { font-size:32px; letter-spacing:-0.05em; font-weight:700; padding:60px 60px 0 0;display: inline-block; background:#fff;}
/*h3.stle .stleline{content: "";width: 100%;position: absolute;background: #000;height: 3px;top: 50%;transform: translate(0%, -50%);right: 0;margin-top: 30px}*/

/*#snb { float:left; width:270px;}
.snb_group { width:220px; margin-top:50px; border-top:2px solid #333;}
.snb_group > li > a { display:block; color:#444; padding:10px 24px; border-bottom:1px solid #e1e1e1; }
.snb_group > li > a:hover, .snb_group > li > a.over { background:#f3f3f3;}
.snb_group > li > ul { border-bottom:1px solid #e1e1e1; padding:10px 0;}
.snb_group > li > ul > li > a { display:block; padding:5px 20px 5px 33px; color:#666; background:url(/project/design/com/bg_snb_2d.gif) no-repeat 24px 17px; }
.snb_group > li > ul > li > a:hover, .snb_group > li > ul > li > a.over { color:#dd2424;}*/

#contents { float:left; width:100%; padding:80px 0; color:#666; font-size:20px;}
#contents .img_ready{text-align: center;}

#footer { border-top:2px solid #000;}


@media all and (max-width:1660px) {
.wrap_box { width:90%;}
}

@media all and (max-width:1460px) {
}

@media all and (max-width:1280px) {
#spot h2 {font-size:40px; }
#contents { font-size:18px;}
#contents img { max-width:100%;}
}
@media all and (max-width:1000px) {
#spot { height:250px;}
#spot .desc_box {top: 60%;}
#spot h2 {font-size:30px; font-weight:600; padding:10px 0;}
#spot p { font-size:16px;}
.location { top: 6px; font-size:0.875em;}
.location > ul > li > a {min-width:10px; padding:0 25px 0 10px; background-size:8px;}
.location > ul > li.home > a { display:none;}
.location > ul > li > ul {  left:auto; right:0;}
.location > ul > li > ul > li > a { min-width:60px; max-width:100px; padding:10px;}

.stleTitle{background:url(/project/design/com/bg_stle.png) repeat-x center 58px; background-size:auto 2px;}
h3.stle { font-size:26px; padding:40px 30px 0 0;}

#contents { font-size:16px;}
}

@media all and (max-width:800px) {
.spot  { background:url("/project/design/com/spot6.jpg") no-repeat center; background-size:cover;}
.spot1 { background:url("/project/design/com/spot1.jpg") no-repeat center; background-size:cover;}
.spot2 { background:url("/project/design/com/spot2.jpg") no-repeat center; background-size:cover;}
.spot3 { background:url("/project/design/com/spot3.jpg") no-repeat center; background-size:cover;}
.spot4 { background:url("/project/design/com/spot4.jpg") no-repeat center; background-size:cover;}
.spot5 { background:url("/project/design/com/spot5.jpg") no-repeat center; background-size:cover;}
.spot6 { background:url("/project/design/com/spot6.jpg") no-repeat center; background-size:cover;}
.spot7 { background:url("/project/design/com/spot7.jpg") no-repeat center; background-size:cover;}
.spot8 { background:url("/project/design/com/spot6.jpg") no-repeat center; background-size:cover;}
#spot h2 {font-size:24px;}
#spot p { font-size:14px;}
.stleTitle{background:url(/project/design/com/bg_stle.png) repeat-x center 68px; background-size:auto 2px;}
h3.stle { font-size:20px; padding:55px 20px 0 0;}
#contents { padding:50px 0;  font-size:15px;}
}

@media all and (max-width:500px) {
#contents { padding:30px 0;}
}