@charset "UTF-8";

div.main-img{position:relative; width:100%; height:100vh; background:url("/fro_end/img/main_img.jpg") center 80% / cover no-repeat; z-index:1;}
div.main-img:after{content:""; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:rgba(0, 0, 0, 0.35); z-index:1;}
div.main-img div.slogan{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:630px; color:#fff; text-align:center; z-index:2;}
div.main-img div.slogan div.txt01{width:100%; height:auto; margin-bottom:10px; padding-bottom:10px; border-bottom:1px solid rgba(255, 255, 255, 0.5); font-size:40px; font-family:"GmarketSansBold"; text-shadow:2px 2px 5px rgba(0, 0, 0, 0.4);}
div.main-img div.slogan div.txt02{width:100%; height:auto; line-height:1.5; font-size:25px; font-family:"GmarketSansLight"; text-shadow:2px 2px 2px rgba(0, 0, 0, 0.4);}
div.main-img div.bot-link{position:absolute; bottom:50px; left:50%; transform:translateX(-50%); z-index:2;}
div.main-img div.bot-link a{float:left; position:relative; display:block; width:50%; height:auto; padding:35px 55px;}
div.main-img div.bot-link a:after{content:""; position:absolute; top:0; left:0; display:block; width:100%; height:100%;}
div.main-img div.bot-link a.link01{background:url("/fro_end/img/main_link01.jpg") 30% 25% / 150% auto no-repeat;}
div.main-img div.bot-link a.link01:after{background:rgba(0, 105, 183, 0.9);}
div.main-img div.bot-link a.link02{background:url("/fro_end/img/main_link02.jpg") center 60% / cover no-repeat;}
div.main-img div.bot-link a.link02:after{background:rgba(255, 151, 0, 0.9);}
div.main-img div.bot-link a > div{position:relative; z-index:2;}
div.main-img div.bot-link a > div.tit{margin-bottom:20px; font-size:30px; color:#fff; font-family:"NotoKr_B"; text-shadow:0 0 10px rgba(0, 0, 0, 0.3);}
div.main-img div.bot-link a > div.con{line-height:1.5; color:rgba(255, 255, 255, 0.7);}
div.main-img div.bot-link a > div.arrow{position:absolute; top:50%; right:55px; transform:translateY(-50%); width:60px; height:60px; border:3px solid #fff; border-radius:50%; background:url("/fro_end/img/arrow_wh.svg") center / 40% auto no-repeat; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
div.main-img div.bot-link a:hover > div.arrow{transform:translate(8px, -50%);}

header{position:absolute; top:0; left:0; width:100%; height:90px; border-bottom:1px solid rgba(255, 255, 255, 0.3); z-index:100; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
header a.logo{float:left; display:block; width:350px; height:60px; margin:15px 0; background:url("/fro_end/img/logo.png") 0 center / 100% auto no-repeat; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s; transform-origin:left}
header nav{float:right; height:100%;}
header nav div.depth2-bg{display:none; position:absolute; top:90px; left:0; width:100%; height:210px; background:#fff; box-shadow:0 10px 10px rgba(0, 0, 0, 0.2);}
header nav ul.depth1 > li{position:relative; float:left; display:inline-block; padding:0 35px;}
header nav ul.depth1 > li > a{position:relative; display:inline-block; width:auto; height:90px; line-height:90px; font-size:22px; color:#fff; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
header nav ul.depth1 > li > a:before{content:""; opacity:0; position:absolute; top:40px; left:50%; transform:translateX(-50%); display:inline-block; width:6px; height:6px; border-radius:50%; background:#0069b7; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
header nav ul.depth2{display:none; position:absolute; top:90px; left:0; width:100%; height:210px; padding:20px 0; text-align:center; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
header nav ul.depth2 > li{display:inline-block; width:100%; height:auto;}
header nav ul.depth2 > li > a{display:inline-block; width:100%; height:auto; padding:10px 0;}
header.active{background:#fff; border-bottom:1px solid #ccc;}
header.active a.logo{background:url("/fro_end/img/logo_blue.png") 0 center / 100% auto no-repeat;}
header.active nav ul.depth1 > li > a{color:#333;}
header.active nav ul.depth1 > li.active > a{font-weight:bold;}
header.active nav ul.depth1 > li.active > a:before{opacity:1; top:18px;}
header.active nav ul.depth2.active{background:#0069b7;} 
header.active nav ul.depth2.active li a{color:#fff;}
header.active nav ul.depth2.active li a:hover{font-weight:bold;}
header.scroll{position:fixed; top:0; left:0; height:80px; background-color:#0069B7; border-bottom:0;}
header.scroll a.logo{height:50px; transform:scale(0.9); background:url("/fro_end/img/logo.png") 0 center / 100% auto no-repeat;}
header.scroll nav ul.depth1 > li > a{height:80px; line-height:80px; font-size:20px; color:#fff;}
header.scroll nav ul.depth1 > li.active > a:before{background:#fff;}
header.scroll nav div.depth2-bg,
header.scroll nav ul.depth2{top:80px;}

div.main-sect > div.left{float:left; width:49.25%; padding:70px 0 50px; background:url("/fro_end/img/main_sect_bg.png") 110% -30px no-repeat;}
div.main-sect > div.right{float:right; width:49.25%; padding:70px 0 50px;}
div.main-sect > div > div{height:225px; margin-bottom:20px;}
div.main-sect > div.left div.l01{float:left; width:100%; padding-top:25px;}
div.main-sect > div.left div.l02,
div.main-sect > div.left div.l04{float:left; width:48.5%;}
div.main-sect > div.left div.l03,
div.main-sect > div.left div.l05{float:right; width:48.5%;}
div.main-sect > div.left div.l01 div.txt01{font-size:18px; color:#0069b7; font-family:"Montserrat_B";}
div.main-sect > div.left div.l01 div.txt02{margin:10px 0 30px; font-size:32px; letter-spacing:-0.8px;}
div.main-sect > div.left div.l01 div.txt03{line-height:1.5; font-size:18px; color:#aaa; letter-spacing:-0.5px;}
div.main-sect > div.left div.card{position:relative; padding:35px;}
div.main-sect > div.left div.card div.tit{font-size:24px; font-family:"NotoKr_M";}
div.main-sect > div.left div.card div.cont{margin-top:10px; font-family:"NotoKr_L"; letter-spacing:-0.5px;}
div.main-sect > div.left div.card a.more{display:inline-block; margin-top:65px; font-size:18px; color:#aaa;}
div.main-sect > div.left div.card a.more img{display:inline-block; width:20px; height:20px; margin-left:5px; vertical-align:middle; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
div.main-sect > div.left div.card a.more:hover img{transform:translateX(8px);}
div.main-sect > div.left div.l02{background:#0069b7 url("/fro_end/img/main_l02_bg.png") 105% -15px no-repeat; color:#fff;}
div.main-sect > div.left div.l02 ul{margin-top:20px;}
div.main-sect > div.left div.l02 ul li{float:left; width:50%;}
div.main-sect > div.left div.l02 ul li a{display:block; width:100%; height:50px; line-height:50px; border-top:1px solid #fff; border-right:1px solid #fff; text-align:center; color:#fff; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
div.main-sect > div.left div.l02 ul li:nth-of-type(1) a,
div.main-sect > div.left div.l02 ul li:nth-of-type(3) a{border-left:1px solid #fff;}
div.main-sect > div.left div.l02 ul li:nth-of-type(3) a,
div.main-sect > div.left div.l02 ul li:nth-of-type(4) a{border-bottom:1px solid #fff;}
div.main-sect > div.left div.l02 ul li a:hover{background:#fff; color:#0069b7;}
div.main-sect > div.left div.l03,
div.main-sect > div.left div.l04{background:#f5f5f5;}
div.main-sect > div.left div.l05{border:1px solid #ccc;}
div.main-sect > div.left div.l03:after{content:""; position:absolute; bottom:40px; right:40px; display:block; width:50px; height:50px; background:url("/fro_end/img/main_l03_icon.svg") center / cover no-repeat;}
div.main-sect > div.left div.l04:after{content:""; position:absolute; bottom:40px; right:40px; display:block; width:60px; height:60px; background:url("/fro_end/img/main_l04_icon.svg") center / cover no-repeat;}
div.main-sect > div.left div.l05:after{content:""; position:absolute; bottom:40px; right:40px; display:block; width:60px; height:60px; background:url("/fro_end/img/main_l05_icon.svg") center / cover no-repeat;}
div.main-sect > div.right div.r01{height:470px; border:1px solid #ccc; padding:50px;}
div.main-sect > div.right div.r01 div.tit{border-bottom:1px solid #ccc; padding-bottom:10px;}
div.main-sect > div.right div.r01 div.tit span{float:left; font-size:30px; font-family:"NotoKr_M";}
div.main-sect > div.right div.r01 div.tit a{float:right; display:inline-block; margin-top:15px; color:#aaa; font-size:18px; font-family:"Montserrat_R";}
div.main-sect > div.right div.r01 div.tit a img{display:inline-block; width:1.25rem; height:1.25rem; margin-left:5px; vertical-align:middle; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; transition:0.3s;}
div.main-sect > div.right div.r01 div.tit a:hover img{transform:translateX(8px);}
div.main-sect > div.right div.r01 div.cont{margin-top:25px;}
div.main-sect > div.right div.r01 div.cont ul li{display:block; padding:10px 0;}
div.main-sect > div.right div.r01 div.cont ul li a{display:block; position:relative;}
div.main-sect > div.right div.r01 div.cont ul li a:before{content:""; position:absolute; top:12px; left:0; display:inline-block; width:5px; height:5px; background:#333; border-radius:50%;}
div.main-sect > div.right div.r01 div.cont ul li a span.tit{float:left; display:inline-block; width:75%; padding-left:15px; font-size:20px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
div.main-sect > div.right div.r01 div.cont ul li a span.date{float:right; display:inline-block; width:20%; font-size:18px; text-align:right; color:#aaa; letter-spacing:-0.5px;}
div.main-sect > div.right div.r01 div.cont ul li a:hover span.tit{font-weight:bold;}
div.main-sect > div.right div.r02 > div{float:left; width:50%; height:100%;}
div.main-sect > div.right div.r02 > div.map iframe{width:100%; height:100%;}
div.main-sect > div.right div.r02 > div.contact{padding:35px; background:#00a19c url("/fro_end/img/main_l02_bg.png") 105% -15px no-repeat; color:#fff;}
div.main-sect > div.right div.r02 > div.contact div.tit{font-size:18px; font-family:"Montserrat_M";}
div.main-sect > div.right div.r02 > div.contact div.tit:after{content:""; display:block; width:45px; height:1px; background:rgba(255, 255, 255, 0.5); margin-top:15px;}
div.main-sect > div.right div.r02 > div.contact div.num{margin-top:30px; font-size:38px; font-family:"Montserrat_B"; text-shadow:0 0 8px rgba(0, 0, 0, 0.2);}
div.main-sect > div.right div.r02 > div.contact div.mail{margin-top:10px; font-size:18px; color:rgba(255, 255, 255, 0.5);}

footer{width:100%; height:auto; background:#333; text-align:center;}
footer div.inner{width:100%; height:auto; padding:30px 0;}
footer div.inner ul.link{margin-bottom:30px;}
footer div.inner ul.link li{display:inline-block;}
footer div.inner ul.link li:nth-of-type(1):after{content:""; display:inline-block; width:1px; height:12px; background:rgba(255, 255, 255, 0.3); margin:0 15px;}
footer div.inner ul.link li a{display:inline-block;}
footer div.inner ul.link li:nth-of-type(1) a{color:#ff9700; font-family:"NotoKr_M";}
footer div.inner ul.link li:nth-of-type(2) a{color:rgba(255, 255, 255, 0.5);}
footer div.inner div.add{margin-bottom:10px; color:rgba(255, 255, 255, 0.5);}
footer div.inner ul.tel{color:rgba(255, 255, 255, 0.5);}
footer div.inner ul.tel li{display:inline-block; margin:0 15px;}
footer div.copy{width:100%; height:auto; padding:15px 0; border-top:1px solid rgba(255, 255, 255, 0.15); color:rgba(255, 255, 255, 0.3); font-size:14px; font-family:"NotoKr_L";}