@charset "utf-8";
/* reset */
@import url(reset.css);

.clear {
	clear: both;
}

html, body {
	height: 100%;
}
body { 
	text-align: center;
	width: 100%;
	height: 100%;
	font-size: 75%;

	font-family: "Roboto", sans-serif;
	color: #515151;
	list-style: none;
	line-height: 1.7em;
	border: 0px solid blue;
	outline: 0;
}

body.body-fixed {
	height: 100%;
	overflow: hidden;
}


/* 스킵네비게이션 */
.skip-navigation a {
	display: block; 
	height: 1px; 
	width: 1px; 
	margin: 0 -1px -1px 0; 
	padding: 0; 
	overflow: hidden; 
	font-size:0; 
	line-height:0;
}

.skip-navigation a:hover,
.skip-navigation a:active,
.skip-navigation a:focus {
	position: fixed; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 20px; 
	line-height: 20px; 
	vertical-align: middle; 
	font-size: 14px; 
	font-weight: bold; 
	text-align: center; 
	background: #000; 
	color: #fff;
	z-index: 1000000
}


.blind,
caption {
	visibility: hidden; 
	overflow: hidden; 
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 0; 
	height: 0; 
	font-size: 0; 
	line-height: 0
}

.clear:after {
	content: "";
	clear: both;
	display: block;
}


.wrapper {
	position: relative;
	display: block;
	font-size: 1em;
	margin: 0;
	padding: 0;
	height: 100%;
	padding-left: 170px;
	text-align: left;
}

.header {
	position: fixed;
	top: 0;
	left: 0;
	width: 170px;
	height: 100%;
	background: #303030;
	z-index: 100;
}

.header-area {
	box-sizing: border-box;
	height: 100%;
	padding: 50px 20px 0 20px;
	overflow-x: hidden;
	overflow-y: auto;
}

.header-area h1 {
	display: block;
	margin-bottom: 117px;
}

.header-area h1 a {
	display: block;
	width: 128px;
	height: 36px;
	text-indent: -5000em;
	background: url(../images/common/logo02.png) no-repeat 0 0;
}

.header-area .topmenu-wrapper {
	margin: 0;
	padding: 0;
}

.header-area .topmenu-wrapper > ul {
	margin: 0;
	padding: 0;
	border: 0px solid red;
}

.header-area .topmenu-wrapper > ul > li {
	margin: 0;
	padding: 0;
}

.header-area .topmenu-wrapper > ul > li {
	margin-bottom: 28px;
}

.header-area .topmenu-wrapper > ul > li .top-menu-depth1 {
	position: relative;
	display: block;
	color: #707070;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: -1px;
	font-family: "Myriad Pro", sans-serif; 
}

.header-area .topmenu-wrapper > ul > li .top-menu-depth1:hover,
.header-area .topmenu-wrapper > ul > li .top-menu-depth1.selected,
.header-area .topmenu-wrapper > ul > li .top-menu-depth1.on {
	color: #ed1b23;
}

.header-area .topmenu-wrapper > ul > li .top-menu-depth1 .icon {
	position: absolute;
	top: 50%;
	right: 0;
	width: 3px;
	height: 5px;
	margin-top: -3px;
	background: url(../images/common/icon_arrow_off02.gif) no-repeat 0 0;
}

.header-area .topmenu-wrapper > ul > li .top-menu-depth1:hover .icon ,
.header-area .topmenu-wrapper > ul > li .top-menu-depth1.selected .icon ,
.header-area .topmenu-wrapper > ul > li .top-menu-depth1.on .icon  {
	background: url(../images/common/icon_arrow_on.gif) no-repeat 0 0;
}

.top-dpeth2-menu {
	display: none;
	position: fixed;
	top: 0;
	left: 170px;
	width: 169px;
	height: 100%;
	padding-left: 19px;
	padding-right: 16px;
	background: #000000;
}


.top-dpeth2-menu ul:first-child {
	padding-top: 204px;
}

.top-dpeth2-menu ul {
	display: block;
}


.top-dpeth2-menu {
	display: none;
	position: fixed;
	top: 0;
	left: 170px;
	width: 169px;
	height: 100%;
	padding-left: 19px;
	padding-right: 16px;
	background: #000000;
}


.top-dpeth2-menu ul:first-child {
	padding-top: 204px;
}

.top-dpeth2-menu ul > li {
	margin-bottom: 29px;
	opacity: 1;
}

.top-dpeth2-menu ul > li > a {
	position: relative;
	display: block;
	font-size: 14px;

	font-weight: 900;
}

.top-dpeth2-menu ul > li > a:hover,
.top-dpeth2-menu ul > li > a.selected,
.top-dpeth2-menu ul > li > a.on {
	color: #ed1c24;
}

.top-dpeth2-menu ul > li > a .number {
	display: block;
}

.top-dpeth2-menu ul > li > a .icon {
	position: absolute;
	bottom: 6px;
	right: 0;
	display: block;
	width: 3px;
	height: 5px;
	background: url(../images/common/icon_arrow_off02.gif) no-repeat 0 0;
}

.top-dpeth2-menu ul > li > a:hover .icon,
.top-dpeth2-menu ul > li > a.selected .icon,
.top-dpeth2-menu ul > li > a.on .icon {
	background: url(../images/common/icon_arrow_on.gif) no-repeat 0 0;
}

.top-dpeth2-menu ul > li .top-dpeth3-menu {
	display: none;
	max-height: 250px;
	overflow-x: hidden;
	overflow-y: auto;
	margin-top: 15px;
	padding: 20px 6px 15px 9px;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;

	scrollbar-3dLight-Color: #000000; 
	scrollbar-arrow-color: #000000; 
	scrollbar-base-color: #000000; 
	scrollbar-Face-Color: #3f3f3f; 
	scrollbar-Track-Color: #000000; 
	scrollbar-DarkShadow-Color: #000000; 
	scrollbar-Highlight-Color: #000000; 
	scrollbar-Shadow-Color: #000000;
}

