/* Scss Document */
.mquick a, .people div ul li > a, .chat a { position: absolute; display: block; left: 0; top: 0; width: 100%; height: 100%; cursor: pointer; /*background: red;*/ }

.wrap { width: 100%; min-height: 100%; max-height: 100%; height: 100%; position: relative; }

.mquick { position: fixed; right: 10px; bottom: 20px; width: 60px; height: 100px; z-index: 600; }
.mquick p { position: absolute; display: inline-block; right: 0px; bottom: 0px; width: 60px; height: 60px; border-radius: 50%; background: #dde0e5; z-index: 10; }
.mquick div { position: absolute; display: inline-block; right: 0px; bottom: 0px; width: 60px; height: 100px; border-radius: 0 0 120px 120px; -webkit-box-sizing: border-box; box-sizing: border-box; overflow: hidden; z-index: 12; }
.mquick div img { position: absolute; left: 0px; bottom: -25px; width: 60px; }
.mquick ul { position: absolute; }
.mquick ul li { opacity: 0; position: absolute; top: 40px; left: 10px; width: 52px; border-radius: 10px; background: #3c5a98; font-size: 11px; line-height: 11px; color: #fff; font-weight: normal; text-align: center; padding: 5px 2px; z-index: 15; }
.mquick ul li span { position: absolute; left: 10px; top: 18px; width: 0; height: 0; border-top: 10px solid #3c5a98; border-right: 10px solid transparent; z-index: 15; }
.mquick ul li:nth-child(2n) { background: #b85708; }
.mquick ul li:nth-child(2n) span { border-top: 10px solid #b85708; border-right: 10px solid transparent; }
.mquick a { z-index: 30; }


.mgnb { display: none; position: absolute; top: 0; right: -80%; width: 80%; height: 100%; overflow-y: scroll; background: #fff; z-index: 60; }
.mgnb h1 { height: 50px; line-height:50px;   box-sizing: border-box; background: #1f5381; }
.mgnb h1 span{ display:inline-block;  color: #fff; font-size: 12px; font-weight: normal; margin:0 0 0 10px; vertical-align:middle;  }
.mgnb h1 img { display:inline-block;  width: 45px; vertical-align:middle; normal; margin:0 0 0 20px; }
.mgnb ul { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; }
.mgnb ul li { border-bottom: 1px solid #dcdcdc; height: 58px; }
.mgnb ul li a { display: block; font-size: 18px; line-height: 58px; color: #444; margin: 0; padding: 0px 20px; -webkit-box-sizing: border-box; box-sizing: border-box; }
.mgnb .mGnbClose { display: block; position: absolute; top: 0px; right: 0; width: 55px; height: 50px; line-height: 57px; text-align: center; }
.mgnb .mGnbClose i { position: relative; display: inline-block; width: 20px; height: 20px; }
.mgnb .mGnbClose i:before, .mgnb .mGnbClose i:after { content: ''; position: absolute; top: 50%; left: 50%; width: 26px; height: 2px; background-color: #fff; }
.mgnb .mGnbClose i:before { -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }
.mgnb .mGnbClose i:after { -webkit-transform: translate(-50%, -50%) rotate(135deg); transform: translate(-50%, -50%) rotate(135deg); }
 
header { width: 100%; height: 50px; background: #1f5381; overflow: hidden; font }
header img { display: inline-block; width: 115px; margin: 15px 0 0 5%; }
header span.logotitle {  line-height:52px; color: #fff; font-size: 12px; font-weight: normal; margin:0 0 0 10px; }
header .mgnbTop { display: inline-block; position: absolute; top: 0px; right: 0; width: 50px; height: 50px; z-index: 40; }
header .mgnbTop div { position: relative; margin: 16px 0 0 0; }
header .mgnbTop div > span { display: block; width: 18px; height: 2px; margin: 0 auto 5px; background: #fff; border-radius: 5px; }
header .mgnbTop div > span:last-child { margin-bottom: 0; }
header .mgnbTop div:after { content: 'MENU'; position: absolute; right: 40px; top: 2px; color: #fff; font-size: 12px; font-weight: normal; }


#ch-plugin-core { bottom: 105px !important; display: none  !important; }

.mainVisual { position: relative; background: #333; }
.mainVisual header { position: absolute; left: 0; top: 0; width: 100%; z-index: 33; }
.mainVisual header h1 { display: block; margin: 30px 0 0; text-align: center; }
.mainVisual header h1 img { display: inline-block; width: 140px; }
.mainVisual .swiper-container ul.swiper-wrapper { height: 580px; }
.mainVisual .swiper-container ul.swiper-wrapper li.swiper-slide { width: 100% !important; height: auto; }
.mainVisual .swiper-container ul.swiper-wrapper li.swiper-slide h2 { position: absolute; left: 5%; top: 180px; font-size: 26px; line-height: 36px; color: #fff; font-weight: bold; letter-spacing: -0.5px; }
.mainVisual .swiper-container ul.swiper-wrapper li.swiper-slide h2.text01{top:145px}
.mainVisual .swiper-container ul.swiper-wrapper li.swiper-slide h3 { width: 80%; position: absolute; left: 5%; top: 232px; font-size: 16px; line-height: 26px; color: #fff; padding: 0; }
.mainVisual .swiper-container ul.swiper-wrapper li.swiper-slide img { width: 100%; height: auto; }
.mainVisual .swiper-container .swiper-pagination { width: 50%; left: 2.5%; bottom: 295px; font-size: 0; }
.mainVisual .swiper-container .swiper-pagination span { position: relative; display: inline-block; width: 34px; height: 2px; background: rgba(255, 255, 255, 0.4); margin: 0 5px 0 0; border-radius: 0; opacity: 1; }
.mainVisual .swiper-container .swiper-pagination span:last-child { margin: 0; }
.mainVisual .swiper-container .swiper-pagination span:after { content: ""; display: block; width: 0; height: 100%; }
.mainVisual .swiper-container .swiper-pagination span.swiper-pagination-bullet-active:after { width: 100%; background: #fff; border-radius: 0; -webkit-transition: width 3s linear; transition: width 3s linear; }
.mainVisual .mainlink { position: absolute; left: 5%; bottom: 40px; width: 90%; z-index: 44; }
.mainVisual .mainlink div { font-size: 0; }
.mainVisual .mainlink div a { display: inline-block; width: 49%; height: 40px; background: #5c768d; font-size: 15px; line-height: 40px; color: #fff; font-weight: bold; text-align: center; margin: 0 2% 5px 0; padding: 0; vertical-align: top; }
.mainVisual .mainlink div a:nth-child(even) { margin: 0; }
.mainVisual .mainlink div a:last-child { width: 100%; margin: 0; background: #40659e; }

.institute { width: 100%; text-align: center; }
.institute img { display: inline-block; width: 330px; margin: 30px 0; }

.system { width: 100%; }
.system div { width: 100%; height: 260px; background: url("../images/systemBg.png") left top/cover no-repeat; }
.system div h1 { width: 90%; font-size: 28px; line-height: 36px; color: #fff; font-weight: bold; margin: 0 auto; padding: 35px 0 0px 0; }
.system div h2 { width: 90%; font-size: 15px; line-height: 22px; color: #fff; margin: 0 auto; padding: 10px 0 0px 0; }
.system ul { margin: 0 auto 35px; }
.system ul > li { width: 90%; margin: 10px auto 0; border: 1px solid #DEDEDE; }
.system ul > li h3 { width: 90%; font-size: 22px; line-height: 22px; color: #516078; font-weight: bold; margin: 0 auto; padding: 25px 0 5px 0; letter-spacing: -0.5px; }
.system ul > li ol { width: 90%; margin: 0 auto 25px; }
.system ul > li ol li { font-size: 13px; line-height: 13px; color: #222; margin: 10px auto 0px; padding: 0 0 0 8px; letter-spacing: -0.25px; position: relative; }
.system ul > li ol li:after { content: ''; position: absolute; left: 0px; top: 5px; width: 2px; height: 2px; background: #bbb; }

.video { width: 100%; height: 300px; background: #423D3E url("../images/videoBg.png") left top/cover no-repeat; }
.video h1 { width: 95%; font-size: 22px; line-height: 22px; color: #fff; text-align: left; margin: 0 auto; padding: 35px 0 0px 0; }
.video .videoTitle { position: relative; border-bottom: 1px solid #fff; width: 95%; margin: 15px auto; }
.video .videoTitle h2 { font-size: 14px; line-height: 16px; color: #fff; text-align: left; margin: 0 auto; padding: 10px 0 0px 55px; }
.video .videoTitle h3 { font-size: 11px; line-height: 16px; color: #ccc; text-align: left; margin: 0 auto; padding: 5px 0 20px 55px; }
.video .videoTitle img { width: 27px; position: absolute; left: 15px; top: 15px; }
.video .swiper-container { height: 135px; }
.video .swiper-container .swiper-wrapper { margin: 0px auto; }
.video .swiper-container .swiper-wrapper .scheduleDiv li { border-bottom: 1px solid #666; width: 95%; font-size: 12px; line-height: 16px; color: #fff; text-align: left; margin: 0 auto 5px; padding: 5px 0 8px 10px; -webkit-box-sizing: border-box; box-sizing: border-box; }
.video .swiper-container .swiper-wrapper .scheduleDiv li span { font-size: 12px; line-height: 16px; color: #aaa; text-align: left; padding: 0 0 5px 0; }
.video .swiper-container .swiper-pagination { font-size: 12px; line-height: 12px; color: #fff; text-align: center; margin: 0 auto; padding: 0; }

.videoPop { position: fixed; display: none; left: 50%; top: 50%; width: 330px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 999990; }
.videoPop p.close { position: absolute; display: block; right: 0; top: -60px; width: 60px; height: 60px; background: rgba(0, 0, 0, 0.4) url("../images/close.png") 50% 50% no-repeat; cursor: pointer; }

.column { position: relative; width: 100%; height: 90px; border-bottom: 1px solid #ddd; }
.column h1 { width: 90%; font-size: 18px; line-height: 18px; color: #333; font-weight: bold; text-align: left; margin: 0 auto; padding: 25px 0 10px 0; }
.column div { width: 90%; margin: 0 auto; height: 16px; overflow: hidden; }
.column div li { font-size: 12px; line-height: 12px; color: #666; text-align: left; margin: 0 auto; padding: 0px 0 5px 0; }
.column > a { position: absolute; right: 0px; top: 0px; width: 60px; height: 90px; background: url("../images/plus02.png") 45% 50%/20px auto no-repeat; }

.example { position: relative; width: 100%; height: 90px; border-bottom: 1px solid #ddd; }
.example h1 { width: 90%; font-size: 18px; line-height: 18px; color: #333; font-weight: bold; text-align: left; margin: 0 auto; padding: 25px 0 10px 0; }
.example div { width: 90%; margin: 0 auto; height: 16px; overflow: hidden; }
.example div li { font-size: 12px; line-height: 12px; color: #666; text-align: left; margin: 0 auto; padding: 0px 0 5px 0; }
.example > a { position: absolute; right: 0px; top: 0px; width: 60px; height: 90px; background: url("../images/plus02.png") 45% 50%/20px auto no-repeat; }

.shinseung { width: 100%; background: #3a526c; text-align: center; }
.shinseung img { width: 160px; margin: 40px 0 30px 0; }
.shinseung h2 { width: 90%; font-size: 24px; line-height: 32px; color: #eee; text-align: left; margin: 0 auto; }
.shinseung h3 { width: 90%; font-size: 14px; line-height: 24px; color: #ddd; text-align: left; margin: 0 auto; padding: 10px 0 55px 0; }

.location { width: 100%; background: #f6f9fc url("../images/locationBg.png") 90px 160px/378px auto no-repeat; text-align: center; overflow: hidden; }
.location img { width: 160px; margin: 40px 0 30px 0; }
.location h1 { width: 95%; font-size: 20px; line-height: 20px; color: #546985; font-weight: bold; text-align: left; margin: 0 auto; padding: 30px 0 0 0; }
.location h2 { width: 95%; font-size: 15px; line-height: 15px; color: #546985; font-weight: normal; text-align: left; margin: 0 auto; padding: 10px 0 20px 0; }
.location ul { font-size: 0; width: 95%; margin: 0 auto 55px; text-align: left; }
.location ul li { display: inline-block; width: 32%; height: 45px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 2px solid #d5dee9; background: #fff; margin: 0 2% 5px 0; font-size: 14px; line-height: 45px; color: #546985; font-weight: bold; text-align: center; }
.location ul li:nth-child(3n) { margin: 0; }

.locationPop { position: fixed; display: none; left: 50%; top: 50%; width: 95%; padding: 0 0 30px 0; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: #fff; z-index: 60; }
.locationPop h1 { width: 90%; font-size: 22px; line-height: 22px; color: #111; font-weight: bold; text-align: left; margin: 0 auto; padding: 30px 0 10px 0; letter-spacing: -0.5px; }
.locationPop h1 span { display: inline-block; vertical-align: middle; font-size: 14px; line-height: 12px; color: #111; font-weight: normal; text-align: left; margin: 0; padding: 0 0 0 10px; }
.locationPop h2 { width: 90%; margin: 0 auto 0; }
.locationPop h2 li { font-size: 0; margin: 0 0 5px 0; }
.locationPop h2 li strong { display: inline-block; width: 15%; font-size: 12px; line-height: 20px; color: #222; font-weight: bold; text-align: left; margin: 0 auto; padding: 0px 0px 0px 0px; vertical-align: top; letter-spacing: -0.5px; }
.locationPop h2 li span { display: inline-block; width: 85%; font-size: 12px; line-height: 20px; color: #222; font-weight: normal; text-align: left; margin: 0 auto; padding: 0px 0px 0px 0px; letter-spacing: -0.5px; }
.locationPop div { width: 90%; margin: 15px auto 0; text-align: left; }
.locationPop div a { display: inline-block; width: 48%; height: 70px; vertical-align: top; text-align: center; }
.locationPop div a span { font-size: 18px; line-height: 70px; color: #fff; font-weight: normal; text-align: center; margin: 0 auto; padding: 0; }
.locationPop div a.chat { background: #166bb5 url("../images/") center 50% no-repeat; margin: 0 3% 0 0px; }
.locationPop div a.call { background: #222 url("../images/") center 50% no-repeat; }
.locationPop p.close { position: absolute; display: block; right: 0; top: -60px; width: 60px; height: 60px; background: rgba(0, 0, 0, 0.4) url("../images/close.png") 50% 50% no-repeat; cursor: pointer; }

.people { width: 100%; display: block; overflow: hidden; }
.people h1 { width: 95%; font-size: 20px; line-height: 20px; color: #222; font-weight: bold; text-align: left; margin: 0 auto; padding: 30px 0 0 0; }
.people h2 { width: 95%; font-size: 15px; line-height: 15px; color: #222; font-weight: normal; text-align: left; margin: 0 auto; padding: 10px 0 20px 0; }
.people div { overflow-x: auto; overflow-y: hidden; }
.people div ul { display: table; overflow: hidden; }
.people div ul li { position: relative; display: table-cell; }
.people div ul li p { position: relative; width: 160px; height: 220px; margin: 0 1px 0 0; background: #F2F2F2; overflow: hidden; }
.people div ul li p img { position: absolute; width: 120px; top: 10px; left: -10px; }
.people div ul li div { position: absolute; left: 0; bottom: 0; width: 160px; height: 75px; background: rgba(0, 0, 0, 0.5) url("../images/arrow.png") 130px 50%/11.5px auto no-repeat; }
.people div ul li div h3 { width: 80%; font-size: 16px; line-height: 20px; color: #fff; font-weight: bold; text-align: left; margin: 0 auto; padding: 20px 0 0 0; }
.people div ul li div h4 { width: 80%; font-size: 16px; line-height: 16px; color: #fff; font-weight: normal; text-align: left; margin: 0 auto; padding: 5px 0 20px 0; }
.people > a { display: block; width: 90%; height: 50px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid #bbb; font-size: 14px; line-height: 50px; color: #222; font-weight: normal; text-align: center; margin: 20px auto 30px; }

.mask { position: fixed; display: none; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 50; }

.allpeople { position: relative; width: 100%; height: 325px; background: #393a3a url("../images/peoplebg.png") left top/100% auto no-repeat; 
margin: 15px 0 15px 0; }
.allpeople img { position: absolute; right: 10%; bottom: 40px; width: 23px; }
.allpeople h1 { width: 85%; font-size: 18px; line-height: 18px; color: #fff; font-weight: bold; text-align: left; margin: 0 auto; padding: 190px 0 10px 0; }
.allpeople h2 { width: 85%; font-size: 15px; line-height: 25px; color: #aaa; font-weight: normal; text-align: left; margin: 0 auto; padding: 0 0 0px 0; }
.allpeople h3 { width: 85%; font-size: 13px; line-height: 20px; color: #aaa; font-weight: normal; text-align: center; margin: 18px auto 0; padding: 13px 0; border: 1px solid #666; }


.china { width: 100%; height: 615px; background: #14263B url("../images/chinaBg.png") 50% 0px/cover no-repeat; }
.china h1 { width: 90%; font-size: 20px; line-height: 20px; color: #fff; font-weight: bold; text-align: left; margin: 0 auto; padding: 30px 0 0 0; }
.china h2 { width: 90%; font-size: 15px; line-height: 15px; color: #fff; font-weight: normal; text-align: left; margin: 0 auto; padding: 10px 0 20px 0; }
.china ul { margin: 10px 0 0 0; height: 495px; background: url("../images/chinaMap.png") -60px 230px/341px auto no-repeat; }
.china ul li { width: 90%; height: 45px; background: #590e15; font-size: 15px; line-height: 45px; color: #fff; text-align: center; margin: 0 auto 5px; }
.china ul li:nth-child(even) { background: #271114; }

.catalouge { display: inline-block; width: 100%; height: 360px; background: rgba(0, 0, 0, 0.2) url("../images/catalogue.png") center 20px/426px auto no-repeat; }
.catalouge div { width: 95%; height: 160px; margin: 150px auto 0; font-size: 0; background: #fff; -webkit-box-sizing: border-box; box-sizing: border-box; }
.catalouge div a { position: relative; display: inline-block; width: 50%; height: 80px; font-size: 15px; line-height: 62px; color: #333; font-weight: bold; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; }
.catalouge div a:nth-child(1) { -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; line-height: 80px; }
.catalouge div a:nth-child(2) { -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom: 1px solid #ccc; line-height: 80px; }
.catalouge div a:nth-child(3) { -webkit-box-sizing: border-box; box-sizing: border-box; border-right: 1px solid #ccc; }
.catalouge div a:nth-child(4) { -webkit-box-sizing: border-box; box-sizing: border-box; }
.catalouge div a span { position: absolute; display: inline-block; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 22px; color: #2972b2; }
.catalouge div a > img { position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 52px; width: 10px; }

.call { width: 100%; font-size: 0; }
.call div { display: inline-block; width: 64%; margin: 45px 0 48px 0; }
.call div h1 { width: 80%; font-size: 20px; line-height: 20px; color: #333; font-weight: bold; text-align: left; margin: 0 auto; padding: 10px 0 0 0; }
.call div h2 { width: 80%; font-size: 13px; line-height: 20px; color: #333; font-weight: bold; text-align: left; margin: 0 auto; padding: 10px 0 0 0; }
.call div h3 { width: 80%; font-size: 24px; line-height: 24px; color: #333; font-weight: bold; text-align: left; margin: 0 auto; padding: 5px 0 0px 0; }
.call div h3 span { display: inline-block; width: 100%; font-size: 14px; }
.call a { display: inline-block; width: 26%; height: 110px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 2px solid #666; border-radius: 12px; vertical-align: top; font-size: 13px; line-height: 160px; color: #333; font-weight: bold; text-align: center; margin: 65px 0 0 5%; background: url("../images/call.png") center 25px/35.5px auto no-repeat; }

.chat { position: relative; width: 100%; height: 220px; background-image: -webkit-gradient(linear, left top, left bottom, from(#5775c7), to(#9e2782)); background-image: linear-gradient(#5775c7, #9e2782); overflow: hidden; }
.chat h1 { width: 90%; font-size: 20px; line-height: 20px; color: #fff; font-weight: bold; text-align: left; margin: 0 auto; padding: 30px 0 10px 0; }
.chat h2 { width: 90%; font-size: 18px; line-height: 20px; color: #fff; font-weight: 200; text-align: left; margin: 0 auto; padding: 0; }
.chat h3 { width: 90%; font-size: 14px; line-height: 14px; color: #f2d1ef; text-align: left; margin: 0 auto; padding: 11px 0 20px 0; }
.chat h4 { display: inline-block; height: 45px; border-radius: 23px; -webkit-box-sizing: border-box; box-sizing: border-box; border: 2px solid #fff; font-size: 18px; line-height: 45px; color: #fff; font-weight: bold; text-align: left; margin: 0 0 0 5%; padding: 0 63px 0 32px; background: url("../images/arrow.png") 160px 50%/11px auto no-repeat; }
.chat span.chat01 { position: absolute; left: 253px; top: 162px; }
.chat span.chat01 img { width: 73px; }
.chat span.chat02 { position: absolute; left: 282px; top: 124px; }
.chat span.chat02 img { width: 92px; }
.chat span.chat03 { position: absolute; left: 269px; top: 15px; }
.chat span.chat03 img { width: 73px; }

footer ul { width: 90%; margin: 30px auto 60px; font-size: 0; }
footer ul li { display: inline-block; width: 50%; font-size: 11px; line-height: 17px; color: #777; text-align: left; margin: 0 0 4px 0; padding: 0; }
footer ul li:nth-child(6) { width: 100%; }
footer ul li:nth-child(7) { width: 100%; }

.subpeopleTitle { width: 100%; height: 180px; background: url("../images/subpeople.png") center top/cover no-repeat; }
.subpeopleTitle h1 { font-size: 20px; line-height: 30px; color: #fff; font-weight: bold; text-align: center; margin: 0 auto; padding: 60px 0 0 0; }
.subpeopleTitle h2 { font-size: 13px; line-height: 22px; color: #fff; font-weight: normal; text-align: center; margin: 0 auto; padding: 5px 0 20px 0; }
.subpeopleTitle ul { width: 100%; overflow: hidden; }
.subpeopleTitle ul li img { width: 100px; }

.subpeopleCon { width: 100%; }
.subpeopleCon ul { width: 100%; }
.subpeopleCon ul > li { position: relative; overflow: hidden; border-bottom: 1px solid #ddd; }
.subpeopleCon ul > li img { width: 125px; margin: 20px 0 0 -10px; }
.subpeopleCon ul > li dl { position: absolute; left: 40%; top: 40px; display: inline-block; width: 100%; }
.subpeopleCon ul > li dl dt { font-size: 18px; line-height: 18px; color: #333; font-weight: normal; text-align: left; margin: 0 auto; padding: 15px 0 20px 0; }
.subpeopleCon ul > li dl dt span { font-size: 20px; line-height: 20px; color: #333; font-weight: bold; text-align: left; margin: 0 auto; padding: 0 0 0 6px; }
.subpeopleCon ul > li dl > li { font-size: 11px; line-height: 16px; color: #555; font-weight: normal; text-align: left; margin: 0 auto; padding: 0 0 8px 0; letter-spacing: -1px; }
