@charset "utf-8";

/* 바꿔서 사용하는 영역 s*/
    /* 폰트 cnd */
    @import url('./font_wrap.css');

    /* 폰트 스타일은 root에서 바꿔주세요 */
    :root {
        --main-black:#525355;
        --sub-black: #555555;
        --key-color: #0e417d;
        --sub-key-color: #0963cc;
        --point-color: #ff3a3a;
        --font-family: 'Noto Sans KR', sans-serif;
        --font-size: 16px;
        --font-weight: 300;
    }

    .inner { position: relative; width: 96%; margin: 0 auto; max-width: 1200px; }
    .sc { font-family: 'SCProsperSans'; transform: translateY(12%) }
/* 바꿔서 사용하는 영역 e*/


/* reset(기본셋팅 영역) s */
    * { margin: 0; padding: 0; font: inherit; color: inherit; }
    *, :after, :before { box-sizing: border-box; }

    :root {-webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -o-text-size-adjust: 100%; text-size-adjust: 100%; cursor: default; overflow-wrap: break-word; }

    html,body { height: 100%; }
    html { scroll-behavior: smooth; box-sizing: border-box; }
    body { margin: 0px auto; line-height: 1; -webkit-font-smoothing: antialiased; min-width: 360px; letter-spacing: -.5px; }

    a { text-decoration: none; }
    ol, ul { list-style: none; }

    p, li, span, input, a { line-height: 100%; }
    fieldset, iframe { border: 0; }
    select, input, textarea, button { font-size: inherit; vertical-align: middle; border-radius: 0px; }
    select { border-radius:0; /* 아이폰 사파리 보더 없애기 */ -webkit-appearance:none; /* 화살표 없애기 for chrome*/ -moz-appearance:none; /* 화살표 없애기 for firefox*/ appearance:none /* 화살표 없애기 공통*/ }
    select::-ms-expand{ display:none /* 화살표 없애기 for IE10, 11*/ }
    textarea { width: 100%; resize: none; }
    table {	border-collapse: collapse; border-spacing: 0; table-layout: fixed; }
    button { background-color: transparent; border: 0; cursor: pointer; font: inherit; line-height: inherit; vertical-align: inherit; }
    button:disabled { cursor: default; }
    strong { font-weight: bold; }
    caption, legend, .blind { overflow: hidden; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0,0,0,0); white-space: nowrap; }
    article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
    blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
    blockquote, q {	quotes: none; }
    address, em { font-style: normal; }
    pre { white-space: pre-wrap;}

    img { max-width: 100%; vertical-align: top; }
    video { vertical-align: top; }
/* reset(기본셋팅 영역) e */


