/* visual */
.main_visual { position: relative; height: 100%; overflow: hidden; background: #000; }
.main_visual .main_video #inner {  position: absolute; left: 50%; top: 50%; width: auto; height: auto; min-height: 100%; min-width: 100%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); z-index: 1; }
.main_visual .scroll_down { position: absolute; left: 50%; bottom: 30px; width: 28px; height: 40px; border-radius: 35px; margin-left: -14px; border: 2px solid #FFF; z-index: 2; }
.main_visual .scroll_down>span { position: absolute; bottom: 10px; left: 50%; margin-left: -1px; width: 3px; height: 3px; border-radius: 3px; border: 2px solid #FFF; display: inline-block; animation: mouseWheel 1.0s ease infinite; -webkit-animation: mouseWheel 1.0s ease infinite; -ms-animation: mouseWheel 1.0s ease infinite; }

.main_vide_m { display: none; }

.slider {display: block;  }
.slider .sub_visual {}
.slider .jquery-reslider .slider-block { display: block; width: 100%; height: 100%;  position: absolute;  z-index: 1; background-position: 50% 50%; background-size: cover; opacity: 0; text-align: center; }
.slider .jquery-reslider .slider-block .slider_bg { position: absolute; left:0; top: 0; width: 100%; height: 100%; background: url("../images/main/visual_m_bg.png") left top no-repeat; background-size: cover; z-index: 2; }
.slider .jquery-reslider .slider-block span { position: relative; display: block; font-size: 26px; color: #FFF; margin-top: 250px; z-index: 3; }
.slider .jquery-reslider .slider-block strong { display: block; font-size: 35px; font-weight: 600; }

@keyframes mouseWheel {
	0% { transform: translate(0,0); opacity: 1.0; }
	50% { transform: translate(0,-5px); opacity: 1.0; }
	100% { transform: translate(0,0); opacity: 1.0; }
}
/*.slider .jquery-reslider .slider-block { display: none; }*/

@media screen and (max-width: 768px) {
	.main_visual {height: 700px ; background: #fff}
	.main_video {display: none;  }
	.main_vide_m { display: block;  }
}

@media screen and (max-width: 320px) {
	.main_visual {height: 500px ; background: #fff}
}

/* content */
.main_title_group { text-align: center; position: relative; z-index: 6; }
h3.main_title { font-size: 45px; font-weight: 500; margin-bottom: 0; }
.main_title_group .s_title { font-size: 28px; font-weight: 500; margin-top: 20px; color: #5a5a5a }
.main_title_group .title_line { display: inline-block; width: 1px; height: 80px; background-color: #0160be; margin: 30px 0; }
hr.main_con { margin-top: 120px; }

@media screen and (max-width: 1023px) {
	hr.main_con { margin-top: 60px; }	
}

/* °æ¿µÁöÇ¥ */
.index_group { height: 500px; margin-top: 170px; background: url("../images/main/img01.jpg") 50% bottom no-repeat; background-size: cover; position: relative; z-index: 6; }
.index_group .inner { position: relative; width: 1200px; margin: 0 auto; }
.index01 { position: absolute; left: 60px; top: -170px; background-color: #0160be; height: 240px; width: calc(100% - 600px); text-align: center; color: #FFF; padding-top: 35px; }
.index01 span { font-size: 75px; font-weight: 600; letter-spacing: -0.7px; }
.index01 strong { font-size: 50px; letter-spacing: -4px; }
.index01 p { font-size: 26px; margin-top: 10px; font-weight: 500; letter-spacing: 0.03em; }
.index01 em {font-size: 43px; }
.index02 { position: absolute; right: 540px; top: 80px; width: 228px; height: 228px; background-color: #FFF; border: 1px solid #dcdfe0; text-align: center; color: #0160be; padding: 25px 15px 0; line-height: 1}
.index03 { position: absolute; right: 300px; top: -60px; width: 228px; height: 228px; background-color: #FFF; border: 1px solid #dcdfe0; text-align: center; color: #0ab299; padding: 55px 30px 0; line-height: 1 }
.index04 { position: absolute; right: 300px; top: 180px; width: 228px; height: 228px; background-color: #0ab299; border: 1px solid #0ab299; text-align: center; color: #FFF; padding: 25px 15px 0; line-height: 1 }
.index05 { position: absolute; right: 60px; top: 30px; width: 228px; height: 228px; background-color: #FFF; border: 1px solid #dcdfe0; text-align: center; color: #6a8092; padding: 35px 15px 0; line-height: 1  }
.index02 span, .index03 span, .index03 span, .index04 span, .index05 span { font-size: 65px; font-weight: 600; letter-spacing: -2px; }
.index02 strong, .index03 strong, .index04 strong, .index05 strong { font-size: 32px; font-weight: 600;}
.index02 strong span, .index03 strong span, .index04 strong span, .index05 strong span { font-size: 26px; font-weight: 600; letter-spacing: -2px;   }
.index02 p, .index03 p, .index04 p, .index05 p {  margin-top: 20px; line-height: 1.3}

@media screen and (max-width: 1200px) {
	.index_group .inner { width: 95%; }
	.index01 span { font-size: 60px; }
}

@media screen and (max-width: 1023px) {
	h3.main_title { font-size: 30px; font-weight: 600 }
	.main_title_group .title_line { height: 50px; margin: 20px 0; }
	.main_title_group {padding: 0 15px}
	.main_title_group .s_title {font-size: 26px;}		
	.index_group { height: auto; background-image: none; margin-top: 0; overflow: hidden; }
	.index01 { position: relative; left: 0; top: 0; height: auto; width: 100%; padding: 30px 0 45px; }
	.index01 span { font-size: 50px; letter-spacing: 0px; }
	.index01 strong { font-size: 30px; }
	.index01 p { margin-top: 5px; }
	.index02 { position: relative; right: 0; top: 0; float: left; width: 50%; height: auto; padding: 46px 0; font-size: 14px; }
	.index02 span { font-size: 45px; }
	.index03 { position: relative; right: 0; top: 0; float: right; width: calc(50% + 1px); height: auto; padding: 50px 0; margin-left: -1px; font-size: 14px; background-color: #6a8092; border: 1px solid #6a8092; color: #FFF; }
	.index03 span { font-size: 45px; }
	.index04 { position: relative; right: 0; top: 0; float: left; width: 50%; height: auto; padding: 46px 0; font-size: 14px; }
	.index04 span { font-size: 45px; }
	.index05 { position: relative; right: 0; top: 0; float: right; width: calc(50% + 1px); height: auto; padding: 36px 0; margin-left: -1px; font-size: 14px; color: #0ab299; }
	.index05 span { font-size: 45px; }
}
@media screen and (max-width: 630px) {
	.index02 p, .index03 p, .index04 p, .index05 p { margin-top: 10px; font-weight: 500}	
}
	

@media screen and (max-width: 320px) {
	.index_group .inner { width: 100%; }
	.index01 span { letter-spacing: -4px; }
}

/* °æ¿µÃ¶ÇÐ */
.philosophy_group { width: 1200px; margin: 45px auto 0; overflow: hidden; position: relative; z-index: 6;  }
.philosophy_group li { float: left; font-family:Noto Sans KR; width: 33.333%; border: 1px solid #e5e7e8; border-top: 5px solid #0160be; margin-left: -1px; padding-top: 35px; text-align: center; height: 190px }
.philosophy_group li:first-child { margin-left: 0; }
.philosophy_group li:nth-child(2) { border-top: 5px solid #0ab299; }
.philosophy_group .number { display: block; font-weight: 600; color: #0160be; }
.philosophy_group .number.green { color: #0ab299; }
.philosophy_group .txt_line { display: inline-block; background-color: #c9ccce; width: 40px; height: 1px; margin-top: 10px; }
.philosophy_group .txt { display: block; height: auto; vertical-align: middle; font-size: 22px; font-weight: 600;  color: #0160be; }
.philosophy_group p { color: #5a5a5a; padding-top: 15px }

@media screen and (max-width: 1200px) {
	.philosophy_group { width: 95%; }
}

@media screen and (max-width: 1023px) {
	.philosophy_group li { float: none; width: 100%; margin-left: 0; margin-top: -1px; padding-top: 30px; padding-bottom: 30px; border-top: 1px solid #e5e7e8; background-color: #f8f9fa; height: auto }
	.philosophy_group li:first-child { margin-top: 0; }
	.philosophy_group li:nth-child(2) { border-top: 1px solid #e5e7e8; background-color: #FFF; }
	.philosophy_group .txt { height: auto; padding: 0px 40px 0px; font-size: 22px; }
	.philosophy_group p { font-weight: 500 }
}

/* ±Û·Î¹ú ³×Æ®¿öÅ© */
.global_group { background: #e7ecf2 url("../images/main/map.jpg") center top no-repeat; height: 580px; margin-bottom: 150px; position: relative; z-index: 6; }
.global_txt_group { position: absolute; top: 385px; left: 50%; margin-left: -372px; width: 745px; border: 30px solid #0160be; padding: 70px 0; text-align: center; }
.global_tab { overflow: hidden; width: 484px; margin: 20px auto 0; }
.global_tab li { float: left; margin-left: 2px; }
.global_tab li:first-child { margin-left: 0; }
.global_tab li a { display: block; width: 160px; height: 45px; line-height: 45px; color: #FFF; font-weight: 600; background-color: #b3cfea; text-align: center; }
.global_tab li a:hover { background-color: #0160be; }
.global_tab li.on a { background-color: #0160be; }
.global_txt { margin-top: 40px; line-height: 26px; }
.global_txt strong { display: inline-block; margin: 0 10px 0 17px; font-weight: 600; color: #0160be; }
.global_txt strong:first-child { margin-left: 0; }
.global_txt#txt2,
.global_txt#txt3 { display: none; }
.position_off .position_seoul_off,
.position_off .position_boston_off,
.position_off .position_silicon_off { background: url("../images/main/map_point.png") 50% top no-repeat; background-size: 28px 27px; color: #81a1c0; font-weight: 600; width: 140px; height: 55px; padding-top: 30px; text-align: center; }
.position_seoul_off { display: none; position: absolute; left: 3px; top: -285px; }
.position_boston_off { display: inline-block; position: absolute; left: 825px; top: -205px; }
.position_silicon_off { display: inline-block; position: absolute; left: 553px; top: -182px; }
.position_on .position_seoul_on,
.position_on .position_boston_on,
.position_on .position_silicon_on { display:inline-block; background: url("../images/main/map_on.png") 50% top no-repeat; background-size: 116px 116px; width: 200px; height: 140px; font-size: 24px; color: #0160be; font-weight: 600; letter-spacing: -0.7px; padding-top: 110px; }
.position_seoul_on { position: absolute; left: -31px; top: -320px; }
.position_boston_on { position: absolute; left: 795px; top: -240px; }
.position_silicon_on { position: absolute; left: 522px; top: -217px; }
.position_action { position: absolute; left: 42px; top: 0; }
.position_action .circle { position: absolute; width: 116px; height: 116px; border: 3px solid #0160be; border-radius: 50%; }
.position_action .circle:nth-child(1) { animation: ballScale 1.6s ease-out infinite; -webkit-animation: ballScale 1.6s ease-out infinite; -ms-animation: ballScale 1.6s ease-out infinite; }
.position_action .circle:nth-child(2) { animation:ballScale 1.4s ease-out infinite; -webkit-animation: ballScale 1.4s ease-out infinite; -ms-animation: ballScale 1.4s ease-out infinite; }
.position_action .circle:nth-child(3) { animation:ballScale 1.2s ease-out infinite; -webkit-animation: ballScale 1.2s ease-out infinite; -ms-animation: ballScale 1.2s ease-out infinite; }
@keyframes ballScale {
	0% { transform: scale(0.1); opacity: 0.7; }
	100% { transform: scale(1); opacity: 0; }
}

@media screen and (max-width: 1200px) {
	.global_group { background-size: 1903px 480px; background-position: center -50px; height: 430px; margin-bottom: 165px; }
	.global_txt_group { top: 260px; padding: 45px 0; }
	.position_seoul_off { display: none; position: absolute; left: 53px; top: -230px; }
	.position_boston_off { display: inline-block; position: absolute; left: 734px; top: -175px; }
	.position_silicon_off { display: inline-block; position: absolute; left: 509px; top: -147px; }
	.position_seoul_on { position: absolute; left: 17px; top: -255px; }
	.position_boston_on { position: absolute; left: 698px; top: -195px; }
	.position_silicon_on { position: absolute; left: 475px; top: -170px; }
	.position_on .position_seoul_on,
	.position_on .position_boston_on,
	.position_on .position_silicon_on { background-size: 90px 90px; padding-top: 90px; }
	.position_action { left: 55px; top: 0; }
	.position_action .circle { width: 90px; height: 90px; }
}

@media screen and (max-width: 1023px) {
	.global_group h3.main_title { color: #FFF; }
	.global_group { background-position: left top; background-size: 714px 180px; height: 180px; margin-bottom: 290px; }
	.global_txt_group { position: relative; left: 0; top: 180px; background-color: #0160be; margin-left: 0; width: 100%; height: 290px; border: none; color: #FFF; padding: 40px 0 0; }
	.global_tab { width: 317px; }
	.global_tab li a { width: 88px; height: 40px; line-height: 40px; }
	.global_tab li a:hover { width: 88px; height: 40px; line-height: 40px; background-color: #b3cfea; }
	.global_tab li#tab3 a { width: 135px; }
	.global_tab li.on a { background-color: #FFF; color: #0160be; }
	.global_txt { margin-top: 20px; line-height: 20px; }
	.global_txt strong { color: #FFF; }
	.global_txt p { padding: 0 15px; }
	.global_txt a {color: #fff}
	.global_txt a:hover {color: #fff}
	
	.position_off .position_seoul_off,
	.position_off .position_boston_off,
	.position_off .position_silicon_off { background-size: 18px 19px; padding-top: 22px; }
	.position_seoul_off { left: 205px; top: -150px; }
	.position_boston_off { left: 460px; top: -125px; }
	.position_silicon_off { left: 380px; top: -115px; }
	.position_on .position_seoul_on,
	.position_on .position_boston_on,
	.position_on .position_silicon_on { background-size: 55px 55px; width: 100px; height: 80px; font-size: 20px; padding-top: 55px; }
	.position_seoul_on { left: 225px; top: -160px; }
	.position_boston_on { left: 480px; top: -140px; }
	.position_silicon_on { left: 395px; top: -130px; }
	.position_action { left: 22px; top: 0; }
	.position_action .circle { width: 55px; height: 55px; }
}

@media screen and (max-width: 580px) {
	.global_group { background-position: -215px top; }
	.position_seoul_off { left: -10px; top: -150px; }
	.position_boston_off { left: 245px; top: -125px; }
	.position_silicon_off { left: 163px; top: -115px; }
	.position_seoul_on { left: 12px; top: -160px; }
	.position_boston_on { left: 260px; top: -140px; }
	.position_silicon_on { left: 178px; top: -130px; }
}

@media screen and (max-width: 320px) {
	.global_group { background-position: -245px top; }
	.position_seoul_off { left: -40px; top: -150px; }
	.position_boston_off { left: 215px; top: -125px; }
	.position_silicon_off { left: 133px; top: -115px; }
	.position_seoul_on { left: -22px; top: -160px; }
	.position_boston_on { left: 230px; top: -140px; }
	.position_silicon_on { left: 148px; top: -130px; }
}