*,html{font-family:Roboto,'Noto Sans KR'}html{height:100%;-webkit-text-size-adjust:none}html.over-9-16{font-size:2.7778vw}html.scroll-none{overflow:hidden}.wrap{width:100%;max-width:1400px;margin:0 auto;padding:0 20px}.mobile-device .wrap,.mobile-view .wrap{padding:0 1.6rem}.mobile{display:none}@media only screen and (max-width:1024px){.desktop{display:none}.mobile{display:block}}.mobile-device .desktop{display:none!important}.mobile-device .mobile{display:block}.call-link{color:#000}.fas{display:inline-block;font-family:FontAwesome;font-style:normal;vertical-align:middle}.top-btn{position:fixed;bottom:100px;right:50px;z-index:500;width:40px;height:40px;border:0;padding:0 0 5px;border-radius:5px;font-size:16px;color:#fff;line-height:14px;text-align:center;background:#636588;cursor:pointer;transform:translateY(100%);opacity:0;transition:all .3s}.top-btn.on{transform:translateY(0);opacity:1}@media only screen and (max-width:720px){.top-btn{right:15px;bottom:50px}}#header{width:100%;height:50px;background:#fff;position:relative;z-index:1000}#header .wrap{display:flex;height:100%;justify-content:space-between;align-items:center}#header .dropdown{display:none}#header .logo{width:120px;font-size:0}#header .logo a{display:block;width:100%;height:100%;background:url(/img/xyro/top_3sz_logo@2x.png) center center no-repeat;background-size:contain}#header .logo a img{width:100%;height:100%;object-fit:contain}#header nav ul{display:flex}#header nav ul li{border-radius:.8rem;overflow:hidden}#header nav ul li a{height:2.4rem;padding:0 1.5rem;font-size:1.4rem;color:#000;font-weight:500;font-family:Roboto;display:flex;justify-content:center;align-items:center;transition:background .4s,color .3s}#header nav ul li a:hover{color:#fff;background:#5c6193}.mobile-device #header,.mobile-view #header{height:4.8rem;position:fixed;top:0;left:0;z-index:1000}.mobile-device #header .wrap,.mobile-view #header .wrap{max-width:100%;padding:0;box-shadow:0 .2rem .7rem rgba(0,0,0,.4);background:#30334c;position:relative;z-index:50;display:block}.mobile-device #header .wrap .nav-btn,.mobile-view #header .wrap .nav-btn{display:block;width:48px;height:48px;position:relative}.mobile-device #header .wrap .nav-btn img,.mobile-view #header .wrap .nav-btn img{width:1.6rem;height:1.6rem;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:opacity .3s}.mobile-device #header .wrap .nav-btn img.for-open,.mobile-device #header .wrap .nav-btn.on img.for-close,.mobile-view #header .wrap .nav-btn img.for-open,.mobile-view #header .wrap .nav-btn.on img.for-close{opacity:1}.mobile-device #header .wrap .logo img,.mobile-device #header .wrap .nav-btn.on img.for-open,.mobile-view #header .wrap .logo img,.mobile-view #header .wrap .nav-btn.on img.for-open{opacity:0}.mobile-device #header .wrap .logo,.mobile-view #header .wrap .logo{width:12.5rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mobile-device #header .dropdown,.mobile-view #header .dropdown{display:block;position:absolute;top:100%;left:0;width:100%;height:0;background:#30334c;overflow:hidden}.mobile-device #header .dropdown li,.mobile-view #header .dropdown li{width:100%}.mobile-device #header .dropdown li a,.mobile-view #header .dropdown li a{display:block;width:100%;padding:0 1.6rem;font-size:1.6rem;color:#fff;line-height:5rem;font-weight:500}.mobile-device #contents,.mobile-view #contents{padding-top:0;padding-bottom:2rem}.mobile-device #contents.search,.mobile-view #contents.search{padding-top:16rem}.mobile-device #contents:not(.main),.mobile-view #contents:not(.main){padding-bottom:4rem}@media only screen and (max-width:1024px){.mobile-device #contents.search,.mobile-view #contents.search{padding-top:8rem}.mobile-device .sitemap-exist #contents.search.guide,.mobile-view .sitemap-exist #contents.search.guide{padding-top:0}}html:not(.mobile-device) #contents,html:not(.mobile-view) #contents{padding-bottom:8rem}@media only screen and (max-width:767px){html:not(.mobile-device) #contents,html:not(.mobile-view) #contents{padding-bottom:2rem}}.cs-category{width:100%;display:flex}@media only screen and (min-width:768px){.cs-category{height:20rem}}.cs-category li{margin-right:.7rem;border-radius:1rem;border:1px solid #e8e8e8;background:#fff;box-shadow:.2rem .2rem .2rem rgba(0,0,0,.15);transition:all .5s}.cs-category li:active,html:not(.mobile-device) .cs-category li:hover,html:not(.mobile-view) .cs-category li:hover{box-shadow:none;background:#e8e8e8}.cs-category li .btn-wrap,.cs-category li a{width:100%;height:100%;padding-bottom:1.5rem;display:flex;flex-direction:column;justify-content:center;align-items:center;-webkit-tap-highlight-color:transparent;cursor:pointer}.cs-category li .btn-wrap .imgbox,.cs-category li a .imgbox{height:7rem;padding:1rem 28% 0;font-size:0;display:flex;justify-content:center;align-items:center}.cs-category li .btn-wrap .imgbox img,.cs-category li a .imgbox img{width:100%;height:100%;max-height:3.2rem;object-fit:scale-down}.cs-category li .btn-wrap .text,.cs-category li a .text{font-weight:500;font-family:'Noto Sans KR';text-align:center}.cs-category li .btn-wrap h4,.cs-category li a h4{margin-bottom:.5rem;font-size:1.4rem;color:#000;line-height:1.4rem}.cs-category li .btn-wrap p,.cs-category li a p{font-size:1.2rem;color:#919191;line-height:1.2rem}.cs-category li:last-child{margin:0}html:not(.mobile-device) .cs-category,html:not(.mobile-view) .cs-category{width:100%;display:flex}.mobile-device body.full-height #footer,.mobile-view body.full-height #footer{position:fixed;bottom:0;left:0}.search-box{width:100%;height:4.2rem;border:1px solid #e8e8e8;box-shadow:0 .3rem .4rem rgba(0,0,0,.15)}.search-box fieldset{width:100%;height:100%;background:#fff}@media only screen and (max-width:767px){.search-box fieldset{padding:0}}.search-box label{display:flex;width:100%;height:100%}.search-box label .search-btn{width:4rem;height:4rem;padding-left:1.6rem;line-height:4rem;text-align:left;font-size:0}.search-box label .search-btn img{width:1.6rem;height:1.6rem;vertical-align:middle}.search-box label input{flex:1;padding-right:1.6rem;font-size:1.4rem;color:#6c708b;font-weight:700;font-family:'Noto Sans KR';letter-spacing:-.07rem}html.mobile-device .contents.search .sv .search-box,html.mobile-view .contents.search .sv .search-box{margin-bottom:0}html:not(.mobile-device) .search-box,html:not(.mobile-view) .search-box{max-width:1000px;padding:0;margin:1.6rem auto 0;border-radius:1rem;overflow:hidden;box-shadow:0 .3rem .4rem rgba(0,0,0,.15);transition:all .4s}html:not(.mobile-device) .search-box fieldset,html:not(.mobile-view) .search-box fieldset{box-shadow:inset 0 1rem 2rem rgba(0,0,0,.05);transition:box-shadow .25s}html:not(.mobile-device) .search-box:active,html:not(.mobile-device) .search-box:focus,html:not(.mobile-device) .search-box:hover,html:not(.mobile-view) .search-box:active,html:not(.mobile-view) .search-box:focus,html:not(.mobile-view) .search-box:hover{box-shadow:0 0 .2rem rgba(0,0,0,.15)}html:not(.mobile-device) .search-box:active fieldset,html:not(.mobile-device) .search-box:focus fieldset,html:not(.mobile-device) .search-box:hover fieldset,html:not(.mobile-view) .search-box:active fieldset,html:not(.mobile-view) .search-box:focus fieldset,html:not(.mobile-view) .search-box:hover fieldset{box-shadow:inset 0 0 0 rgba(0,0,0,.05)}html:not(.mobile-device) .search-box label .search-btn,html:not(.mobile-view) .search-box label .search-btn{width:5rem;padding:0;text-align:center}@media only screen and (max-width:1024px){html:not(.mobile-device) .search-box,html:not(.mobile-view) .search-box{max-width:100%;margin:0;border-radius:0}html:not(.mobile-device) .search-box label .search-btn,html:not(.mobile-view) .search-box label .search-btn{width:4rem}}html:not(.mobile-device) .search .sv .search-box,html:not(.mobile-view) .search .sv .search-box{margin-bottom:4rem}@media only screen and (max-width:767px){html:not(.mobile-device) .search .sv .search-box:active,html:not(.mobile-device) .search .sv .search-box:focus,html:not(.mobile-device) .search .sv .search-box:hover,html:not(.mobile-view) .search .sv .search-box:active,html:not(.mobile-view) .search .sv .search-box:focus,html:not(.mobile-view) .search .sv .search-box:hover{box-shadow:0 .3rem .4rem rgba(0,0,0,.15)}html:not(.mobile-device) .search .sv .search-box:active fieldset,html:not(.mobile-device) .search .sv .search-box:focus fieldset,html:not(.mobile-device) .search .sv .search-box:hover fieldset,html:not(.mobile-view) .search .sv .search-box:active fieldset,html:not(.mobile-view) .search .sv .search-box:focus fieldset,html:not(.mobile-view) .search .sv .search-box:hover fieldset{box-shadow:none}}@media only screen and (max-width:1024px){html:not(.mobile-device) .search .sv .search-box,html:not(.mobile-view) .search .sv .search-box{max-width:100%;margin:0;border-radius:0}}