/* reset */
* { margin: 0; padding:0; }
li { list-style:none; }
a { text-decoration: none !important; color:inherit; }
img { vertical-align: top; }

/* common */
html { overflow-x: hidden; }
html, body { height:100%; }
html.fix { overflow: hidden; }
.wrap { width:94%; max-width:1600px; margin:0 auto; position: relative; }
.wrap:after, ul:after, .cl:after { content:""; clear:both; display: block; }
.blind { width:0; height:0; font-size:0; overflow: hidden; }
.fl { display: flex; align-items: center; justify-content: center; }
.fl:after { display:none; }
.dn { display:none !important; }
.arr:after { content:""; width:10px; height:10px; display:inline-block; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg); margin-left:4px; }
.cpc { color:#0071bc; }
.cpb { background: #0071bc; color:#fff; }
.gr1 { width:31%; }
.gr2 { width:65.5%; }
.gsl { font-family: gsl; }
.gsm { font-family: gsm; }
.gsb { font-family: gsb; }

/* header & footer */
#w_header { position: fixed; width: 100%; z-index: 99; height: 70px; transition:0.3s; color:#fff; overflow: hidden; }
#w_header.fix { background: #0071bc; }
#w_header.down { background: #0071bc; height:270px; }
#w_header h1 { padding-top: 15px; }
#w_header h1 img { height: 40px; }
#w_header .gnb { position: absolute; left:50%; top:28px; margin-left: -296px; }
#w_header .gnb > li { float:left; margin-right: 120px; font:16px nseb; }
#w_header .gnb > li:last-child { margin-right: 0; }
#w_header .gnb ul { position: absolute; line-height:1.6; font-family: nsb; margin-top:20px; }
#w_header .lang { position: absolute; right:0; top:21px; border:2px solid #fff; border-radius: 50px; padding:4px 20px; }
#w_header .lang strong { float:left; font:14px/20px nsb;  }
#w_header .lang strong:after { content:"|"; margin:0 10px 0 12px; }
#w_header .lang select { background: none; border:none; outline: none; height: 20px; float:left; font:14px nsb; color:#fff; padding-right:10px; }
#w_header .lang select option { background: #0071bc; }

#w_footer { padding:70px 0; background: #313131; color:#aaa; }
#w_footer img { float:left; }
#w_footer address { float:right; font:13px/2 nsr; }
#w_footer address span:after { content:"|"; margin:0 10px; }
#w_footer address span:last-of-type:after { display: none; }



/* index */
.swiper-container { width: 100%; height: 100%; } 
.swiper-slide { background-position: center; background-size: cover; }
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom:40px; }
.swiper-button-prev, .swiper-container-rtl .swiper-button-next { left:60px; opacity: 0; transition: 0.3s; }
.swiper-button-next, .swiper-container-rtl .swiper-button-prev { right:60px; opacity: 0; transition: 0.3s; }
.swiper-container:hover .swiper-button-prev, .swiper-container:hover .swiper-container-rtl .swiper-button-next { opacity: 1; }
.swiper-container:hover .swiper-button-next, .swiper-container:hover .swiper-container-rtl .swiper-button-prev { opacity: 1; }

#main { height:100vh; position: relative; }
#main .ment { position: absolute; z-index: 50; left: 0; top:0; width: 100%; height: 100%; padding-top: 70px; }
#main .ment h2 { color:#fff; font-size:60px; text-transform: uppercase; line-height:1.4; position: relative; display:inline-block; }
#main .ment h2 span { position: relative; z-index:1; }
#main .ment h2:before { content:""; position: absolute; height:50px; width:100%; background: #0071bc; left:0; bottom:15px; }
#main .ment a { width: 40px; height: 40px; background: #fff; border-radius: 40px; font-size:24px; display:flex; font-weight: 900; margin-top: 70px; }
#main .ment img { position: absolute; right:0; top:0; }

#croc { padding:120px 0; }
#croc .gr1 { float:left; height: 90px; justify-content: flex-start; }
#croc .gr1 h2 { margin-left: 30px; font-weight: 900; font-size:36px; }
#croc .gr2 { float:right; height: 90px; justify-content: flex-start; font:20px/1.6 nseb; }

#c_prd ul li { float:left; width:31%; margin-right: 3.5%; margin-bottom: 30px; position: relative; border-radius: 20px; overflow: hidden; box-shadow: 2px 2px 8px rgba(0,0,0,0.1); }
#c_prd ul li > img { width: 100%; } 
#c_prd ul li a { position: absolute; left: 0; top:0; width: 100%; height: 100%; background: rgba(0,113,188,0.9); color:#fff; display:flex; align-items: center; justify-content: center; flex-direction: column; transition:0.3s; }
#c_prd ul li a:hover { background: rgba(0,113,188,0); }
#c_prd ul li a figure { height: 100px; }
#c_prd ul li a p { font:30px gsb; margin-top: 30px; }

#cj { height: 100vh; background: url(/images/bg_croc.jpg) no-repeat center/cover; margin-top: 120px; }
#cj > .fl { justify-content: space-between; }
#cj h2 { color:#fff; font-size:60px; text-transform: uppercase; line-height:1.4; position: relative; display:inline-block; padding-top: 60px; }
#cj p { color:#fff; font:20px/1.8 nseb; margin-top: 40px; }
#cj a { width: 40px; height: 40px; background: #fff; border-radius: 40px; font-size:24px; display:flex; font-weight: 900; margin-top: 70px; }

#latest { padding:150px 0; }
#latest article { float:left; width:30%; margin-right: 4%; position: relative; }
#latest article:last-child { margin-right: 0;  }
#latest article > h2 { font:30px/1 gsb; padding-bottom: 30px; border-bottom:3px solid #0071bc; }
#latest article .cpb { position: absolute; right:0; top:0; width: 30px; height: 30px; border-radius: 30px; display:flex; font-size:18px; }
#latest article ul li { border-bottom:1px solid #ddd; padding: 10px 0; white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; }
#latest article ul li a { font:16px ntr; }


#contact article { float:left; }
#contact article h2 { font-size:30px;  }
#contact article a { font-size:48px; margin-top: 20px; display: inline-block; }
#contact article strong { display: block; margin-top: 10px; font:18px nseb; }
#contact article p { position: absolute; left:0; bottom:0; font:16px/1.6 nsb; }
#contact form { float:right; }
#contact ul { border-top:3px solid #0071bc; }
#contact ul li { float:left; width:50%; border:3px solid #0071bc; box-sizing: border-box; border-top:none; }
#contact ul li:nth-child(2n) { border-left:none; }
#contact ul li:last-child { width:100%;  }
#contact ul li input, #contact ul li textarea { border:none; outline:none; width:100%; padding:20px; font:16px/1.6 nsb; }
#contact ul li input::placeholder, #contact ul li textarea::placeholder { font-family: gsb; color:#ccc;  }
#contact input[type="submit"] { font-size:16px; border:none; height:60px; width:100%; }


#bot { height: 400px; margin-top: 150px; background:url(/images/bg_bot.jpg) no-repeat center/cover; }
#bot h2 { font-size:32px; color:#fff; text-align: center; text-transform: uppercase; }


/* sub_layout */
.blank { height: 70px; background: #0071bc; }

.sv { height: 440px; }
#sub1 { background: url(/images/bg_sub1.png) no-repeat center/cover; }
#sub2 { background: url(/images/bg_sub2.png) no-repeat center/cover; }
#sub3 { background: url(/images/bg_sub3.jpg) no-repeat center/cover; }
#sub4 { background: url(/images/bg_sub4.jpg) no-repeat center/cover; }

.pad { font:16px nsr; }
.both h2.cpc { float:left; font-size:20px; }
.both .gr2 { float:right; }

/* sub1_1 */
#sub1_1 .cont1 { padding:120px 0; }
#sub1_1 .cont1 h2 { font:58px/1.4 nseb; }
#sub1_1 .cont2 p { line-height:1.8; word-break: keep-all; position: relative; }
#sub1_1 .cont2 p img { position: absolute; left:200px; bottom:6px; }
#sub1_1 .cont3 .gr2 .title { font-size:24px; color:#0071bc; border-bottom:1px solid #0071bc; width: 595px; }
#sub1_1 .cont3 .fl { margin-top: 100px; margin-bottom: 100px; }
#sub1_1 .cont3 .fl h2 { width: 158px; height: 158px; box-sizing: border-box; border:3px solid #0071bc; border-radius: 160px; display:flex; align-items: center; justify-content: center; font-size:24px; color:#0071bc; }
#sub1_1 .cont3 .fl div { width: 110px; height: 110px; display:flex; align-items: center; justify-content: center; }
#sub1_1 .cont3 .fl div:before { content:""; width:100%; border-top:3px solid #0071bc; }
#sub1_1 .cont3 { margin-top: 160px; }
#sub1_1 .cont3 .gr2 h3 { font-size:30px; padding-bottom: 30px; border-bottom:3px solid #0071bc; margin-bottom: 20px; }
#sub1_1 .cont3 .gr2 strong { font:22px nseb; }
#sub1_1 .cont3 .gr2 p { line-height:1.6; padding-bottom: 30px; border-bottom:1px solid #eee; margin-bottom: 60px; margin-top: 30px; }
#sub1_1 .cont3 .gr2 p:last-of-type { margin-bottom: 0; }
#sub1_1 .cont4 { margin-top: 120px; background: url(/images/bg_vision.png) no-repeat center/cover; height: 500px; color:#fff; font-size:30px; text-transform: uppercase; }


/* sub1_2 */
#sub1_2 .cont1 { padding:120px 0; }
#sub1_2 .cont1 h2 { font:58px/1.4 nseb; float:left; width:50%; }
#sub1_2 .cont1 p { float:left; width:50%; font:22px/1.6 nsb; }
#sub1_2 .cont2 { border-top:2px solid #0071bc; padding-top:60px; }
#sub1_2 .cont2 .history { font: 16px nseb; margin-bottom: 160px; }
#sub1_2 .cont2 .history h3 { color:#0071bc; position: absolute; }
#sub1_2 .cont2 .history p { padding-left: 260px; margin-top: 40px; position: relative; font-family: nsb; } 
#sub1_2 .cont2 .history li:first-child p { margin-top: 0; } 
#sub1_2 .cont2 .history p span  { position: absolute; left:200px; font-family: nseb; }
#sub1_2 .cont2 .history figure { margin-left: 260px; padding-top: 20px; display: none; }
#sub1_2 .cont2 .history p i { margin-left: 10px; position: relative; top:2px; cursor: pointer; }

/* sub1_3 */
#sub1_3 { padding-bottom: 200px; }
#sub1_3 .cont1 { font-size:48px; text-transform: uppercase; padding:60px 0 30px; border-bottom:2px solid #0071bc; margin-bottom: 40px;  }
#sub1_3 .gr2 { width:85%; position: relative; }
#sub1_3 .cont2 figure { box-sizing: border-box; width:45%; padding:60px 0; float:left; border:1px solid #ddd; }
#sub1_3 .cont2 article { width:52%;  float:right; }
#sub1_3 .cont2 article h3 { font:20px/1.6 nseb; word-break: keep-all; }
#sub1_3 .cont2 article p { font:16px/1.6 nsr; word-break: keep-all; margin-top: 30px; }
#sub1_3 .cont2 article ul { position: absolute; bottom:0; width: 52%; }
#sub1_3 .cont2 article ul li { width:30%; margin-right: 3%; float:left;  }
#sub1_3 .cont2 article ul li a { border-radius: 50px; background: #d2d2d2; color:#fff; font:16px nsr; display:flex; align-items: center; justify-content: center; width: 100%; height: 40px;  }
#sub1_3 .cont2 article ul li a span { font-family: nseb; margin-right: 6px; }
#sub1_3 .cont2 article ul li a i { margin-left: 10px;  }
#sub1_3 .cont2 article ul li.select a { background: #0071bc;}
#sub1_3 .cont3 h2 { margin-top: 80px; padding-top: 80px; }
#sub1_3 .cont3 .gr2 { margin-top: 80px; padding-top:80px; box-sizing: border-box; border-top:1px solid #ddd; }
#sub1_3 .cont3 ul li { float:left; width:45%; margin-right: 3%; }
#sub1_3 .cont3 ul li figure { height: 300px;  border:1px solid #ddd; box-sizing: border-box; }
#sub1_3 .cont3 ul li p { font:14px nsb; margin-top: 10px; color:#999; }
#sub1_3 .cont3 ul li div { height: 180px; }
#sub1_3 .cont3 ul li:first-child div { background: #0071bc; }
#sub1_3 .cont3 ul li:last-child div { background: #000; }
#sub1_3 .cont3 ul li strong { display: block; font:20px nseb; margin:14px 0; }
#sub1_3 .bi { margin-top: 200px; }


/* sub1_4 */
#sub1_4 { padding:120px 0; }
#sub1_4 .cont1 h2 { font:58px/1.4 nseb; float:left; }
#sub1_4 .cont1 table { width: 100%; }
#sub1_4 .cont1 table th { width: 25%; font:20px/1.6 nseb; vertical-align: top; text-align: left; padding:10px 0; }
#sub1_4 .cont1 table td { font:20px/1.6 nsr; padding:10px 0; }
#sub1_4 .cont2 { margin-top: 120px; }
#sub1_4 .cont2 iframe { width: 100%; height: 600px; }


/* sub1_5 */
#sub1_5 { padding-bottom: 200px; }
#sub1_5 .cont1 { padding:120px 0 ; }
#sub1_5 .cont1 h2 { font:58px/1.4 nseb; float:left; }
#sub1_5 .cont1 p { float:right; width:1015px; font:22px/1.6 nsb; }
#sub1_5 .cont2 { margin-top: 0px; }
#sub1_5 .cont2 .lnb { width:240px; border-top:2px solid #0071bc; float:left; }
#sub1_5 .cont2 .lnb li { border-bottom:1px solid #eee; color:#999;  }
#sub1_5 .cont2 .lnb li a { font:18px/50px nseb; }
#sub1_5 .cont2 .lnb li.cpc a { color:#0071bc; }
#sub1_5 .cont2 .gr2 { width: 1015px; border-top:2px solid #0071bc; font-size:14px;  padding-top: 20px; }





/* sub2_1 */
.sub2 .both h2.cpc, .sub3 .both h2.cpc, .sub4 .both h2.cpc  { float:left; text-transform: none; }
.sub2 .both .gr1, .sub3 .both .gr1, .sub4 .both .gr1 { width: 15%; float:left; }
.sub2 .both .gr2, .sub3 .both .gr2, .sub4 .both .gr2 { width: 82.5%; position: relative; }

#sub2_1 { padding-top:120px; }
#sub2_1 .cont1 figure { width: 40%; height:600px; border-radius: 20px; background: #eef0ee; float:left; margin-right: 3%; }
#sub2_1 .cont1 figure img { width: 90%; max-width: 368px; }
#sub2_1 .cont1 p { font:20px/1.6 nseb; width: 57%; float: left; }
#sub2_1 .cont1 table { width:57%; border-top:1px solid #a0a0a0; border-collapse: collapse; position: absolute; right:0; bottom:0;  }
#sub2_1 .cont1 table th, #sub2_1 .cont1 table td { border-bottom:1px solid #eee; padding:10px 0; }
#sub2_1 .cont1 table tr:last-child th, #sub2_1 .cont1 table tr:last-child td { border-color: #a0a0a0; }
#sub2_1 .cont1 table th { text-align: left; font:16px/1.6 nseb; vertical-align: top; width: 30%;  }
#sub2_1 .cont1 table td { font:16px/1.6 nsr; }
#sub2_1 .cont1 .video iframe { width: 82.5%; height: 800px; margin-top:200px; margin-left:17.5%; border-radius: 20px; }
#sub2_1 .cont1 .video iframe.on { opacity:1; transition: 0.7s; }
#sub2_1 .cont2 { padding:200px 0; }
#sub2_1 .cont2 ul li { float:left; width:31%; margin-right: 3.5%; margin-bottom: 30px; position: relative; border-radius: 20px; overflow: hidden; box-shadow: 2px 2px 8px rgba(0,0,0,0.1); }
#sub2_1 .cont2 ul li > img { width: 100%; } 
#sub2_1 .cont2 ul li a { position: absolute; left: 0; top:0; width: 100%; height: 100%; background: rgba(0,113,188,0.9); color:#fff; display:flex; align-items: center; justify-content: center; flex-direction: column; transition:0.3s; }
#sub2_1 .cont2 ul li a:hover { background: rgba(0,113,188,0); }
#sub2_1 .cont2 ul li a figure { height: 100px; transform: scale(0.8); }
#sub2_1 .cont2 ul li a p { font:24px gsb; margin-top: 20px; }

/* sub2_2 */
#sub2_2 { padding:120px; 0; }
#sub2_2 nav ul { border-top:1px solid #0071bc; margin-top: 10px; }
#sub2_2 nav ul li { border-bottom:1px solid #eee; padding:10px 0; }
#sub2_2 nav ul li a { color:#999; }
#sub2_2 nav ul li:first-child a { color:#333; }
#sub2_2 nav ul .select a { color:#0071bc; }
#sub2_2 h2 { font-size:48px; float:none; line-height:62px; }
#sub2_2 .gr1 h2 { visibility: hidden; }
#sub2_2 .gr2 article { margin-top: 10px; border-top:1px solid #0071bc; padding-top: 46px; }
#sub2_2 .gr2 article figure { background: #f7f7f7; padding:60px 0; }
#sub2_2 .gr2 article .box { position: relative; margin-top: 40px; }
#sub2_2 .gr2 article .box .fl { position: relative; left: 0; top:0; border-top:1px solid #0071bc; border-bottom:1px solid #0071bc; width:100%; padding:80px; }
#sub2_2 .gr2 article .box table { margin-left: auto; margin-top:50px; width: 100%; border-top:1px solid #0071bc; border-collapse: collapse; }
#sub2_2 .gr2 article .box table th, #sub2_2 .gr2 article .box table td { border-bottom:1px solid #eee; padding:10px 0; text-align: center; }
#sub2_2 .gr2 article .box table tr:first-child th:first-child, #sub2_2 .gr2 article .box table td:first-child { border-right:1px solid #eee; }
#sub2_2 .cont1 table tr:last-child th, #sub2_2 .cont1 table tr:last-child td { border-color: #a0a0a0; }

/* sub3_1 */
.sub3 .cont1 { padding:60px 0; text-transform: uppercase; font-size:48px; }
.sub3 h2 { font-family: nseb; }
.sub3 .cont2 strong { font:20px/1.6 nseb; word-break: keep-all; }
#sub3_1 .cont2 figure { background: #ededed; box-sizing: border-box; height: 380px; float:left; margin-top: 40px; border-radius: 20px; }
#sub3_1 .cont2 figure { width: 100%; }
#sub3_1 .cont2 figure img { max-width:80%; }

.sub3 .cont2 table { width: 100%; margin-top: 40px; border-collapse: collapse; }
.sub3 .cont2 table th { border-top:1px solid #0071bc; border-bottom:1px solid #a0a0a0; font:18px nseb; text-align: left; padding:10px 0; } 
.sub3 .cont2 table td { border-bottom:1px solid #ddd; font:16px nsr; padding:10px 0;  } 

.sub3 .cont3 { margin-top: 120px; margin-bottom: 200px; }
#sub3_1 dl { float:left; width:48.5%; margin-right: 3%; margin-bottom: 80px; }
#sub3_1 dl:nth-child(2n) { margin-right: 0; }
#sub3_1 dl .icon { width:100%; margin-bottom:20px; }
#sub3_1 dl dt { border-top:1px solid #0071bc; padding:10px 0; border-bottom:1px solid #ddd; font:24px nseb; }
#sub3_1 dl dd { position: relative; padding-left:14px; font:16px/1.6 nsr; margin-top: 10px; word-break: keep-all; }
#sub3_1 dl dd:before { content:"-"; position: absolute; left:0; }

/* sub3_2 */
#sub3_2 ul li { margin-bottom: 40px; }
#sub3_2 ul li:after { content:""; clear:both; display: block; }
#sub3_2 ul li figure { width: 52%; border-radius: 20px; background: #eee; padding:60px 0; float:left; }
#sub3_2 ul li figure img { max-width: 100%; }
#sub3_2 ul li div { width:45%; float:right; }
#sub3_2 ul li h3 { font:20px nseb; margin-bottom: 10px; }
#sub3_2 table th, #sub3_2 table td { text-align: center; }

#sub3_2 .cont3 ul li { font:16px/1.6 nsr; margin-bottom: 20px; position: relative; padding-left:14px;  }
#sub3_2 .cont3 ul li:before { content:"-"; position: absolute; left: 0; }

#sub3_2 .cont2 .video iframe { width: 82.5%; height: 800px; margin-top:200px; margin-left:17.5%; border-radius: 20px; }
#sub3_2 .cont2 .video iframe.on { opacity:1; transition: 0.7s; }

/* sub3_3 */
#sub3_3 .cont2 { padding-bottom: 200px; }
#sub3_3 .cont2 figure { background: #f9f9f9; padding:60px 0; border-radius: 20px;  }
#sub3_3 .cont2 th, #sub3_3 .cont2 td { text-align: center; border-right:1px solid #ddd; }
#sub3_3 .cont2 th:nth-child(6), #sub3_3 .cont2 td:last-child, #sub3_3 .cont2 th:last-child { border-right:none; }
#sub3_3 .cont2 tr:nth-child(2) th:nth-child(2n+1) { border-right:none; width:120px; }
#sub3_3 .cont2 ul { margin-top: 30px; }
#sub3_3 .cont2 ul li { position: relative; line-height:1.6; padding-left:14px; margin-bottom: 10px; }
#sub3_3 .cont2 ul li:before { content:"*"; position: absolute; left:0; }
#sub3_3 .cont3 ul { width: 1335px; }
#sub3_3 .cont3 ul li { float:left; width:235px; margin: 0 40px 40px 0; text-align: center; }
#sub3_3 .cont3 ul li p { margin-top: 10px; font:16px/1.6 nsb; }

/* notice */
.sub4 .gr2 { font-size:12px;  }
.sub4 { padding:120px 0; }
.sub4 h2 span { display: block; font:20px nseb; margin-top: 10px;  }

/* inquiry */
#sub4_4 .cont1 strong { font:26px/1.4 nseb; }
#sub4_4 .cont1 ul { margin-top: 60px; }
#sub4_4 .cont1 ul li { float:left; width:48.5%; margin-right: 3%; margin-bottom: 30px; }
#sub4_4 .cont1 ul li:nth-child(2n) { margin-right:0; }
#sub4_4 .cont1 ul li:last-child { width: 100%; }
#sub4_4 .cont1 ul li input { height:50px; background: #eee; width: 100%; border:none; padding:10px; font:18px nsb; }
#sub4_4 .cont1 ul li textarea { background: #eee; width: 100%; border:none; padding:10px; font:18px/1.6 nsb; }
#sub4_4 .cont1 ul li input::placeholder, #sub4_4 .cont1 ul li textarea::placeholder { font:14px gsb; }
#sub4_4 .cont1 input[type=submit] { width:200px; height:50px; border-radius: 10px; border:none; display: block; margin:0 auto; font-size:14px;  }