/* style css */
body, html {
	overflow-x:hidden;
	min-width:1440px;
}

::selection {
   background: #00183c;
   color: #fff
}

::-moz-selection {
   background: #00183c;
   color: #fff
}

::-webkit-selection {
    background: #00183c;
	color: #fff
}


.flex {
	display: -webkit-flex;
	display: flex
}

.flex-v {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; 
	align-items: center
}



.flexBox {
	display: flex;
	justify-content: center;
	align-items: center;
}

a.sns {
	display: block;
	width: 30px;
	height: 30px;
	margin-right: 5px;
}

a.sns:last-child {
	margin-right: 0;
}

.homepage {
	background: url('../img/sns/homepage.svg') no-repeat;
	background-size: 100%;
}

.naver {
	background: url('../img/sns/naver.svg') no-repeat;
	background-size: 100%;
}

.facebook {
	background: url('../img/sns/facebook.svg') no-repeat;
	background-size: 100%;
}

.instagram {
	background: url('../img/sns/instagram.svg') no-repeat;
	background-size: 100%;
}

body, html {
	
}

body {
	-webkit-font-smoothing: antialiased;
	color:#333;
}

.row {
	padding: 0 20px;
	margin: auto
}

/* ��� */
.header {
	position:fixed;
	top: 0;
	left: 0;
	right: 0;
	text-align:center;
	z-index: 9999;
	height: 100px;
	border-bottom:1px solid rgba(213, 213, 213, .2);
	transition:all 300ms;
	min-width:1440px;
}

.header.w,
.header:hover {
	background-color:#fff;
}


.header .row {
	position:relative;
	padding-left: 7%;
	padding-right: 130px;
}

.header .logo {
	margin-top: 15px;
	display:inline-block;
	width: 126px;
	height: 68px;
	background-image:url('../img/logo_img_w.png');
	background-position:center;
	background-size:100%;
}

.header.w .logo,
.header:hover .logo {
	background-image:url('../img/logo_img.png');
}

.header .tel {
	margin-top: 35px;
	display:inline-block;
	width: 182px;
	height: 25px;
	background-image:url('../img/tel_img_w.png');
	background-position:center;
	background-size:100%;
}

.header.w .tel,
.header:hover .tel {
	background-image:url('../img/tel_img.png');
}

.header .sns {
	margin-left: 5px;
}

.header .sns li {
	display:inline-block;
	margin: 0 3px;

}

/*.header .sns li:first-of-type a {
	display:inline-block;
	width: 12px;
	height: 12px;
	background-image:url('../img/menu_sns.png');
	background-position:0 center;
	background-size:
}*/

 .header .sns li:nth-of-type(2) a {
	display:inline-block;
	width: 18px;
	height: 12px;
	background-image:url('../img/menu_youtube.png');
	background-position: 1px center;
} 

/* .header .sns li:nth-of-type(3) a {
	display:inline-block;
	width: 15px;
	height: 12px;
	background-image:url('../img/menu_sns.png');
	background-position:100% center;
} 
 */
  .header .sns li a {
	display:inline-block;
	width: 12px;
	height: 12px;
	background-image:url('../img/menu_sns.png');
	background-position: -20px center;
}  

.header .nav {
	min-width:750px;
	position:absolute;
	left: 50%;
	top: 40px;
	transform:translate(-50%, 0);
}

.header .nav li {
	float:left;
	width: 120px;
	text-align:center;
}

.header .nav li:nth-child(2) {
	width: 150px;
}

.header .nav li a {
	font-size:18px;
	color:#fff;
	font-weight:bold;
}

.header:hover .nav li a,
.header.w .nav li a {
	color:#333;
}

.header .nav li a:hover,
.header .nav li.on a {
	color:#002E78
}

.header .drop-menu {
	display:none; 
	position:absolute;
	background-color:#fff;
	border-top:1px solid #d5d5d5;
	border-bottom:1px solid #d5d5d5;
	width: 100%;
	top: 99px;
	left: 0;
	padding: 30px 0;
	height: 230px;
}