/* 커스텀 셋팅 영역 s */
    body { font-weight: var(--font-weight); font-family: var(--font-family); color: var(--main-black); font-size: var(--font-size); word-break: keep-all; }
    body.noneScroll { overflow: hidden; }

    .font-family { font-family: var(--font-family); }
    a { color: var(--main-black); }

    .skew { transform: skew(-0.03deg); display: inline-block; }

    .accessibility01 { width: 100%; position: fixed; top: 0; left: -50000px; z-index: 200; background-color: #cc2634; color: #fff; padding: 24px 0; text-align: center; font-size: 18px; font-weight: 600; }
    .accessibility01:focus { left: 0; }

    .underline { text-decoration: underline; }
    .readonly, input[readonly="readonly"] { background: #f1f1f1 !important; cursor: default; }

    /* 컬러 클래스 셋팅 */
    .t-black { color: var(--main-black); }
    .t-key { color: var(--key-color); }
    .t-sub { color: var(--sub-key-color); }
    .t-point { color: var(--point-color); }

    /* 플렉스 클래스 셋팅 */
        /* 플렉스 방향 */
        .row-flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -ms-flex-direction: row; flex-direction: row; }
        .col-flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -ms-flex-direction: column; flex-direction: column; }
        /* 플렉스 줄바꿈 */
        .flex-nowrap { -webkit-box-lines: single; -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
        .flex-wrap { -webkit-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; }
        /* 플렉스 정렬(가로) */
        .flex-st { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
        .flex-end { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
        .flex-cnt { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
        .flex-spcbtn { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
        /* 플렉스 정렬(세로) */
        .aling-st { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
        .aling-end { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
        .aling-cnt {-webkit-box-align: center; -ms-flex-align: center; align-items: center; }


    #container { overflow-x: hidden; }
    .hidden { display: none; width: 0; height: 0; text-indent: -9999px; overflow: hidden; }
    .clear:after { display: block; content: ""; clear: both; height: 0; }

    .keep_all { word-break: keep-all !important; }

    .top-btn { display: block; }
    .top-btn.hide { display: none; }

    /* S: flicking */
    .touch { display:none; margin-bottom:10px; }
    .touch img { margin-right:15px; animation-name: moveIco; animation-duration: 1s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: ease-in-out; animation-fill-mode: forwards; }
    .touch.active {display: block;}
    .f_wrapper { width:100%; }
    .f_wrapper .f_wrapper_inner { overflow:auto; -webkit-overflow-scrolling: touch; overflow-y: hidden; }
    .f_scroller { display:block; height:100%; padding:0; width:100%; }
    @-webkit-keyframes moveIco {
        0% { transform: translateX(0px); }
        100% { transform: translateX(8px); }  
    }
    @keyframes moveIco {
        0% { transform: translateX(0px); }
        100% { transform: translateX(8px); }  
    }
    @media screen and (max-width:768px){
        .touch { display: block; }
    }
    /* E: flicking */

    /* S: 카카오맵 기본 설정 */
    .root_daum_roughmap { width: 100%; }
    .root_daum_roughmap .wrap_map { height:100%; }
    .root_daum_roughmap_landing { width:100%; }
    .root_daum_roughmap .wrap_controllers { display: none; }
    /* E: 카카오맵 기본 설정 */
    
/* 커스텀 셋팅 영역 e */


/* 작업 편의를 위한 정의 영역 s */
.fw3{ font-weight:300;}
.fw4{ font-weight:400;}
.fw5{ font-weight:500;}
.fw6{ font-weight:600;}
.fw7{ font-weight:700;}
.fw9{ font-weight:900;}
.bold { font-weight:400;}

.bor0 { border:none !important; }
.borBn { border-bottom: none !important; }
.borTn { border-top: none !important; }
.borLn { border-left: none !important; }
.borRn { border-right: none !important; }
.borT { border-top: 1px solid var(--main-black) !important; }
.borB { border-bottom: 1px solid var(--main-black) !important; }
.borL { border-left: 1px solid var(--main-black) !important; }
.borR { border-right: 1px solid var(--main-black) !important; }
.bg0 { background: none !important; }

.fl { float: left; }
.fr { float: right; }

.align_center { text-align: center !important; }
.align_left { text-align: left !important; }
.align_right { text-align: right !important; }

.valign_top { vertical-align: top !important; }
.valign_middle { vertical-align: middle !important; }
.valign_bottom { vertical-align: bottom !important; }

.w100 { width: 100%; }

.displayBlock { display: block; }
.displayInline { display:inline; }
.displayNone { display: none; }

.pad0 { padding: 0 !important; }
.mag0 { margin: 0 !important; }

.mal0 { margin-left:0 !important; }
.mal5 { margin-left:5px !important; }
.mal10 { margin-left:10px !important; }
.mal15 { margin-left:15px !important; }
.mal20 { margin-left:20px !important; }
.mal25 { margin-left:25px !important; }
.mal30 { margin-left:30px !important; }
.mal35 { margin-left:35px !important; }
.mal40 { margin-left:40px !important; }
.mal45 { margin-left:45px !important; }
.mal50 { margin-left:50px !important; }
.mal55 { margin-left:55px !important; }
.mal60 { margin-left:60px !important; }
.mal65 { margin-left:65px !important; }
.mal70 { margin-left:70px !important; }
.mal75 { margin-left:75px !important; }
.mal80 { margin-left:80px !important; }
.mal85 { margin-left:85px !important; }
.mal90 { margin-left:90px !important; }
.mal95 { margin-left:95px !important; }
.mal100 { margin-left:100px !important; }
.mal120 { margin-left:120px !important; }
.mal130 { margin-left:130px !important; }
.mal140 { margin-left:140px !important; }
.mal150 { margin-left:150px !important; }

.mal-5 { margin-left:-5px !important; }
.mal-10 { margin-left:-10px !important; }
.mal-15 { margin-left:-15px !important; }
.mal-20 { margin-left:-20px !important; }
.mal-25 { margin-left:-25px !important; }
.mal-30 { margin-left:-30px !important; }
.mal-35 { margin-left:-35px !important; }
.mal-40 { margin-left:-40px !important; }
.mal-45 { margin-left:-45px !important; }
.mal-50 { margin-left:-50px !important; }

.mar0 { margin-right:0 !important; }
.mar5 { margin-right:5px !important; }
.mar10 { margin-right:10px !important; }
.mar15 { margin-right:15px !important; }
.mar20 { margin-right:20px !important; }
.mar25 { margin-right:25px !important; }
.mar30 { margin-right:30px !important; }
.mar35 { margin-right:35px !important; }
.mar40 { margin-right:40px !important; }
.mar45 { margin-right:45px !important; }
.mar50 { margin-right:50px !important; }
.mar55 { margin-right:55px !important; }
.mar60 { margin-right:60px !important; }
.mar65 { margin-right:65px !important; }
.mar70 { margin-right:70px !important; }
.mar75 { margin-right:75px !important; }
.mar80 { margin-right:80px !important; }
.mar85 { margin-right:85px !important; }
.mar90 { margin-right:90px !important; }
.mar95 { margin-right:95px !important; }
.mar100 { margin-right:100px !important; }
.mar120 { margin-right:120px !important; }
.mar130 { margin-right:130px !important; }
.mar140 { margin-right:140px !important; }
.mar150 { margin-right:150px !important; }

.mab0 { margin-bottom:0 !important; }
.mab5 { margin-bottom:5px !important; }
.mab10 { margin-bottom:10px !important; }
.mab15 { margin-bottom:15px !important; }
.mab20 { margin-bottom:20px !important; }
.mab25 { margin-bottom:25px !important; }
.mab30 { margin-bottom:30px !important; }
.mab35 { margin-bottom:35px !important; }
.mab40 { margin-bottom:40px !important; }
.mab45 { margin-bottom:45px !important; }
.mab50 { margin-bottom:50px !important; }
.mab55 { margin-bottom:55px !important; }
.mab60 { margin-bottom:60px !important; }
.mab65 { margin-bottom:65px !important; }
.mab70 { margin-bottom:70px !important; }
.mab75 { margin-bottom:75px !important; }
.mab80 { margin-bottom:80px !important; }
.mab85 { margin-bottom:85px !important; }
.mab90 { margin-bottom:90px !important; }
.mab95 { margin-bottom:95px !important; }
.mab150 { margin-bottom: 150px !important; }

.mat0 { margin-top:0 !important; }
.mat3 { margin-top:3px !important; }
.mat5 { margin-top:5px !important; }
.mat10 { margin-top:10px !important; }
.mat12 { margin-top:12px !important; }
.mat15 { margin-top:15px !important; }
.mat20 { margin-top:20px !important; }
.mat25 { margin-top:25px !important; }
.mat30 { margin-top:30px !important; }
.mat35 { margin-top:35px !important; }
.mat40 { margin-top:40px !important; }
.mat45 { margin-top:45px !important; }
.mat50 { margin-top:50px !important; }
.mat55 { margin-top:55px !important; }
.mat60 { margin-top:60px !important; }
.mat65 { margin-top:65px !important; }
.mat70 { margin-top:70px !important; }
.mat75 { margin-top:75px !important; }
.mat80 { margin-top:80px !important; }
.mat85 { margin-top:85px !important; }
.mat90 { margin-top:90px !important; }
.mat95 { margin-top:95px !important; }
.mat100 { margin-top:100px !important; }
.mat110 { margin-top:110px !important; }
.mat120 { margin-top:120px !important; }
.mat130 { margin-top:130px !important; }
.mat140 { margin-top:140px !important; }
.mat150 { margin-top:150px !important; }
.mat200 { margin-top:200px !important; }

.mat-5 { margin-top:-5px !important; }
.mat-10 { margin-top:-10px !important; }
.mat-15 { margin-top:-15px !important; }
.mat-20 { margin-top:-20px !important; }
.mat-25 { margin-top:-25px !important; }
.mat-30 { margin-top:-30px !important; }
.mat-35 { margin-top:-35px !important; }
.mat-40 { margin-top:-40px !important; }
.mat-45 { margin-top:-45px !important; }
.mat-50 { margin-top:-50px !important; }

.ma0 { margin:0 !important; }
.ma5 { margin:5px !important; }
.ma10 { margin:10px !important; }
.ma15 { margin:15px !important; }
.ma20 { margin:20px !important; }
.ma25 { margin:25px !important; }
.ma30 { margin:30px !important; }
.ma35 { margin:35px !important; }
.ma40 { margin:40px !important; }
.ma45 { margin:45px !important; }
.ma50 { margin:50px !important; }

.pal0 { padding-left:0px !important; }
.pal5 { padding-left:5px !important; }
.pal10 { padding-left:10px !important; }
.pal15 { padding-left:15px !important; }
.pal20 { padding-left:20px !important; }
.pal25 { padding-left:25px !important; }
.pal30 { padding-left:30px !important; }
.pal35 { padding-left:35px !important; }
.pal40 { padding-left:40px !important; }
.pal45 { padding-left:45px !important; }
.pal50 { padding-left:50px !important; }
.pal55 { padding-left:55px !important; }
.pal60 { padding-left:60px !important; }
.pal65 { padding-left:65px !important; }
.pal70 { padding-left:70px !important; }
.pal75 { padding-left:75px !important; }
.pal80 { padding-left:80px !important; }
.pal85 { padding-left:85px !important; }
.pal90 { padding-left:90px !important; }

.par0 { padding-right:0 !important; }
.par5 { padding-right:5px !important; }
.par10 { padding-right:10px !important; }
.par15 { padding-right:15px !important; }
.par20 { padding-right:20px !important; }
.par25 { padding-right:25px !important; }
.par30 { padding-right:30px !important; }
.par35 { padding-right:35px !important; }
.par40 { padding-right:40px !important; }

.pat0 { padding-top:0px !important; }
.pat5 { padding-top:5px !important; }
.pat10 { padding-top:10px !important; }
.pat15 { padding-top:15px !important; }
.pat20 { padding-top:20px !important; }
.pat25 { padding-top:25px !important; }
.pat30 { padding-top:30px !important; }
.pat35 { padding-top:35px !important; }
.pat40 { padding-top:40px !important; }
.pat45 { padding-top:45px !important; }
.pat50 { padding-top:50px !important; }
.pat60 { padding-top:60px !important; }
.pat70 { padding-top:70px !important; }
.pat80 { padding-top:80px !important; }
.pat90 { padding-top:90px !important; }

.pab0 { padding-bottom:0 !important; }
.pab5 { padding-bottom:5px !important; }
.pab10 { padding-bottom:10px !important; }
.pab15 { padding-bottom:15px !important; }
.pab20 { padding-bottom:20px !important; }
.pab25 { padding-bottom:25px !important; }
.pab30 { padding-bottom:30px !important; }
.pab35 { padding-bottom:35px !important; }
.pab40 { padding-bottom:40px !important; }
.pab50 { padding-bottom:50px !important; }

.pa0{ padding:0 !important; }
.pa5{ padding:5px !important; }
.pa10{ padding:10px !important; }
.pa15{ padding:15px !important; }
.pa20{ padding:20px !important; }
.pa25{ padding:25px !important; }
.pa30{ padding:30px !important; }
.pa35{ padding:35px !important; }
.pa40{ padding:40px !important; }
.pa45{ padding:45px !important; }
.pa50{ padding:50px !important; }
/* 작업 편의를 위한 정의 영역 s */

/* 자동생성 사이즈용 */
.w100px {width:100px;}
.w400px {width:400px;}
.w800h250px {width:800px; min-height: 250px;}

/* 자동생성 display:none */
.dispnone{display: none;}

@media screen and (max-width:768px){
    .inner { width: 100%; padding: 0 2%; }
}
