@charset "utf-8"; body.util {overflow:hidden !important; height:100% !important; } body.util #top_link {top:0;left:0;height:70px;width: 100%;} #top_link.active {z-index: 11;height:70px;width: 100%;} body.util #top_link .linkwrap ul li a, #top_link.active .linkwrap ul li a, body.util #top_link .linkwrap2 ul li > a, #top_link.active .linkwrap2 ul li > a {line-height:70px;} body.util #top_link .linkwrap ul li:after, #top_link.active .linkwrap ul li:after, body.util #top_link .linkwrap2 ul li:after, #top_link.active .linkwrap2 ul li:after {top:32px;} body.util #top_link .linkwrap2 ul li.n3, #top_link.active .linkwrap2 ul li.n3 {height:100%;} body.util #top_link .linkwrap2 ul li.lang .clickOpen_lang > button, #top_link.active .linkwrap2 ul li.lang .clickOpen_lang > button {line-height:70px;} body.util #top_link .linkwrap2 ul li.lang .clickOpen_lang > div > button, #top_link.active .linkwrap2 ul li.lang .clickOpen_lang > div > button {height:70px; line-height:70px;} #top_link.active:after, body.util #top_link:after {display:block;position:absolute;left: 0;top: 0;z-index: 999;content:'';width: 100%;height: 100%;background: #27313b;} #top_link.active .linkwrap, body.util #top_link .linkwrap, #top_link.active .linkwrap2, body.util #top_link .linkwrap2 {opacity:0;} /* 홈페이지 바로가기 */ body.util #linkbox{height:auto;min-height: 100vh;} #linkbox{display:block;position:fixed;left:0;top:70px;z-index:5000;width:100%;height:0;padding:0;background-color:#fff;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;} #linkbox .utilbox {position:relative;} #linkbox .utilbox:before {display:block;position:absolute;left:0;bottom: 0;z-index:1;content:'';width:100%;height: 50px;background: rgba(255,255,255,.6);background: linear-gradient(to top, #fff,rgba(255,255,255,.2));} #linkbox .utilbox .ico {position: absolute;top: -41px;left: 50%;z-index: 9999;width: 82px;height: 82px;border-radius: 50%;background: url(/template/A/images/obj2.png)no-repeat;box-shadow: 2px 4px 5px rgba(0,0,0,.2);-webkit-transform: translateX(-50%);transform: translateX(-50%);} #linkbox .utilbox .inner:before, #linkbox .utilbox .inner:after {display:block;position:absolute;left:0;z-index: -1;content:'';width:100%;} #linkbox .utilbox .inner:before {top:0; height:300px; } #linkbox .utilbox .inner:after {top: 110px;height:500px;} #linkbox .utilbox .inner {overflow-x: hidden;overflow-y: auto;position:relative;height: calc(100vh - 70px);} #linkbox .title {padding: 60px 0 0;text-align:center;color:#2e2e2e;font-size:18px;line-height:1.3;} #linkbox .slogan {position:absolute;left: 50px;top: 56.5px;z-index: 2;} #linkbox .slogan img {} #linkbox .main_sns {position:absolute;top: 68px;right: 50px;z-index: 2;} #linkbox .main_sns ul {} #linkbox .main_sns ul:after {display:block; clear:both; visibility:hidden; content:'';} #linkbox .main_sns ul li {float:left; margin:0 0 0 10px;} #linkbox .main_sns ul li a { display: block;background-repeat: no-repeat;background-position: center;width: 40px;height: 40px;transition: all 0.3s;border-radius: 50px; font-size:0;} #linkbox .main_sns ul li a:hover, #linkbox .main_sns ul li a:focus {outline:2px solid #000; outline-offset: -2px;} #linkbox .main_sns ul li.n1 a {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='20' fill='url(%23paint0_linear_164_18587)'/%3E%3Cpath d='M17.8421 28.1937H20.8421V20.6148H23.6195L23.9084 17.7553C23.9084 17.7553 23.9684 17.6148 23.6653 17.6148H20.8421V15.4564C20.8421 15.4564 20.7174 13.8253 22.3421 13.8253H24V11.3006C24 11.3006 23.2863 10.9848 21.5589 11.0006C21.5589 11.0006 20.0353 10.9816 18.8432 12.1216C18.8432 12.1216 17.8421 13.0185 17.8421 14.0353V17.6148H15V20.6148H17.8421V28.1937Z' fill='white'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_164_18587' x1='20' y1='0' x2='20' y2='40' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2318ADFF'/%3E%3Cstop offset='1' stop-color='%230268E2'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");} #linkbox .main_sns ul li.n2 a {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='20' fill='url(%23paint0_linear_164_18592)'/%3E%3Cpath d='M23.0876 12H15.9076C13.196 12 11 14.196 11 16.9076V24.0924C11 26.804 13.196 28.9952 15.9076 28.9952H23.0924C25.7992 28.9952 28 26.7992 28 24.0924V16.9076C28 14.196 25.804 12 23.0924 12M26.4341 24.2165C26.4341 26.0163 24.9781 27.4723 23.1783 27.4723H15.8217C14.0219 27.4723 12.5659 26.0163 12.5659 24.2165V16.8646C12.5659 15.0649 14.0219 13.6088 15.8217 13.6088H23.1735C24.9733 13.6088 26.4294 15.0649 26.4294 16.8646V24.2165H26.4341Z' fill='white'/%3E%3Cpath d='M19.4971 16.1328C17.0623 16.1328 15.0859 18.1044 15.0859 20.5439C15.0859 22.9834 17.0576 24.9551 19.4971 24.9551C21.9365 24.9551 23.9082 22.9834 23.9082 20.5439C23.9082 18.1044 21.9318 16.1328 19.4971 16.1328ZM19.4971 23.3987C17.9169 23.3987 16.6375 22.1193 16.6375 20.5392C16.6375 18.959 17.9169 17.6796 19.4971 17.6796C21.0772 17.6796 22.3566 18.959 22.3566 20.5392C22.3566 22.1193 21.0772 23.3987 19.4971 23.3987Z' fill='white'/%3E%3Cpath d='M24.0537 14.9375C23.4856 14.9375 23.0273 15.3958 23.0273 15.9639C23.0273 16.532 23.4856 16.9903 24.0537 16.9903C24.6218 16.9903 25.0801 16.532 25.0801 15.9639C25.0801 15.3958 24.6218 14.9375 24.0537 14.9375Z' fill='white'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_164_18592' x1='4.66667' y1='5.66667' x2='34.3333' y2='34.6667' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23833AB4'/%3E%3Cstop offset='0.526042' stop-color='%23FD1D1D'/%3E%3Cstop offset='1' stop-color='%23FCB045'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");} #linkbox .main_sns ul li.n3 a {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='20' fill='%2342D31A'/%3E%3Cpath d='M14.9287 18.1641C14.5865 18.1641 14.3086 18.442 14.3086 18.7842C14.3086 19.1264 14.5865 19.4044 14.9287 19.4044C15.271 19.4044 15.5489 19.1264 15.5489 18.7842C15.5489 18.442 15.271 18.1641 14.9287 18.1641Z' fill='white'/%3E%3Cpath d='M21.0503 19.4287C21.4189 19.4287 21.7178 19.1299 21.7178 18.7612C21.7178 18.3926 21.4189 18.0938 21.0503 18.0938C20.6817 18.0938 20.3828 18.3926 20.3828 18.7612C20.3828 19.1299 20.6817 19.4287 21.0503 19.4287Z' fill='white'/%3E%3Cpath d='M26.5934 11.9999H13.4078C12.0777 11.9999 11 13.0775 11 14.4076V22.2329C11 23.563 12.0777 24.6407 13.4078 24.6407H18.0655L19.6493 28.3724C19.6493 28.3724 19.7585 28.6965 20.0218 28.6965C20.2864 28.6965 20.3944 28.3724 20.3944 28.3724L21.9782 24.6407H26.5922C27.9223 24.6407 29 23.563 29 22.2329V14.4076C29 13.0775 27.9223 11.9999 26.5922 11.9999H26.5934ZM16.6553 18.9174C16.6481 20.3482 15.1687 20.3882 15.1687 20.3882C14.5971 20.3882 14.2731 20.0096 14.2731 20.0096V20.2669H13.1954V15.8251C13.1954 15.8251 13.1905 15.8239 13.1954 15.8227V15.8251C13.2621 15.836 14.2731 15.8227 14.2731 15.8227V17.5217C14.5267 17.0897 15.2585 17.097 15.2585 17.097C16.8532 17.245 16.6541 18.9174 16.6541 18.9174H16.6553ZM18.551 17.2329V20.2741H17.4964V17.2632C17.4964 16.853 16.9879 16.7402 16.9879 16.7402V15.6783C18.6723 15.7462 18.551 17.2329 18.551 17.2329ZM21.0498 20.3907C20.074 20.3907 19.2828 19.6625 19.2828 18.7632C19.2828 17.864 20.074 17.1358 21.0498 17.1358C22.0255 17.1358 22.8167 17.864 22.8167 18.7632C22.8167 19.6625 22.0255 20.3907 21.0498 20.3907ZM26.8252 20.3907C26.8252 20.3907 26.8398 21.9356 25.2706 21.9356H24.7925V20.9343H25.0801C25.0801 20.9343 25.7403 20.995 25.7318 19.978C25.7318 19.978 25.6032 20.3894 24.6772 20.3894C24.6772 20.3894 23.3653 20.2948 23.3653 19.0144V18.529C23.3653 18.529 23.3956 17.2013 24.8362 17.0958C24.8362 17.0958 25.4053 17.0351 25.7536 17.5059V17.1795H26.8228V20.3894L26.8252 20.3907Z' fill='white'/%3E%3Cpath d='M25.1517 19.4128C25.5116 19.4128 25.8034 19.121 25.8034 18.7611C25.8034 18.4012 25.5116 18.1094 25.1517 18.1094C24.7918 18.1094 24.5 18.4012 24.5 18.7611C24.5 19.121 24.7918 19.4128 25.1517 19.4128Z' fill='white'/%3E%3C/svg%3E%0A");} #linkbox .main_sns ul li.n4 a {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='20' fill='%23FF0000'/%3E%3Cg clip-path='url(%23clip0_164_18576)'%3E%3Cpath d='M28.6236 15.98C28.417 15.2007 27.8065 14.587 27.0323 14.3784C25.6291 14 20 14 20 14C20 14 14.3709 14 12.9677 14.3784C12.1935 14.587 11.583 15.2007 11.3764 15.98C11 17.3934 11 20.3409 11 20.3409C11 20.3409 11 23.2884 11.3764 24.7018C11.583 25.4811 12.1935 26.0948 12.9677 26.3034C14.3719 26.6818 20 26.6818 20 26.6818C20 26.6818 25.6291 26.6818 27.0323 26.3034C27.8065 26.0948 28.417 25.4811 28.6236 24.7018C29 23.2894 29 20.3409 29 20.3409C29 20.3409 29 17.3934 28.6236 15.98ZM18.1591 23.0174V17.6644L22.8636 20.3409L18.1591 23.0174Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_164_18576'%3E%3Crect width='18' height='12.6818' fill='white' transform='translate(11 14)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");} #linkbox .main_sns ul li.n5 a {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='20' fill='%23623616'/%3E%3Cpath d='M24.1181 13H16.8819C16.3928 13 16 13.3717 16 13.8271V20.6192C16 21.0783 16.3928 21.4463 16.8819 21.4463H20.2169C20.1938 22.2552 19.8357 23.1334 19.3196 23.9132C18.7381 24.7913 17.5019 25.7642 17.4904 25.7715C17.3941 25.8589 17.3209 25.961 17.3209 26.1031C17.3209 26.2124 17.3787 26.2962 17.4442 26.3836L19.7702 28.8505C19.7702 28.8505 19.8819 28.9634 19.9782 28.9853C20.0822 29.0072 20.2015 29.0108 20.2863 28.9525C24.3145 26.0193 24.8999 22.3427 25 20.3532C25 20.3422 25 13.8271 25 13.8271C25 13.368 24.6072 13 24.1181 13Z' fill='white'/%3E%3C/svg%3E%0A");} #linkbox .main_sns ul li.n6 a {background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='20' fill='%23FFE300'/%3E%3Cg clip-path='url(%23clip0_164_18598)'%3E%3Cpath d='M20.0008 11C15.03 11 11 14.7447 11 19.364C11 22.0931 12.4062 24.5149 14.5817 26.0416V29.7116C14.5817 29.7642 14.6105 29.8118 14.6564 29.8339C14.6768 29.844 14.6988 29.8491 14.7192 29.8491C14.7481 29.8491 14.7753 29.8406 14.799 29.8237L18.0207 27.5225C18.6575 27.655 19.3198 27.7263 19.9992 27.7263C24.97 27.7263 29 23.9816 29 19.3623C29 14.743 24.97 11 20.0008 11Z' fill='%23040000'/%3E%3Cpath d='M25.62 18.3922C25.3143 18.061 24.8626 17.8929 24.2767 17.8929C23.9523 17.8929 23.6551 17.9642 23.3953 18.1052C23.2 18.2105 23.0318 18.3361 22.8909 18.4805V15.7734H21.6172V22.9486H22.8807V20.2688C22.8807 20.0463 22.9113 19.8459 22.9707 19.671C23.0302 19.4978 23.1117 19.3483 23.2136 19.2294C23.3138 19.1105 23.4326 19.0188 23.5668 18.956C23.701 18.8932 23.8436 18.8609 23.9948 18.8609C24.2546 18.8609 24.4584 18.9322 24.5994 19.0715C24.7403 19.2107 24.8116 19.4706 24.8116 19.8442V22.9486H26.0752V19.8951C26.0752 19.2277 25.9206 18.7233 25.6166 18.3939L25.62 18.3922Z' fill='%23F1D824'/%3E%3Cpath d='M17.3155 17.2659C18.202 17.2659 18.9595 17.8399 19.2618 18.65H20.6204C20.2773 17.0842 18.9289 15.9141 17.3155 15.9141C15.444 15.9141 13.9258 17.4884 13.9258 19.4312C13.9258 21.374 15.444 22.9483 17.3155 22.9483C18.9289 22.9483 20.2773 21.7782 20.6204 20.2124H19.2618C18.9595 21.0225 18.202 21.5965 17.3155 21.5965C16.1624 21.5965 15.2284 20.6268 15.2284 19.4295C15.2284 18.2322 16.1624 17.2642 17.3155 17.2642V17.2659Z' fill='%23F1D824'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_164_18598'%3E%3Crect width='18' height='18.8508' fill='white' transform='translate(11 11)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");} #linkbox #homlink {} #linkbox #homlink .menu_wrap {margin: 45px 0 60px;text-align:center;} #linkbox #homlink .menu_wrap > li {display:inline-block;position:relative;margin:0 20px;} #linkbox #homlink .menu_wrap > li:after {display:block;position:absolute;z-index:1;top: 8px;left: -22px;content:'';width:4px;height:4px;border-radius:50%;background:#191919;} #linkbox #homlink .menu_wrap > li:first-child:after {display:none;} #linkbox #homlink .menu_wrap > li a {display:block; width:100%; height:auto;position:relative;transition:opacity 0.3s ease;z-index: 1;} #linkbox #homlink .menu_wrap > li a:hover, #linkbox #homlink .menu_wrap > li a:focus {outline:2px solid #000;} #linkbox #homlink .menu_wrap > li a:after {opacity:0;position:absolute;left: -16px;right: -18px;top:-15px;bottom:-15px;z-index:2;content:'';width:auto;height:auto;border-radius:30px;background:#0179b8;-webkit-transition:background 0.3s; transition:background 0.3s; z-index: -1;} #linkbox #homlink .menu_wrap > li a.ov:after {opacity:1;} #linkbox #homlink .menu_wrap > li a.ov {} #linkbox #homlink .menu_wrap > li span {display:block;position:relative;z-index:3;height:20px;background: url(/template/A/images/top_tit.png);font-size:0;} #linkbox #homlink .menu_wrap > li.n1 span {width:137px;background-position:0 0;} #linkbox #homlink .menu_wrap > li.n2 span {width:40px;background-position:-140px 0;} #linkbox #homlink .menu_wrap > li.n3 span {width:77px;background-position:-268px 0;} #linkbox #homlink .menu_wrap > li.n4 span {width:78px;background-position:-348px 0;} #linkbox #homlink .menu_wrap > li.n5 span {width:101px;background-position:-429px 0;} #linkbox #homlink .menu_wrap > li.n6 span {width:58px;background-position:-533px 0;} #linkbox #homlink .menu_wrap > li.n1 .ov span {background-position:0 -23px;} #linkbox #homlink .menu_wrap > li.n2 .ov span {background-position:-140px -23px;} #linkbox #homlink .menu_wrap > li.n3 .ov span {background-position:-268px -23px;} #linkbox #homlink .menu_wrap > li.n4 .ov span {background-position:-348px -23px;} #linkbox #homlink .menu_wrap > li.n5 .ov span {background-position:-429px -23px;} #linkbox #homlink .menu_wrap > li.n6 .ov span {background-position:-533px -23px;} #linkbox #homlink .con_wrap {padding: 0 0 50px;border-radius: 5px;} #linkbox #homlink .con_wrap .con {display:none;} #linkbox #homlink .con_wrap .con.ov {display:block;} #linkbox #homlink .con_wrap .con > ul {margin:0 -8px;} #linkbox #homlink .con_wrap .con > ul:after {display:block; clear:both; visibility:hidden; content:'';} #linkbox #homlink .con_wrap .con > ul > li {float:left;position: relative;width: calc(25% - 16px);height: 153px;margin:0 8px 16px;} #linkbox #homlink .con_wrap .con > ul > li a {display:block;width:100%;height:100%;padding: 50px 30px 50px 145px;border:1px solid #e3e3e3;border-radius:5px;background:#fff;-webkit-transition: all 0.3s;transition: all 0.3s;} #linkbox #homlink .con_wrap .con > ul > li a:hover, #linkbox #homlink .con_wrap .con > ul > li a:focus{border:1px solid #0179b8;;} #linkbox #homlink .con_wrap .con > ul > li .thumb {display:block;overflow:hidden;position:absolute;top:30px;left:30px;width:93px;height:93px;border-radius:50%;border: 1px solid #e3e3e3;background: #f6f6f6;} #linkbox #homlink .con_wrap .con > ul > li .thumb em {display:block;position:relative; width:100%; height:100%;} #linkbox #homlink .con_wrap .con > ul > li .thumb img {position:absolute; left:50%; top:50%; width:auto;max-width:1000%; height:100%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%);} #linkbox #homlink .con_wrap .con > ul > li .info {position:absolute; left:145px; top:50%; width:calc(100% - 175px); -webkit-transform:translateY(-50%); transform:translateY(-50%);} #linkbox #homlink .con_wrap .con > ul > li strong {display:block;font-size: 17px;font-weight:500;color:#2e2e2e;line-height: 1.2;} #linkbox #homlink .con_wrap .con > ul > li p {margin: 13px 0 0;line-height: 1.2;font-size: 15px;color:#666;} #linkbox .close, #linkbox .close2 {opacity: 1;position:absolute;right:0;z-index: 9999;top: -70px;width:70px;height:70px;background: #0d64aa;} #linkbox .close span, #linkbox .close2 span {display:block;width:100%;height:100%;font-size: 0;} #linkbox .close span:before, #linkbox .close2 span:before{position:absolute; top:50%; left:50%; width:30px; height:2px; margin:-1px 0 0 -15px; background-color:#fff; content:""; transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); -o-transform:rotate(45deg); -webkit-transform:rotate(45deg);} #linkbox .close span:after, #linkbox .close2 span:after{position:absolute; top:50%; left:50%; width:30px; height:2px; margin:-1px 0 0 -15px; background-color:#fff; content:""; transform:rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); -webkit-transform:rotate(-45deg);} @media screen and (max-width:1339px){ #linkbox #homlink .con_wrap .con > ul > li{width: calc(33.33% - 16px);} } @media screen and (max-width:1279px){ #linkbox .utilbox .ico {display:none;} } @media screen and (max-width:1023px){ #linkbox .title, #linkbox .slogan, #linkbox .main_sns {display:none;} #linkbox #homlink .menu_wrap > li {margin: 0 12px;} #linkbox #homlink .menu_wrap > li:after {left: -15px;} #linkbox #homlink .menu_wrap > li a:after {left: -20px;right: -20px;top: -10px;bottom: -10px;} } @media screen and (max-width:919px){ #linkbox #homlink .con_wrap .con > ul > li{width: calc(50% - 16px);} } @media screen and (max-width:767px){ #linkbox #homlink .menu_wrap {margin: 35px 0 50px;} } @media screen and (max-width:640px){ #linkbox #homlink .con_wrap .con > ul > li{width: calc(100% - 16px);} }