.header .drop-menu .drop {
	position:absolute;
	z-index: 998;
	left: 50%;
	transform:translate(-50%, 0);
	font-size:15px;
	min-width:750px;
}

.header .drop-menu .drop > li {
	float:left;
	width: 120px;
	text-align:center;
}

.header .drop-menu .drop > li:nth-child(2) {
	width: 150px;
}

.header .drop-menu .drop > li a {
	color:#333;
	font-weight:bold;
	
}

.header .drop-menu .drop > li a:hover {
	color:#002E78
}

.header .drop-menu .sub-menu > li {
	margin-bottom: 10px;
	letter-spacing:-1px
}

.header .menu-btn {
	position:absolute;
	right: 40px;
	top: 33px;
	cursor:pointer;
}

.header .menu-btn::before {
	position:absolute;
	width: 1px;
	height: 15px;
	background-color:#fff;
	content:'';
	display:block;
	margin-left: -35px;
	margin-top: 7px;
}

.header:hover .menu-btn::before,
.header.w .menu-btn::before {
	background-color:#00183c;
}

.header .menu-btn span {
	display:block;
	width: 25px;
	height: 3px;
	margin: 5px 0;
	background-color:#fff;
}

.header .menu-btn span:nth-child(2) {
	background-color:#70c6c5 !important;
	margin-left: -5px;
	transition:all 300ms;
}

.header .menu-btn:hover span:nth-child(2) {
	background-color:#e9537c !important;
	margin-left: 0;
}

.header:hover .menu-btn span,
.header.w .menu-btn span {
	background-color:#00183c;
}

@media(max-width:1800px) {
	.header .logo {
		margin-left: 2vw;
	}
}

.menu_opens_bg {
	position:fixed;
	background-color:rgba(0, 19, 48, 0.7);
	top: 0;
	left: -100vw;
	width: 100vw;
	height: 100vh;
	z-index: 999999;
}

.menu-over {
	position:fixed;
	top: 0;
	right: -100vw;
	bottom: 0;
	width: 100vw;
	height: 100vh;
	background-color:#001330;
	z-index: 999999;
}

.menu-over .inner {
	width: 100%;
	height: 100%;
	position:relative;
}

.menu-over .close-btn {
	position:absolute;
	right: 40px;
	top: 35px;
	cursor:pointer;
}

.menu-over .left-box {
	position:absolute;
	width: calc(50vw + 60px);
	left: 0;
	top: 0;
	bottom: 0;
	height: 100vh;
	background-color:#00183c;
	
}

.menu-over .row {
	max-width:1200px;
	margin: auto;
	height: 100vh;
	position:relative;
}


.menu-over .menu-box {
	width: 50%;
	position:absolute;
	left: 0;
	top: 50%;
	transform:translateY(-50%);
	opacity: 0;
	margin-top: -20px;
}

.menu-over .menu-box > li.menu-li {
	position:relative;
	height: 75px;
	line-height:75px;
	color:#7f8694;
	border-bottom:1px solid #283c5a;
}

.menu-over .menu-box > li.menu-li:first-child {
	border-top:1px solid #283c5a;
}

.menu-over .menu-box > li.menu-li b {
	display:inline-block;
	font-size:20px;
	color:#fff;
	margin-left: 20px;
}

.menu-over .menu-box > li .sub-menu {
	position:absolute;
	right: 0;
	top: 50%;
	transform:translateY(-50%);
}

.menu-over .menu-box > li .sub-menu li {
	display:inline-block;
	margin-left: 10px;
}

.menu-over .menu-box > li .sub-menu li a {
	color:#7f8694;
}

.menu-over .menu-box > li .sub-menu li a:hover {
	color:#fff;
}

.menu-over .right-box {
	position:absolute;
	right: 0;
	top: 50%;
	transform:translateY(-50%);
	width: calc(50% - 60px);
	text-align:center;
	opacity: 0;
	margin-top: -20px;
}