.top-dpeth2-menu ul > li .top-dpeth3-menu::-webkit-scrollbar {width: 8px; height: 8px; border: 0px solid #000; }
.top-dpeth2-menu ul > li .top-dpeth3-menu::-webkit-scrollbar-button:start:decrement, 
.top-dpeth2-menu ul > li .top-dpeth3-menu::-webkit-scrollbar-button:end:increment {display: block; height: 10px; background: #000}
.top-dpeth2-menu ul > li .top-dpeth3-menu::-webkit-scrollbar-track {background: #3f3f3f; -webkit-border-radius: 0; border-radius:0; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.2)}
.top-dpeth2-menu ul > li .top-dpeth3-menu::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(0,0,0,.2); -webkit-border-radius: 8px; border-radius: 0; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.1)}

.top-dpeth2-menu ul > li .top-dpeth3-menu li {
	margin-bottom: 20px;
}

.top-dpeth2-menu ul > li .top-dpeth3-menu li a {
	display: block;
	color: #777777;
	font-size: 13px;
	font-weight: 700;
}

.top-dpeth2-menu ul > li .top-dpeth3-menu li a:hover,
.top-dpeth2-menu ul > li .top-dpeth3-menu li a.selected, 
.top-dpeth2-menu ul > li .top-dpeth3-menu li a.on {
	color: #ffffff;
}

/* container */
.container {
	margin: 0;
	padding: 0;
	padding-bottom: 100px;
}

.subvisual {
	position: relative;
	background: #000;
	width: 100%;
	height: 219px;
	overflow: hidden;
}

.subvisual img {
	position: absolute;
	top: 0;
	left: 50%;
	width: 1530px;
	margin-left: -765px;
	display: block;
}

/* contents */
.contents {
	position: relative;
	padding-top: 19px;
	width: 1060px;
	margin: 0 auto;
}

.contents-navigation {
	text-align: right;
	margin-bottom: 30px;
}

.contents-navigation .icon-home {
	display: inline-block;
	vertical-align: middle;
	width: 10px;
	height: 10px;
	text-indent: -5000em;
	font-size: 0;
	background: url(../images/common/icon_home.gif) no-repeat 0 0;
}

.contents-navigation .icon-gt {
	display: inline-block;
	vertical-align: middle;
	width: 6px;
	height: 10px;
	margin: 0 5px;
	text-indent: -5000em;
	font-size: 0;
	background: url(../images/common/icon_gt.gif) no-repeat 0 0;
}

.contents-navigation .location {
	display: inline-block;
	vertical-align: middle;

	color: #333333;
	font-size: 12px;
	line-height: 12px;

	font-weight: 900;
}

.contents-navigation strong {
	display: inline-block;
	vertical-align: middle;
	color: #ed1b23;
	font-size: 12px;
	line-height: 12px;

	font-weight: 900;
}

.contents-title02 {
	padding-left: 38px;
	margin-bottom: 30px;
	background: url(../images/common/icon_bullet01.png) no-repeat 0 50%;
}

.contents-title02 img {
	display: block;
}

.contents-area {
	margin: 0;
	padding: 0;
}


/* footer */
.footer {
	margin-top: 180%;
	z-index: 100;
}

.footer-area {
	width: 130px;
	padding: 0 0;
}

.footer-menu {
	margin-bottom: 25px;
}

.footer-menu > li {
	position: relative;
	float: left;
	width: 50%;
}

.footer-menu > li > a {
	display: block;
	text-align: center;
	color: #707070;
	font-size: 11px;
	line-height: 13px;
	font-weight: 900
}

.footer-menu > li .footer-menu-list {
	display: none;
	position: absolute;
	bottom: 55px;
	left: 0;
	text-align: center;
	padding-bottom: 12px;
}

.footer-menu > li #footer-menu-list1 {
	width: 135px;
}

.footer-menu > li .footer-menu-list .bubble-tail {
	position: absolute;
	bottom: 0;
	left: 22px;
	display: block;
	width: 23px;
	height: 12px;
	margin-bottom: 1px;
	border: 0px solid red;
}




.footer-menu > li .footer-menu-list ul {
	text-align: left;
	padding: 15px 10px 5px 10px;
	background: #fff;
	border: 1px solid #9c9c9c;
}

.footer-menu > li .footer-menu-list ul li {
	display: block;
	margin-bottom: 10px;
}


.footer-menu > li .footer-menu-list ul li a {
	font-size: 12px;
	line-height: 14px;
	color: #222222;

	font-weight: 500;
}

.footer-menu > li .footer-menu-list ul li a:hover {
	color: #ed1b23;
}

.footer-area address,
.footer-area .footer-company-info,
.footer-area .footer-company-info a {
	display: block;
	font-size: 11px;
	line-height: 18px;
	color: #707070;

	font-weight: 500;
}

.footer-area .footer-company-info a:hover {
	text-decoration: underline;
}

.footer-area .footer-company-info {
	margin-bottom: 24px;
}


.footer-area .copyright {
	display: block;
	color: #505050;
	font-size: 10px;
	line-height: 18px;
}

.btn-pr-movie {
	display: block;
	margin-bottom: 20px;

}

.btn-pr-movie a {
	display: block;
	width: 131px;
	height: 21px;
	text-indent: -5000em;
	background: url(../images/common/icon_sub_youtube02.png) no-repeat 0 0;
}

@media only all and (min-width: 1440px) {
	.subvisual img {
		position: absolute;
		top: 0;
		left: 0;
		width: 1530px;
		margin-left: 0;
		display: block;
	}

}