.menu-over .right-box .logo {
	width: 300px;
	text-align:center;
	margin: auto;
	padding-bottom: 60px;
	margin-bottom: 40px;
	border-bottom:1px solid #283c5a;
}

.menu-over .right-box .info {
	width: 300px;
	margin: auto;
	color:#fff;
	padding: 0 40px 20px;
	border-bottom:1px solid #283c5a;
}

.menu-over .right-box .info dl {
	margin-bottom: 20px;
}

.left_wingbanner {
	position:absolute;
	min-width: 120px;
	width: 6%;
	background-color:#00183c;
	z-index: 10000;
}

.left_wingbanner li {
	position:relative;
	height: 17.5vh;
}

.left_wingbanner li::before {
	content:'';
	display:block;
	width: 80%;
	height: 1px;
	position:absolute;
	top: 0px;
	left: 10%;
	background-color:#192E4E;
}

.left_wingbanner li:first-child::before,
.left_wingbanner li:nth-child(2)::before {
	content:none;
}

.left_wingbanner li a {
	width: 100%;
	display:block;
	height: 100%;
	cursor:pointer;
	transition:all 300ms;
}

.left_wingbanner li a.on,
.left_wingbanner li a.active,
.left_wingbanner li a:hover {
	position:relative;
	min-width: 150px;
	width: 110%;
	z-index: 9;
	height: calc(100% + 1px);
}

.left_wingbanner .first {
		height: 30vh;
}

.left_wingbanner .first a {
	position:relative;
	background-color:#641741;
	background-image:url('../img/fixed_event.png');
	background-position:center;
	cursor:default;
}

.left_wingbanner .first a::after {
	content:'';
	display:block;
	width: 1px;
	height: 8vh;
	position:absolute;
	bottom: 0;
	left: 50%;
	background-color:#783b5e
}

.left_wingbanner .first a:hover,
.left_wingbanner .first a.active,
.left_wingbanner .first a.on {
	min-width:120px !important;
	width: 120px !important;
	height: 100% !important;
}



.left_wingbanner .second a {
	background-image:url('../img/indi01.png');
	background-position:center;
}

.left_wingbanner .second a.on,
.left_wingbanner .second a.active,
.left_wingbanner .second a:hover {
	background-color:#004033;
	background-image:url('../img/indi01_2_on.png');
}

.left_wingbanner .third a {
	background-image:url('../img/indi02.png');
	background-position:center;
}

.left_wingbanner .third a.on,
.left_wingbanner .third a.active,
.left_wingbanner .third a:hover {
	background-color:#441a23;
	background-image:url('../img/indi02_on.png');
}


.left_wingbanner .forth a {
	background-image:url('../img/indi03.png');
	background-position:center;
}

.left_wingbanner .forth a.on,
.left_wingbanner .forth a.active,
.left_wingbanner .forth a:hover {
	background-color:#345030;
	background-image:url('../img/indi03_on2.png');
}

.left_wingbanner .fifth a {
	background-image:url('../img/indi04.png');
	background-position:center;
}

.left_wingbanner .fifth a.on,
.left_wingbanner .fifth a.active,
.left_wingbanner .fifth a:hover {
	background-color:#663066;
	background-image:url('../img/indi04_on.png');
}




.footer {
	background-color:#001432;
	padding: 60px 0;
	text-align:center;
}

.footer .row {
	max-width:1200px;
}

.video-container {
    position: relative;
    padding-bottom: 53.5%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe, .video-container object, .video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


@media(min-width:992px) {
	.pc {
		display:block !important
	}

	.mobile {
		display:none !important
	}
}

@media(max-width:991px) {

	.pc {
		display:none !important
	}

	.mobile {
		display:block !important
	}

	

}

@media(max-width:575px) {

	a.sns {
		display: block;
		width: 50px;
		height: 50px;
		margin-right: 5px;
	}


}