@charset "utf-8";

/***************************************************************************
  # comment :webfont
****************************************************************************/

/* NotoSansKR */
@font-face{
    font-family:'NotoSans';
    src: local('NotoSans'),
        url('../fonts/NotoSans-Bold.woff2') format('woff2'),
        url('../fonts/NotoSans-Bold.woff') format('woff');
        
    font-weight:900;
    font-style:normal;
    font-display:swap;
}
@font-face{
    font-family: "NotoSans";
    src: local('NotoSans'),
        url('../fonts/NotoSans-Medium.woff2') format('woff2'),
        url('../fonts/NotoSans-Medium.woff') format('woff');
    font-weight:500;
    font-style:normal;
    font-display:swap;
}
@font-face{
    font-family: "NotoSans";
    src: local('NotoSans'),
        url('../fonts/NotoSans-Regular.woff2') format('woff2'),
        url('../fonts/NotoSans-Regular.woff') format('woff');
    font-weight:400;
    font-style:normal;
    font-display:swap;
}
@font-face{
    font-family: "NotoSans";
    src: local('NotoSans'),
        url('../fonts/NotoSans-DemiLight.woff2') format('woff2'),
        url('../fonts/NotoSans-DemiLight.woff') format('woff');
    font-weight:300;
    font-style:normal;
    font-display:swap;
}


/***************************************************************************
   # comment :reset
****************************************************************************/
html, body, div, span, object, iframe,
article, aside, canvas, footer, header, menu, nav, section, summary, main,
h1, h2, h3, h4, h5, h6, p, form, fieldset, legend, input, label, button, textarea, select, textarea, input,
table, caption, tbody, tfoot, thead, tr, th, td, b, i, dl, dt, dd, ol, ul, li,
address, code, em, img, strong, sub, sup, audio, video, a {margin:0;padding:0;-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-webkit-touch-callout:none; -webkit-appearance:none;appearance:none;-ms-appearance:none;-moz-appearance:none;resize:none;outline:0;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-webkit-touch-callout:none;}
*, *:before, *:after {box-sizing:border-box;word-break:keep-all;word-wrap:break-word;}
html, body {width:100%;height:100%;}
html {font-size:62.5%;-ms-touch-action:none;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;-mos-text-size-adjust:none;}
body {font-size:1.6rem;font-family:'NotoSans', Arial, sans-serif;font-weight:300;color:#000;background:#fff;}
header,footer,section,main,article,aside,nav {display:block;} /* html5 태그 초기 설정 값 */
h1,h2,h3,h4,h5,h6,input,select,textarea,button,option {font-size:100%;}
h1, h2, h3, h4, h5, h6 {font-weight:normal;}
code {font-family:inherit;}
fieldset, iframe {border:0 none;}
mark {background:none;}
ol, ul, li{list-style:none;}
img, fieldset, iframe {border:0 none;}
img, video, audio, object, embed, iframe {max-width:100%;height:auto;}
legend, hr, caption {overflow:hidden;height:0;line-height:0;}
legend, hr {overflow:hidden;position:absolute;}
hr {border:none;}
i, em, address {font-style:normal;}
.mb caption {width:0;}
input,select,textarea,button,label,strong,a,time {vertical-align:inherit;} /* inline or inline-block */
input,select,textarea,button,option {font-family:inherit;font-weight:inherit;} /* form 요소 리셋*/
input, select, textarea {border:.1rem solid #dedede;color:#767676;border-radius:0;-webkit-appearance:none;}
label, button {cursor:pointer;}
button {cursor:pointer;padding:0;background:none;border:0 none;}
textarea {border:1px solid #dadada;resize:vertical;}
input[type="radio"], input[type="checkbox"], input[type="number"] {border:0 none;vertical-align:middle;}
input[type="number"] {-moz-appearace:textfield;}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {-webkit-appearance:none;}
select {-webkit-appearance:none;-moz-appearance:none;appearance:none;}
select::selection, select:focus::-ms-value {background-color:transparent;color:#525252;}
input::-ms-clear, select::-ms-expand {display:none;}

table {width:100%;empty-cells:show;border-collapse:separate;border-spacing:0;table-layout:fixed;}
table th {font-weight:normal;}
table td {word-break:break-all;}

a,a:link,a:visited,a:active {/* color:inherit; */text-decoration:none;}
a:focus {color:inherit;}

/***************************************************************************
  element default
****************************************************************************/
/* 히든컨텐츠1 */
.blind { overflow:hidden;display:inline-block;position:relative;width:.1rem;height:.1rem;clip:rect(.1rem, .1rem, .1rem, .1rem);clip-path:inset(50%);border:0;z-index:-1;}
.lock-scroll {overflow:hidden;height:100%;}
/* 줄바꿈설정 */
.pc br.m {display:none;}
.mb br.w {display:none;}
/* fade 공통 */
*[data-animation="on"] {opacity:0;-webkit-transform:translateY(3.0rem);transform:translateY(3.0rem);-webkit-transition:all 0.8s;transition:all 0.8s;}
.on[data-animation="on"] {opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}

/* btn  */
a[class*="btn-default"],button[class*="btn-default"],input[type="button"][class*="btn-default"] {display:inline-block;padding:.2rem 1.6rem .1rem;min-width:9rem;height:4.4rem;line-height:4rem;vertical-align:middle;text-align:center;border-radius:0.4rem;color:#fff;background-color:#3b77ff;}
.btn-default02, a.btn-default02 {color:#3b77ff;border:.1rem solid #3b77ff;background-color:#fff;}
/* 플로팅메뉴 */
.btn-floating {display:inline-block;position:fixed;right:2.4rem;bottom:4.6rem;padding:1.1rem 1rem 0;width:5.6rem;height:5.6rem;font-size:1.4rem;line-height:120%;word-break:break-all;text-align:center;color:#fff;background:#3b77ff;border-radius:50%;-webkit-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.2);box-shadow:2px 2px 4px rgba(0, 0, 0, 0.2);z-index:900;}
.btn-floating:focus, .btn-floating:hover, .btn-floating:link,.btn-floating:visited,.btn-floating:active {color:#fff;}

/* 상단 바로가기 */
.btn-go-top {display:inline-block;position:fixed;right:2.4rem;bottom:11.2rem;width:5.6rem;height:5.6rem;border-radius:50%;-webkit-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.2); box-shadow:2px 2px 4px rgba(0, 0, 0, 0.2);background:#fff; z-index:900;}
.btn-go-top:before {content:'';display:inline-block;width:2.5rem;height:2.5rem;vertical-align:middle;background:#fff url(../images/com/ico_merge_75.png) no-repeat 0 0;background-size:10rem;}

/* skipnavigation */
.skip-navi a{overflow:hidden;display:block;position:fixed;left:0;right:0;top:0;line-height:11.0rem;color:#fff;background:#3b77ff;font-weight:bold;text-align:center;z-index:-1;opacity:0;}
.skip-navi a:active, .skip-navi a:focus {z-index:999;opacity:50;}
.mb .skip-navi {display:none;}

/* default
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0;}
body,input,textarea,select,button,table,a{font-size:16px;font-family:'NotoSansCJKkr', Arial, sans-serif;color:#666;line-height:1.5;font-weight:normal;word-break:keep-all;}
img,fieldset{border:0;}
img{vertical-align:top;}
ul,ol,li{list-style:none;}
table{table-layout:fixed;width:100%;border-collapse:collapse;word-wrap:break-word;}
table td {word-break: break-all;}
em,address{font-style:normal;}
a{color:inherit;text-decoration:none;}
a:active,a:focus,a:hover{}
a:focus{outline:1px dashed #bbb;}
hr {height:1px;border:0;background:#eee;}
legend,caption,.blind{overflow:hidden;position:absolute;left:-9999px;top:-9999px;z-index:-1;}
button:focus{outline:1px dashed #000;}
textarea{resize:none;}
input[type=text]::-ms-clear,
input[type=number]::-ms-clear{display:none;}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{-webkit-appearance: none;}

.skip-navi a {overflow:hidden;clip:rect(0,0,0,0);position:absolute;width:1px;height:1px;margin:-1px;border:0;padding:0;background:#1976d2;font-size:17px;color:#fff;text-align:center;}
.skip-navi a:focus {clip:auto;width:100%;height:auto;margin:0;padding:10px;}*/
.left {text-align:left !important;}
.center {text-align:center !important;}
.right {text-align:right !important;}
.float-right {float:right;}
.float-left {float:left;}
.warning {color:#ff0000;}
.lock-scroll {overflow:hidden !important;height:100% !important;}
.top-button {display:inline-block;position:fixed;right:30px;bottom:50px;z-index:-1;width:56px;height:56px;text-align:center;background:#196af3 url(../images/com/btn_top.png)no-repeat center;color:#fff;border-radius:50%;line-height:3.8;opacity:0;transition:opacity .4s 0s ease;font-size: 0;-webkit-box-shadow: 5px 5px 9px 0 rgba(0,0,0,.16);box-shadow: 5px 5px 9px 0 rgba(0,0,0,.16);}
.top-button.active {opacity:1;z-index: 100;}
@media (max-width: 1400px) {
    .top-button{bottom:190px;}
}
.tooltip {display:inline-block;position:relative;line-height:1;vertical-align:top;line-height:0;z-index:1;}
.tooltip .tooltip-button {display:inline-block;width:18px;height:18px;background:#fff;border:1px solid #196af3;border-radius:50%;font-size:12px;color:#196af3;font-weight:500;line-height:1.4;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;transition:all .2s 0s ease;}
.tooltip .tooltip-layer {display:none;position:absolute;left:30px;top:0;z-index:-1;width:360px;padding:20px 50px 20px 25px;border-radius:10px;background:#6d6f82;font-size:16px;font-weight:400;color:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;}
.tooltip .tooltip-layer:before {content:'';display:inline-block;position:absolute;left:-7px;top:50%;z-index:0;width:0;height:0;margin-top:-7px;border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:8px solid #6d6f82;}
.tooltip .tooltip-layer,.tooltip .tooltip-layer li {line-height:1.2;}
.tooltip.active .tooltip-button {background:#196af3;color:#fff;}
.tooltip.active .tooltip-layer {display:block;z-index:10;}
.tooltip-close-button {display:none;position:absolute;right:25px;top:50%;z-index:0;width:12px;height:12px;margin-top:-6px;font-size:0;}
.tooltip-close-button:before,
.tooltip-close-button:after{content:'';display:inline-block;position:absolute;left:0;top:0;width:15px;height:2px;background:#fff;}
.tooltip-close-button:before{left:1px;transform:rotate(45deg);transform-origin:0 0;}
.tooltip-close-button:after{top:10px;transform:rotate(-45deg);transform-origin:0 0;}
.attach-file .tooltip .tooltip-layer{width:410px;}
.fc-blue{font-size:inherit;color:#196af3;font-weight:400;}
.fc-red{color:#ff0000 !important;}
.count{margin:0 0 16px;font-size:16px;color:#999;font-weight:400;line-height:1;text-align: left;}
.count span,.count b{margin-left:4px;font-size:inherit;color:#000;font-weight:inherit;line-height:1;}
.hidden-desktop{display:none !important;}
.img-box {border:1px solid #ddd;}
.status-button2 {display:inline-block;height:48px;padding:0 18px;border-radius:3px;border:1px solid #196af3;color:#196af3;font-size:16px;line-height:45px;-webkit-box-sizing: border-box;box-sizing: border-box;}
.status-button2 + .desc {margin-top:10px;}
.status-button2 + .desc +.desc {margin-top:0px;}
.middle {vertical-align: middle !important;}

/* title 안에 tooltip  */
.title .tooltip .tooltip-button{width: 24px;height: 24px;font-size: 14px;transform: translate3d(0px, 10px, 0px);background: #196af3;color: #fff;line-height: 22px;}
.title .tooltip.active .tooltip-layer{margin-top: 0 !important;left: 35px;text-align: left;width: 460px;}
.title .tooltip.active .tooltip-layer li{font-size: 14px;font-weight: 300;line-height: 1.4;}
.title .tooltip .tooltip-layer:before{top: 22px;}
.title .tooltip-close-button{top: 30px;}

/* 리스트 태그 */
.list-tag{display:inline-block;min-width:25px;height:27px;background:#595a6c;border-radius:25px;border-bottom-left-radius:0;padding:3px 15px;line-height:21px;font-size:14px;color:#fff;font-weight:400;text-align:center;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;}
.list-tag.transparent{border:1px solid #6d7178;background:transparent;color:#fff;}
.list-tag.type2{border:1px solid #ddd;background:#f5f5f5;color:#666;}
.list-tag2{display:inline-block;min-width:25px;height:27px;border:1px solid rgba(255,255,255, .4);border-radius:25px;padding:3px 15px;font-size:14px;color:#fff;font-weight:400;line-height:21px;text-align:center;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;}

/* form */
.input{display:inline-block;height:48px;}
.input input{width:100%;height:48px;padding:9px 15px;background:#fff;border:1px solid #dfdfdf;border-radius:2px;outline:0;font-size:16px;color:#000;line-height:1;-webkit-box-sizing:border-box;box-sizing:border-box;}
.input.datepicker{padding:0;}
.input input::placeholder{font-size:16px;color:#ccc;font-weight:400;}
.input input:-ms-input-placeholder{font-size:16px;color:#ccc;font-weight:400;}
input:disabled,input[readonly]{background:#f5f5f5;color:#ccc;}
input[readonly],input[readonly]:hover,input[readonly]:focus{border:1px solid #dfdfdf;}
/* .input input[type="password"]{text-align:center;} */
.input input[type="password"]::placeholder{text-align:left;}
.input input[type="password"]:-ms-input-placeholder{text-align:left;}
.textarea{display:block;width:100%;line-height:1;-webkit-box-sizing:border-box;box-sizing:border-box;}
.textarea textarea{width:100%;height:100%;padding:0px;padding:15px;border:1px solid #dfdfdf;border-radius:3px;outline:0;font-size:16px;color:#000;font-weight:400;    -webkit-box-sizing:border-box;box-sizing:border-box;}
.textarea textarea::placeholder{font-size:16px;color:#ccc;font-weight:400;}
.textarea textarea:-ms-input-placeholder{font-size:16px;color:#ccc;font-weight:400;}
.input.textarea{width:100%;height:180px;padding:0;border:0;}
.select{display:inline-block;position:relative;min-width:120px;height:48px;line-height:1;vertical-align:top;}
.select select{width:100%;height:100%;padding:0 45px 0 10px;border:1px solid #dfdfdf;border-radius:3px;outline:0;font-size:16px;background:#fff url(../images/com/arrow-select.png) no-repeat 96% 50%;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;}
.select.small{height:32px;}
.select.small select{padding:0 32px 0 15px;font-size:14px;color:#000;cursor:pointer;}
.select select::-ms-expand{display:none;}
.input input:focus,.select select:focus,.textarea textarea:focus{border:1px solid #196af3;}
.input.textarea.input-error textarea{border-color:#eb1100;}

/* input datepicker */
.datepicker input{padding:10px 32px 12px 15px;background:#fff url(../images/com/ico-calrendar.png)no-repeat center right 16px;-webkit-box-sizing:border-box;box-sizing:border-box;}

/* desc */
.desc-notice{font-size:16px;color:#666;text-align:center;}
.desc-notice .strong{color:#000;font-weight:500;}
.desc-notice div.strong{margin-bottom:7px;}
.desc-notice + .input{margin-top:20px;}
.desc-notice p{margin-top:10px;}
.desc-notice p:first-child{margin-top:0;}
.desc{font-size:16px;color:#666;}
.desc strong {font-weight:400;color:#000;}
span.desc{display:inline-block;vertical-align:top;}
.desc2 {font-size:16px;color:#000;}
span.desc2 {display:inline-block;height:48px;line-height:48px;vertical-align:middle;}
.desc-form{margin-bottom:12px;text-align:right;line-height:1;}
.desc-form .required{height:24px;font-size:16px;color:#000;font-weight:400;line-height:1;}
.desc-form .required:before{content:'*';display:inline-block;margin:4px 2px 0 0;color:#eb1100;vertical-align:middle;}
.desc-form.sub-title{display:flex;justify-content:space-between;align-items:flex-end;}
.title .desc-notice{margin-top:18px;}
.box-type1{padding:40px;border:1px solid #ddd;}
.desc-area p{display:inline-block;margin-top:8px;}
.desc-area .desc{float:right;}
.desc-area:after {content:'';display:block;clear:both;}
.inquiry-date {margin-bottom:17px;font-size:16px;color:#000;line-height:1;}
.inquiry-date span {display:inline-block;font-size:16px;color:#999;line-height:1;}

/* layout */
body {overflow-x:auto;min-width:1240px;}
.wrap{overflow-x:hidden;}
.wrap .container{min-height:calc(100vh - 260px);padding:0px 0 120px;-webkit-box-sizing:border-box;box-sizing:border-box;}
.wrap section{padding:56px 0 50px;}
.wrap .contents{max-width:1216px;margin:0 auto;}
.wrap .contents-item{margin-top:50px;}
.wrap .title + .contents-item{margin-top:56px;}
.bottom-area{margin-top:40px;}
/* 21-04-13 */
.contents-item .term .term-agree{margin-bottom: 32px;}
@media (max-width:1240px){
    body {min-width:auto;}
    .response-web:not(.main) .wrap .container{padding:50px 0;}
    .response-web .wrap section{padding:40px 0;}
    .response-web .wrap .contents{max-width:100%;}
    .response-web .wrap .contents-item{padding:0 16px;}
    .response-web .wrap .title + .contents-item{margin-top:0;}
}
/* header */
.wrap > header:not(#header){position:relative;z-index:110;height:80px;background:#fff;border-bottom:1px solid #ddd;padding:0 48px;-webkit-box-sizing:border-box;box-sizing:border-box;transition:background .3s ease;}
.wrap > header:not(#header).open{z-index:160;}
.wrap > header:not(#header).white{background:#fff;border-bottom:1px solid #ddd;}
.wrap > header:not(#header) .header-area{position:relative;}
.wrap > header:not(#header) .menu-area{display:flex;justify-content:space-between;align-items:center;}
.wrap > header:not(#header) .util-menu{display:inline-flex;align-items:center;position:absolute;right:0;top:0;z-index:0;margin:25px 0;}
.wrap > header:not(#header) .util-menu a{display:inline-flex;margin-left:8px;line-height:1.2;-webkit-box-sizing:border-box;box-sizing:border-box;}
.wrap > header:not(#header) .user-info{display:inline-flex;height:15px;margin-right:8px;padding-right:8px;border-right:1px solid #444645;color:#999;font-size:14px;font-weight:400;line-height:1;}
.wrap > header:not(#header) .user-info .user-info-name{display:inline-block;color:#196af3;font-size:14px;font-weight:400;max-width: 79px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.wrap > header:not(#header) .util-button{padding:6px 20px;border-radius:25px;font-size:14px;}
.wrap > header:not(#header) .util-button.primary{background:#196af3;border: 1px solid #196af3;color:#fff;}
.wrap > header:not(#header) .util-button.secondary{background:#fff;border:1px solid #ddd;color:#666;}
.wrap > header:not(#header) .mypage-button{margin-left:0;font-size:14px;color:#666;vertical-align:middle;}
.wrap > header:not(#header) .mypage-button:before{content:'';display:inline-block;width:14px;height:15px;margin-right:5px;background:url(../images/com/ico-mypage.png) no-repeat 0 0;}
.wrap > header:not(#header) .header-logo{display:inline-block;width:168px;height:32px;margin:24px 0;background:url(../images/com/logo.png) no-repeat 0 0;font-size:0;vertical-align:top;transition:background .3s ease-out;}
.wrap > header:not(#header) .header-logo a{display:block;height:100%;font-size:0;}

.mymenu{position: relative;height: 30px;transform: translateY(2px);display: inline-block;}
.mymenu > a{display: block;height: 30px;}
.mymenu ul:before{content: '';display: block;width: 10px;height: 10px;top: -2px;left: 50%;background: #fff;position: absolute;transform: rotate(45deg) translateX(-50%);transition: opacity 0.3s ease;border: solid #ddd;border-width: 1px 0 0 1px;z-index: -1;}
.mymenu ul{position: absolute;background: #fff;width:auto;top: 30px;left: 3px;border-radius:10px;opacity: 0;height: 0;overflow: hidden;z-index: -1;display: none;border: 1px solid #ddd;overflow: hidden;box-shadow: 1px 1px 1px rgba(0,0,0,.04);}
/* .mymenu li + li{margin-top: 12px;} */
.mymenu li{display: block;}
.mymenu li a{display: block;width: 100%;height: 100%;font-size: 14px;color: #666;margin: 0;line-height: 1;white-space: nowrap;padding: 8px 16px;}
.mymenu li:hover a{color: #196af3;background: #ebf2fe;}
.mymenu li:first-child:hover a{border-top-right-radius: 10px;border-top-left-radius: 10px;}
.mymenu li:last-child:hover a{border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;}
.mymenu:hover > ul{display: block;opacity: 1;height: auto;z-index: 10;overflow: inherit;}

/* gnb */
.gnb{display:inline-block;position:absolute;left:50%;top:8px;z-index:0;transform:translate3d(-50%,0,0);}
.gnb-menu{display:flex;}
.gnb-menu-item{display:inline-block;position:relative;margin-left:10px;}
.gnb-menu-item:first-child{margin-left:0;}
.gnb-menu-item .depth1{display:inline-block;position:relative;z-index:10;margin:0 30px;padding:25px 0 26px 0;font-size:18px;font-weight:500;color:#000;line-height:1;border-bottom:3px solid transparent;outline:0;transition:all .1s ease;}
.gnb-menu-item .depth2{overflow:hidden;display:block;position:absolute;top:71px;left:50%;z-index:0;height:0;transform:translate3d(-50%,0,0);}
.gnb-menu-item .depth2 ul{/*padding:0 15px;*/border:1px solid #ddd;background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;}
.gnb-menu-item .depth2 li{height:44px;}
/* .gnb-menu-item .depth2 li a{display:block;padding:14px 0;border-top:1px solid #eee;font-size:16px;color:#666;line-height:1;white-space:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;} */
.gnb-menu-item .depth2 li:first-child a{border-top:0;}
/* .gnb-menu-item .depth2 li:hover a{color:#196af3;} */
.gnb-menu-item.active .depth1{color:#196af3;border-bottom:3px solid #196af3;}

.gnb-menu-item.animation-in .depth2{transition:height .2s .2s ease-out;}
.gnb-menu-item.animation-out .depth2{transition:height .2s 0s ease-in;}

.wrap > header.reverse{border-bottom:1px solid rgba(255,255,255,0.1);background:transparent;}
.wrap > header.reverse .header-logo{background:url(../images/com/logo-reverse.png) no-repeat 0 0;}
.wrap > header.reverse .gnb-menu-item .depth1{color:#fff;transition:all .2s 0s ease-in;}
.wrap > header.reverse .gnb-menu-item.active .depth1{color:#196af3;}
.wrap > header.reverse .mypage-button{color:#fff;}
.wrap > header.reverse .mypage-button:before{background:url(../images/com/ico-mypage-reverse.png) no-repeat 0 0;}
.wrap > header.reverse .user-info{color:#999;}
.wrap > header.reverse .user-info .user-info-name{color:#196af3;}
.wrap > header.reverse .util-button{-webkit-box-sizing:border-box;box-sizing:border-box;}
.wrap > header.reverse .util-button.primary{border:1px solid #196af3;}
.wrap > header.reverse .util-button.secondary{border:1px solid #fff;}

.gnb-menu-item:hover .depth1{color:#196af3;border-bottom:3px solid #196af3;}
.gnb-menu-item ul{overflow:hidden;display:block;position:absolute;top:70px;left:50%;z-index:0;height:0;transform:translate3d(-50%,0,0);border:1px solid #ddd;background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;width: 215px;opacity: 0;transition: opacity 0.3s ease-out;}
.gnb-menu-item ul li{height:auto;}
.gnb-menu-item ul li a{display:block;padding:14px 44px 14px 16px ;font-size:16px;color:#666;font-weight:400;line-height:1;text-indent:0;width: 100% !important;box-sizing: border-box;-webkit-box-sizing: border-box;position: relative;}
.gnb-menu-item a.more:after{content:'';display:inline-block;position:absolute;right:10px;top:50%;width:12px;height:12px;transition:transform .3s 0s ease;transform:translate3d(-50%,-50%,0);text-align:center;background:url(../images/com/breadcrumb_close.png) no-repeat center;opacity:.3;}
.gnb-menu-item li:hover > a{color:#196af3;background:#ebf2fe;}
.gnb-menu-item li:hover > a.more:after{background:url(../images/com/breadcrumb_close_3.png) no-repeat center;opacity: 1;}
.gnb-menu-item ul ul{position: absolute;top: -1px;left: 320px;}
.gnb-menu-item ul li:first-child a{border-top:0;}
.gnb-menu-item ul li:hover > a{color:#196af3;}
.gnb-menu li:hover > ul{height: auto;overflow:inherit;opacity: 1;}

@media (max-width:1366px){
    .gnb{transform:translate3d(-63%,0,0);}
}


/* mobile */
@media (max-width:1240px){
    .response-web .home-button{display:inline-block;position:absolute;right:50px;top:15px;z-index:10;width:15px;height:17px;background:url(../images/com/ico-home.png) no-repeat 0 0;background-size:15px auto;}
    .response-web .home-button span {font-size:0;}
    .response-web .wrap{overflow-x:hidden;min-width:inherit;}
    .response-web .wrap header {position:fixed;left:0;right:0;top:0;height:50px;}

    .response-web .hidden-desktop{display:block !important;}
    .response-web .hidden-mobile{display:none !important;}
    .wrap header .gnb-button{display:none !important;} 
    .wrap header .footer-area{display:none !important;} 
    .response-web header:not(#header){border-bottom:1px solid #ddd;}
    .response-web header:not(#header) .gnb-button{display:block !important;}
    .response-web header:not(#header) .footer-area{display:block !important;} 
    .response-web header:not(#header){padding:13px 18px;}
    .response-web header:not(#header) .header-area{justify-content: center;text-align:center;}
    .response-web header:not(#header) .header-logo{width:127px;height:22px;margin:0;background:url(../images/com/logo-m.png) no-repeat 0 0;background-size:cover;}
    .response-web header:not(#header) .header-logo a{width:127px;}
    .response-web header:not(#header) .header-title{font-size:16px;color:#000;font-weight:700;}
    .response-web header:not(#header) .back-button{display:inline-block;position:absolute;left:-7px;top:-7px;z-index:0;background:url(../images/com/btn-back.png) no-repeat 50%;background-size:11px auto;width:22px;height:36px;font-size:0;}
    .main.response-web header:not(#header) .header-logo{display:inline-block !important;}
    .main.response-web header:not(#header) .header-title{display:none !important;}
    .main.response-web header:not(#header) .back-button{display:none !important;}
    .response-web header:not(#header).reverse{border-bottom:1px solid rgba(255,255,255,0.1);}
    .response-web header:not(#header).reverse .header-logo{background:url(../images/com/logo-m-reverse.png) no-repeat 0 0;background-size:cover;}
    .response-web .gnb-button{display:inline-block;position:absolute;right:0;top:3px;z-index:140;width:20px;height:16px;}
    .response-web .gnb-button span{display:inline-block;position:absolute;top:7px;right:0;z-index: 0;width:17px;height:2px;background:#000;border-radius:5px;font-size:0;}
    .response-web .gnb-button span:before,
    .response-web .gnb-button span:after{content:'';display:inline-block;position:absolute;top:0;right:0;z-index: 0;width:20px;height:2px;background:#000;border-radius:5px;}
    .response-web .gnb-button span:before{top:-7px;}
    .response-web .gnb-button span:after{top:7px;}
    
    .response-web header:not(#header) .util-menu{display:block;position:fixed;left:0;margin:0;padding:20px;background:#fff;}
    .response-web header:not(#header) .util-menu a{margin-left:5px;vertical-align: top;}
    .response-web header:not(#header) .util-menu a:first-child{margin-left:0;}
    .response-web header:not(#header) .util-menu .user-info,
    header.reverse .util-menu .user-info{display:block;margin-bottom:9px;margin-right:0;padding-right:0;border-right:0;color:#000;height: auto;max-width: calc(100% - 50px);}
    .response-web header:not(#header) .util-menu .user-info .user-info-name{color:#196af3;width: 100%;max-width: calc(100% - 90px);}
    .response-web header:not(#header) .mypage-button,header:not(#header).reverse .mypage-button{padding:7px 14px;border:1px solid #ddd;border-radius:25px;font-size:13px;color:#666;}
    .response-web header:not(#header) .mypage-button:before,header:not(#header).reverse .mypage-button:before{margin-top:1px;background: url(../images/com/ico-mypage-m.png) no-repeat 0 0;background-size:12px auto;}
    .response-web header:not(#header) .util-button{padding:6px 14px;font-size:13px;}
    .response-web header:not(#header) .util-button.secondary,header.reverse .util-button.secondary{border:1px solid #ddd;color:#666;}
    .response-web .gnb-layer{overflow-y:auto;display:none;position:fixed;left:0;right:0;top:0;bottom:0;z-index:-1;padding-top:90px;background:#fff;text-align:left;}
    .response-web .gnb-layer.open {z-index:130;}
    .response-web .gnb{display:block;position:relative;left:inherit;top:inherit;transform:none;}
    .response-web .gnb-menu{display:block;}
    .response-web .gnb-menu-item{display:block;margin-left:0;}
    .response-web .gnb-menu-item > ul {position:relative;opacity:1;padding:10px 0;border:0;transition:inherit;}
    .response-web .gnb-menu-item li:hover > a {background:none;}
    .response-web .gnb-menu-item .depth1, header.reverse .gnb-menu-item .depth1{display:block;position:relative;margin:0 20px;padding:20px 40px 20px 0;border-bottom:1px solid #eee;font-size:15px;color:#000;}
    .response-web .gnb-menu-item .depth1 .more{display:inline-block;position:absolute;right:0;top:50%;z-index:0;width:26px;height:26px;margin-top:-13px;/* background:red; */}
    .response-web .gnb-menu-item .depth1 .more:before,
    .response-web .gnb-menu-item .depth1 .more:after{content:'';display:inline-block;position:absolute;left:50%;top:50%;z-index:0;background:#999;transition:all .2s 0s ease;}
    .response-web .gnb-menu-item .depth1 .more:before{width:16px;height:2px;margin-left:-8px;margin-top:-1px;}
    .response-web .gnb-menu-item .depth1 .more:after{width:2px;height:16px;margin-left:-1px;margin-top:-8px;}
    .response-web .gnb-menu-item .depth2{overflow:inherit;display:none;position:relative;top:inherit;left:inherit;width:100%;transform:none;height:inherit;background:#f5f5f5;}
    .response-web .gnb-menu-item .depth2 ul{border:0;background:none;padding:16px 27px;}
    .response-web .gnb-menu-item .depth2 li{height:inherit;}
    .response-web .gnb-menu-item .depth2 li a{padding: 10px 27px;border-top:0;font-size:14px;}
    .response-web .gnb-menu-item .depth2 li a:focus {outline:0;}
    .response-web .gnb-menu-item.active .depth1 .more:before{transform: rotate(90deg);width:0;}
    .response-web .gnb-menu-item.active .depth1 .more:after{transform: rotate(90deg);background:#196af3;}

    .response-web .gnb-layer .footer-area{margin-top:135px;padding:25px 20px;border-top:1px solid #eee;}
    .response-web .gnb-layer .footer-area .footer-menu{margin-bottom:5px;display: block;}
    .response-web .gnb-layer .footer-area .footer-menu a{margin-left:8px;padding-left:8px;font-size:13px;}
    .response-web .gnb-layer .footer-area .footer-menu a:first-child{margin-left:0;padding-left:0;}
    .response-web .gnb-layer .footer-area .footer-menu a:nth-last-child(2),
    .response-web .gnb-layer .footer-area .footer-menu a:nth-last-child(1){color: #000;}
    .response-web .gnb-layer .footer-area .footer-menu a:before{top:9px;width:3px;height:3px;display: none;}
    .response-web .gnb-layer .footer-area .copyright{margin-top:9px;font-size:11px;}

    /* header .gnb-button.active{top:0;right:0;z-index:140;} */
    .response-web header:not(#header) .gnb-button.active span{width:0;}
    .response-web header:not(#header) .gnb-button.active span:before,
    .response-web header:not(#header) .gnb-button.active span:after{width:22px;background:#000;transform-origin:0 0}
    .response-web header:not(#header) .gnb-button.active span:before{transform:rotate(45deg);right:-6px;}
    .response-web header:not(#header) .gnb-button.active span:after{transform:rotate(-45deg);top:8px;left:-18px;}
    .response-web header:not(#header).reverse .gnb-button span{background:#fff;}
    .response-web header:not(#header).reverse .gnb-button span:before,
    .response-web header:not(#header).reverse .gnb-button span:after{background:#fff;}
    .response-web header:not(#header).reverse .gnb-button.active span{background:#000;}
    .response-web header:not(#header).reverse .gnb-button.active span:before,
    .response-web header:not(#header).reverse .gnb-button.active span:after{background:#000;}
    
    .response-web header:not(#header) .util-menu a.hidden-desktop{margin-left:0;display: inline-block !important;}
}


/* breadcrumb */
.breadcrumb{position:relative;z-index:100;background:#64738b;border:solid #4f607e;border-width:1px 0;}
.breadcrumb.fixed{position:fixed;top:0;width:100%;border-top:0;}
.breadcrumb-area{display:flex;max-width:1216px;margin:0 auto;}
.breadcrumb-area > li{overflow:hidden;position:relative;height:49px;text-indent:13px;font-size:16px;font-weight:400;color:#666;line-height:0.9;vertical-align:top;}
.breadcrumb-area > li > a{display:block;height:100%;font-size:16px;font-weight:400;color:#fff;line-height:49px;}
.breadcrumb-area > li{border-left:1px solid #4f607e;}
.breadcrumb-area > li:last-child{border-right:1px solid #4f607e;}
.breadcrumb-area > li:not(:first-child) > a{/*min-width:136px;*/width: 171px; padding-right:44px;}
.breadcrumb-area > li:before{content:'';display:inline-block;position:absolute;left:0;top:7px;z-index:0;width:4px;height:4px;background:#ccc;border-radius:50%;display:none;}
.breadcrumb-area > li:first-child{width:50px;}
.breadcrumb-area > li:first-child:before{display:none;}
.breadcrumb-area > li:first-child a{position:relative;background:url(../images/com/ico_home_2.png) no-repeat center;width:100%;height:100%;font-size:0;}
/* .breadcrumb-area > li:last-child a{color:#000;} */
.breadcrumb-menu > a:after{content:'';display:inline-block;position:absolute;right:10px;top:50%;width:12px;height:12px;transition:transform .3s 0s ease;transform:translate3d(-50%,-50%,0);text-align:center;background:url(../images/com/breadcrumb_close_2.png) no-repeat center;opacity:1;transform-origin: center center;}
/* .breadcrumb-menu:hover > a:after{transform: translate3d(-50%,-50%,0) rotate(180deg);} */
.breadcrumb-menu.active > a:after{content:'';transform:translate3d(-50%,-50%,0) rotate(180deg);text-indent:0;background:url(../images/com/breadcrumb_open.png) no-repeat center;}
.breadcrumb-area > li:last-child a:after{opacity:1;}

.breadcrumb-menu .breadcrumb-layer{overflow:hidden;display:inline-block;position:relative;top:0px;z-index:-1;width:calc(100% + 2px);/*margin-left:-1px;*/height:0;/*border:1px solid #ddd;*/background:#fff;vertical-align:top;-webkit-box-sizing:border-box;box-sizing:border-box;opacity:0;transition:all .3s 0s ease;margin: 0px -1px 0;border-top: 1px solid #4f607e;}
.breadcrumb-menu .breadcrumb-layer a{display:block;padding:14px 44px 14px 16px ;font-size:16px;color:#666;font-weight:400;line-height:1;text-indent:0;width: 100% !important;box-sizing: border-box;-webkit-box-sizing: border-box;position: relative;}
.breadcrumb-menu .breadcrumb-layer a:focus{color:#196af3;background:#ebf2fe;}
.breadcrumb-menu .breadcrumb-layer a:first-child{margin-top:0;}
.breadcrumb-menu:hover{overflow:inherit;}
.breadcrumb-menu:hover .breadcrumb-layer{z-index:10;opacity:1;overflow:inherit;}
.breadcrumb.fixed + section,
.breadcrumb.fixed ~ .container section,
.breadcrumb.fixed ~  section{/* padding-top:106px; */}
.breadcrumb.fixed + .sub-visual,
.breadcrumb.fixed + .container .sub-visual{margin-top:50px;}
.breadcrumb-menu .breadcrumb-layer ul{border:1px solid #ddd;height: 0;overflow: hidden;width: 215px;background: #fff;}

.breadcrumb-layer a.more:after{content:'';display:inline-block;position:absolute;right:10px;top:50%;width:12px;height:12px;transition:transform .3s 0s ease;transform:translate3d(-50%,-50%,0);text-align:center;background:url(../images/com/breadcrumb_close.png) no-repeat center;opacity:.3;}
.breadcrumb-layer li:hover > a{color:#196af3;background:#ebf2fe;}
.breadcrumb-layer li:hover > a.more:after{background:url(../images/com/breadcrumb_close_3.png) no-repeat center;opacity: 1;/*transform:translate3d(-50%,-50%,0) rotate(180deg);*/}

.breadcrumb-layer ul ul{position: absolute;top:0;left:0;border:1px solid #ddd;opacity: 0;transition: opacity 0.3s ease-out;top: 0;left:216px;}
.breadcrumb-area ul ul ul{top: -1px;left:215px;}

.breadcrumb-menu:hover .breadcrumb-layer > ul{height:auto;z-index: 10;}
.breadcrumb-menu .breadcrumb-layer > ul > li:hover > ul,
.breadcrumb-menu .breadcrumb-layer > ul > li > ul > li:hover > ul{overflow: inherit;height:auto;opacity: 1;z-index: 9;}
.breadcrumb-layer > a{display: none !important;}
/* title */
.title-h1{font-size:40px;color:#000;line-height:1;text-align:center;}
.title-h2{font-size:24px;color:#000;font-weight:700;line-height:1;}
.title-h3{font-size:20px;color:#000;font-weight:500;line-height:1;}
.title-caption{overflow:inherit;position:inherit;left:inherit;z-index:inherit;margin-bottom:10px;font-weight:400;text-align:left;}
.title-desc{margin-top:24px;font-size:16px;color:#666;word-break:break-all;letter-spacing:-1px;text-align:center;}
.sub-title{margin-bottom:15px;}

/* input 입력시 삭제 버튼  [data-id="input-active"] */
[data-id="input-active"]{width:100%;position:relative;}
[data-id="input-active"].input{padding:0;border:0;}
[data-id="input-active"] input{display:block;width:100%;height:48px;padding:8px 40px 10px 16px;border:1px solid #ddd;border-radius:3px;outline:0;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:16px;color:#000;font-weight:400;}
[data-id="input-active"] input:focus{border-color:#196af3;}
[data-id="input-active"] .input-clear{display:none;position:absolute;top:15px;right:16px;width:18px;height:18px;background:url(../images/com/ico_input_clear.png)no-repeat center/100%;opacity:.6;text-indent:-9999px;}
[data-id="input-active"].active .input-clear,
[data-id="input-active"].input-error .input-clear{display:block;font-size:0;}
[data-id="input-active"] a:after{content:'';padding:20px;padding-top:20px;padding-right:20px;padding-bottom:20px;padding-left:20px;position:absolute;top:50%;left:50%;transform:translate3d(-50%, -50%, 0);}
[data-id="input-active"].input-error input{border-color:#eb1100 !important;}
[data-id="input-active"] .input-desc{display:none;margin-top:8px;padding-left:24px;height:18px;font-size:16px;font-weight:400;line-height:18px;text-align: left !important;}
[data-id="input-active"].input-error .input-desc{display:block;background:url(../images/com/ico_input_error.png)no-repeat left center;color:#eb1100;}
[data-id="input-active"].input-success input{background:url(../images/com/ico_input_success_2.png)no-repeat right 16px center;}
[data-id="input-active"].input-success .input-desc{display:block;background:url(../images/com/ico_input_success.png)no-repeat left center;color:#1eb650;}
[data-id="input-active"].input-success input:disabled{background:#fff, url(../images/com/ico_input_success_2.png)no-repeat right 16px center;color:#000;}
.table-vertical [data-id='input-active'] .input-clear,
.table-horizonal [data-id='input-active'] .input-clear {top:7px;}

/* table */
.table-board table thead th,.table-board table tbody th,
.table-horizonal table tbody th, .table-horizonal table thead th,
.table-vertical table tbody th, .table-vertical table thead th,
.table-compound table tbody th, .table-compound table thead th{padding:12px 20px;font-weight:500;height:56px;color:#000;-webkit-box-sizing:border-box;box-sizing:border-box;}
.table-board table tbody td,
.table-horizonal table tbody td,
.table-vertical table tbody td,
.table-compound table tbody td{padding:12px 20px;font-weight:400;height:56px;background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;}
.table-horizonal table tbody td[class*="bill"],
.table-vertical table tbody td[class*="bill"],
.table-compound table tbody td[class*="bill"]{text-align: right;}
[class^="table-"] .board-title a{height:1.3em;line-height:1.3em;font-weight:400;vertical-align:middle;}
[class^="table-"]:not(.table-form) .input{height:auto;}
[class^="table-"]:not(.table-form) .input input{height:32px;}
/* horizontal */
.table-horizonal table{border:1px solid #ddd;border-top-color:#000;letter-spacing:-.25px;text-align:left;}
.table-horizonal table tbody th{height:26px;padding:21px 30px;border-bottom:1px solid #ddd;font-size:16px;color:#000;font-weight:400;background:#f5f5f5;text-align:left;vertical-align:top;}
.table-horizonal table tbody th label {display:inline-block;margin-top:3px;line-height:1.5;}
.table-horizonal table tbody td{height:26px;padding:20px 25px;border-bottom:1px solid #ddd;line-height:1.2;}
.table-horizonal table tbody th+td,
.table-horizonal table tbody th+th,
.table-horizonal table tbody td+td,
.table-horizonal table tbody td+th{border-left:1px solid #ddd;}
.table-horizonal .input-contents td{padding:10px 25px;}
.table-horizonal .inline-table{margin:-12px -20px;width:calc(100% + 40px);border:0;text-align:center;}
.table-horizonal .inline-table tbody tr th{text-align:center;}
.table-horizonal .inline-table tbody tr:last-child td{border-bottom:0;}
.table-horizonal .select{height:32px;}
.table-horizonal .dash{display:inline-block;height:32px;vertical-align: top;line-height:1.8;}
.table-horizonal td.phone .select,
.table-horizonal td.phone .input{min-width:90px !important;width:90px !important;}
.table-horizonal .business-number .input{width:96px;}
.table-horizonal .business-number2 .input{width:150px;}
.table-horizonal [data-id="input-active"] input{padding:8px 30px 8px 10px;}
.table-horizonal [data-id="input-active"] .input-clear{right:10px;}
.table-horizonal .category .select{width:400px;}
.table-horizonal .textarea textarea{padding:9px 15px;}
.table-horizonal.gateway .input{width:400px;}
.table-horizonal.gateway .url .input{width:100%;}
.popup-layer .table-horizonal .textarea textarea{height:95px;}

/* vertical */
.table-vertical table{text-align:center;border:1px solid #ddd;border-top-color:#000;letter-spacing:-.25px;}
.table-vertical thead th{height:26px;padding:21px 0;border-bottom:1px solid #ddd;font-size:16px;color:#000;font-weight:400;text-align:center;background:#f5f5f5;}
.table-vertical tbody td{height:26px;padding:20px 10px;border-bottom:1px solid #ddd;line-height:1.2;}
.table-vertical.row2 thead th{padding:16px 0;}
.table-vertical thead th + th,
.table-vertical tbody td + td{border-left:1px solid #ddd;}
.table-vertical .button-group{text-align:center;}
.table-vertical .gw-button{margin:25px 0 15px;}
.gw-group{margin-top:30px;padding-top:30px;border-top:1px solid #ddd;}
.gw-group:first-child{margin-top:0;padding-top:0;border-top:0;}

/* compound */
.table-compound table{text-align:center;border:1px solid #ddd;border-top-color:#000;letter-spacing:-.25px;}
.table-compound thead th{height:26px;padding:21px 0;border-bottom:1px solid #ddd;border-left:1px solid #ddd;font-size:16px;color:#000;font-weight:400;text-align:center;background:#f5f5f5;}
.table-compound thead th:first-child {border-left:0;}
.table-compound tbody tr td{border-left:1px solid #dedede;border-bottom:1px solid #dedede;}


/*table board */
.table-board table{border-top:1px solid #000;}
.table-board thead th{padding:12px 20px;border-bottom:1px solid #ddd;font-size:16px;color:#000;font-weight:400;text-align:center;}
.table-board thead th{position:relative;}
.table-board thead th + th:before{content:'';display:inline-block;width:1px;height:14px;background:#ddd;position:absolute;top:50%;left:0;margin-top:-3px;}
/* 크롬에서만 마진값 변경 */
@media screen and (-webkit-min-device-pixel-ratio:0){
    .table-board thead th + th:before{margin-top: -7px;}
}
.table-board tbody td{padding:12px 20px;border-bottom:1px solid #ddd;}
.table-board tbody td.groupname {text-align:left;}
/* .table-board tbody td,.table-board  tbody td a{font-size:16px;color:#666;} */
.table-board .no,.table-board  .date{text-align:center;}
.table-board .board-title a{overflow:hidden;display:block;display:-webkit-box;-webkit-line-clamp:1;height:1.1em;-webkit-box-orient:vertical;font-size:16px;color:#666;line-height:1.1em;text-overflow:ellipsis;}
.table-board .board-desc{text-align:left;}
.table-board .status2{text-align:left;}
.table-board .checkbox{text-align:center;}
.table-board .checkbox-item{float:none;margin-right:0;}
.table-board .checkbox-item input[type="checkbox"] + label{padding-left:24px;}
.table-board .user-name{text-align:center;}
.table-board.api-board.type2 thead th,
.table-board.api-board.type2 tbody td{padding:12px 10px;}

/* table form */
.table-form > table{border-top:2px solid #000;border-bottom:1px solid #ddd;text-align:left;}
.table-form > table > tbody > tr > th{height:48px;padding:8px 0 0 55px;font-size:16px;color:#000;font-weight:500;line-height:1;text-align:left;vertical-align:top;}
.table-form > table > tbody > tr > th label,.table-form > table > tbody > tr > th span {display:inline-block;font-size:16px;color:#000;font-weight:500;line-height:1;}
.table-form > table > tbody > tr > th label,.table-form > table > tbody > tr > th .label{margin-top:16px;}
.table-form > table > tbody > tr > th span{margin-top:6px;}
.table-form > table > tbody > tr > td{height:48px;padding:8px 55px 8px 24px;font-size:16px;color:#666;vertical-align: top;}
.table-form > table > tbody > tr:first-child > th,
.table-form > table > tbody > tr:first-child > td{padding-top:28px;}
.table-form > table > tbody > tr:last-child > th,
.table-form > table > tbody > tr:last-child > td{padding-bottom:28px;}
.table-form > table .required:after{content:'*';display:inline-block;margin:4px 0 0 2px;color:#eb1100;vertical-align:middle;}
.table-form .input{width:400px;}
.table-form .input + .button{margin-left:5px;}
.table-form .dash{display:inline-block;height:48px;padding:0 3px;color:#222;font-weight:400;line-height:2.5;vertical-align:top;}
.table-form span.desc{height:48px;margin-left:10px;line-height:2.9;}
.table-form > table > tbody > tr > td >.radio-group{margin-top: 13px;}
.table-form > table > tbody > tr > td >.radio-item{margin-top: 10px;}
.table-form > table > tbody > tr > td >.checkbox-item{margin-top: 10px;}

/* form 있을때  */
.table-form > form > table{border-top:2px solid #000;border-bottom:1px solid #ddd;text-align:left;}
.table-form > form > table > tbody > tr > th{height:48px;padding:8px 0 0 55px;font-size:16px;color:#000;font-weight:500;line-height:1;text-align:left;vertical-align:top;}
.table-form > form > table > tbody > tr > th label,.table-form > form > table > tbody > tr > th span {display:inline-block;font-size:16px;color:#000;font-weight:500;line-height:1;}
.table-form > form > table > tbody > tr > th label,.table-form > form > table > tbody > tr > th .label{margin-top:16px;}
.table-form > form > table > tbody > tr > th span{margin-top:6px;}
.table-form > form > table > tbody > tr > td{height:48px;padding:8px 55px 8px 24px;font-size:16px;color:#666;vertical-align: top;}
.table-form > form > table > tbody > tr:first-child > th,
.table-form > form > table > tbody > tr:first-child > td{padding-top:28px;}
.table-form > form > table > tbody > tr:last-child > th,
.table-form > form > table > tbody > tr:last-child > td{padding-bottom:28px;}
.table-form > form > table .required:after{content:'*';display:inline-block;margin:4px 0 0 2px;color:#eb1100;vertical-align:middle;}
.table-form .input{width:400px;}
.table-form .input + .button{margin-left:5px;}
.table-form .dash{display:inline-block;height:48px;padding:0 3px;color:#222;font-weight:400;line-height:2.5;vertical-align:top;}
.table-form span.desc{height:48px;margin-left:10px;line-height:2.9;}
.table-form > form > table > tbody > tr > td >.radio-group{margin-top: 13px;}
.table-form > form > table > tbody > tr > td >.radio-item{margin-top: 10px;}
.table-form > form > table > tbody > tr > td >.checkbox-item{margin-top: 10px;}

.table-form .editor-area {padding:8px 0 28px 55px}

.attach-file .table-attach-file{margin-top:20px;}
.attach-file .title-attach-file{line-height:1;}
.attach-file .title-attach-file + .table-attach-file{margin-top:10px;}
.attach-file .outline-button.secondary.search {margin-left:4px;}
.table-attach-file{overflow-y:auto;max-height:206px;border:1px solid #dfdfdf;}
.table-attach-file table {border-top:0;}
.table-attach-file table thead th{height:40px;padding:8px 25px;background:#f5f5f5;text-align:center;font-size:16px;color:#000;font-weight:400;}
.table-attach-file table thead th:first-child{text-align:left;}
.table-attach-file table tbody td{height:auto;padding:5px 25px;text-align:center;font-size:16px;color:#666;font-weight:400;}
.table-attach-file table tbody td:first-child{text-align:left;}
.table-attach-file table tbody tr:last-child td{padding-bottom:16px;}
.table-attach-file table tbody tr:first-child td,
.table-attach-file table tbody tr.file-drop-area + tr td{padding-top:12px;}
.table-attach-file table tbody tr.file-drop-area + tr + tr + td{padding-top:5px;}
.table-attach-file .sub-title{display:flex;justify-content:space-between;margin-bottom:5px;}
.table-attach-file .sub-title .title-h3{margin-top:15px;}
.table-attach-file + .desc {margin-top:10px;}
.table-attach-file + .desc p {margin-top:5px;}
.table-attach-file + .desc p:first-child {margin-top:0;}
/* 21-04-08 */
.table-attach-file .file-drop-area .no-data{margin: 8px 0;background: url(../images/com/file_drop.png) no-repeat 50% 30%;padding: 50px 0 20px;}

.table-form .cell-phone .input{width:120px;}
/* 21-04-13 */
tr.cell-phone span.cell-phone{position: relative;display: inline-block;height: 48px;}
tr.cell-phone span.cell-phone + a{margin-left: 5px;}
.id-check .check-id{display: inline-block;color: #eb1100;margin-left: 8px;height: 48px;line-height: 48px;vertical-align: top;}
.id-check .check-id:before{content:'*';display:inline-block;margin:4px 0 0 2px;color:#eb1100;vertical-align:middle;}
.table-form .sms-certify .input{position:relative;}
.table-form .sms-certify .certify-time{display:inline-block;position:absolute;right:15px;top:11px;z-index:0;font-size:16px;color:#eb1100;}
.table-form .email .input,.table-form .email .select{width:155px;margin-left:4px;}
.table-form .email .input:first-child{width:134px;margin-left:0;}
.table-form .corporate-num .input{width:128px;margin-left:4px;}
.table-form .corporate-num .input:first-child{margin-left:0;}
.table-form .corporate-num2 .input{width:196px;margin-left:4px;}
.table-form .corporate-num2 .input:first-child{margin-left:0;}
.table-form .org-address .input{position:relative;width:100%;}
.table-form .org-address .input .btn-add-search{position:absolute;right:18px;top:12px;z-index:0;}
.table-form .url .input,
.table-form .app-name .input,
.table-form .org-explain .input{width:100%;}
.table-form .url2 .input{width:400px;}
.table-form .service-type .desc{margin-left:11px;}
.table-form .service-type .checkbox-group{width:400px;padding:12px 0;}
.table-form .step-progress{margin-bottom:15px;}
.table-form .category .select{width:400px;}
.table-form .white-list td > div{margin-top:15px;}
.table-form .white-list td > div:first-child {margin-top:0;}
.table-form .app-name2 .select{width:400px;}
.table-form .outline-button + .desc2 {margin-left:8px;}
.table-form.align-center {border-top: 2px solid #000;border-bottom: 1px solid #ddd;}
.table-form.align-center table {width:750px;margin:0 auto;border-top:0;border-bottom:0;}

.attach-file .attach-file-button{display:inline-block;cursor:pointer;}
.attach-file .attach-file-button label{display:inline-block;position:relative;height:48px;padding:15px;background:#f5f5f5;border:1px solid #dfdfdf;border-radius:3px;font-size:16px;color:#222;font-weight:500;line-height:1;-webkit-box-sizing:border-box;box-sizing:border-box;}
.attach-file .attach-file-button label:after{content:'';display:inline-block;width:15px;height:15px;margin-left:10px;background:url(../images/com/search_icon2.png) no-repeat 0 0;}
.attach-file .attach-file-button input[type=file]{overflow:hidden;position:absolute;width:1px;height:1px;padding:0;margin:-1px;clip:rect(0,0,0,0);border:0;}
.table-board .board-title{text-align:left;}

/* .table-board .board-title a:hover{text-decoration:underline;} */
/* table td > a 버튼이 아니면 hover시 밑줄 */
[class*="table"] td a:not([class*="button"]):not(.input-clear){position:relative;display:inline-block;max-width:100%;height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing: border-box;-webkit-box-sizing: border-box;line-height:24px;font-size:16px;color:#666;/*transform: translateY(4px);*/vertical-align: top;}
[class*="table"] td a:not([class*="button"]):not(.input-clear):hover{text-decoration:underline;color:#196af3 !important;}
.table-board td a.ico-private {padding-right:21px;background:url(../images/com/ico-private.png) no-repeat 100% 4px;}

.table-form.type2 > table > tbody > tr > th label,
.table-form.type2 > table > tbody > tr > th span{margin-top:9px;}
/* pagination */
.pagination{display:flex;justify-content:center;margin-top:40px;}
.pagination a{display:inline-block;width:32px;height:32px;margin:0 1px;color:#999;text-align:center;line-height:32px;font-family:Arial;}
.pagination a.active{border-radius:50%;background:#000;color:#fff;}
.pagination .prev{font-size:0;}
.pagination .prev:before{content:'';display:inline-block;width:7px;height:7px;margin-top:12px;border-top:2px solid #000;border-left:2px solid #000;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.pagination .next{font-size:0;}
.pagination .next:before{content:'';display:inline-block;width:7px;height:7px;margin-top:12px;border-top:2px solid #000;border-left:2px solid #000;-webkit-transform:rotate(135deg);transform:rotate(135deg);}
.pagination-area{position:relative;margin-top:40px;text-align:center;}
.pagination-area:after{content:'';display:block;clear:both;}
.pagination-area .pagination{display:inline-block;margin-top:0;padding:8px 0;}
.pagination-area .button{position:absolute;right:0;top:0;z-index:0;}
.pagination-area .button-area{position:absolute;right:0;top:0;z-index:0;}
.pagination-area .button-area .button{position:relative;}
.pagination-area .button-area:first-child{float:left;right:inherit;}
/* list */
[class*='text-list-'] li{margin-top:5px;padding-left:11px;font-size:16px;color:#555;line-height:1.7;letter-spacing: -0.5px;}
[class*='text-list-'] li:first-child{margin-top:0;}
[class*='text-list-'] li:before{content:'-';display:inline-block;text-indent:-11px;}
[class*='text-list-'] + [class^='table-']{margin-top:20px;}
[class*='tooltip-layer text-list-'] li{color:#fff;}
.text-list-dot > li{position:relative;}
.text-list-dot > li:before{content:'';width:4px;height:4px;background:#999;text-indent:-12px;position:absolute;left:0;top:12px;z-index:0;transform:translateZ(0)}

.img-list{display:flex;justify-content:center;}
.img-list li{overflow:hidden;min-width:243px;height:359px;margin-left:80px;box-shadow:10px 10px 20px 7px rgba(0,0,0,.1);}
.img-list li:first-child{margin-left:0;}
.img-list li img{width:100%;}

/* card list */
.card-list ul{display:flex;flex-wrap:wrap;}
.card-list li{position:relative;display:block;width:385px;/* height:310px; */border:1px solid #ddd;margin-left:30px;margin-bottom:30px;background:#fff;transition:all .3s ease;-webkit-box-sizing:border-box;box-sizing:border-box;}
.card-list li:before{content:'';position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;z-index:0;border:4px solid transparent;transition:all .1s 0s ease;}
.card-list:not(.dash-board) li:nth-child(3n + 1){margin-left:0;}
/* 
.card-list li:nth-child(n+4){margin-top:32px;} */
.card-list .list-svc-img{height:48px;margin-bottom:30px;text-align:center;transform:translateZ(0);}
.card-list .list-svc-img img{height:100%;}
.card-list .list-text{position:relative;z-index:10;height:337px;margin:0;}
.card-list .list-tag{margin-bottom:12px;}
.card-list .list-title{height:auto;margin:0 0 5px;font-size:24px;color:#000;font-weight:500;line-height:1.5;}
.card-list .list-desc{height:54px;font-size:16px;color:#666;letter-spacing:-1.5px;}
.card-list li > a{display:block;position:relative;z-index:10;height:100%;padding:37px 30px 40px 40px;-webkit-box-sizing:border-box;box-sizing:border-box;}
.list-text{padding:0;}
.card-list .button-area{display:flex;justify-content:center;position:relative;z-index:10;}
.card-list .button-area .service-button{width:100%;margin:0;padding:13px 15px 15px;background:#fff;border-top:1px solid #ddd;border-left:1px solid #ddd;font-size:16px;color:#666;font-weight:400;text-align:center;line-height:1;-webkit-box-sizing:border-box;box-sizing:border-box;transition:all .1s 0s ease;}
.card-list .button-area .service-button:hover{background:#196af3;color:#fff;}
.card-list .button-area .service-button:first-child{border-left:0;}
.card-list.col3 .list-text {height:170px;overflow:hidden;margin: 54px 30px;}
.card-list.col4 li{width:281px;}
.card-list.col4 li:nth-child(3n + 1){margin-left:30px;}
.card-list.col4 li:nth-child(4n + 1){margin-left:0;}
.card-list.col4 .list-text {height:278px;overflow:hidden;margin: 37px 30px 40px 30px;}
.card-list .list-title {overflow:hidden;max-height:58px;line-height:1.3em;} 
.card-list .list-desc {overflow:hidden;position:relative;display:block;display:-webkit-box;height:auto;max-height:120px;line-height:1.5em;}

.card-list li:hover{text-decoration:none;transform:translateY(-10px);-webkit-box-shadow:10px 10px 14px 7px rgba(0,0,0,.17);box-shadow:10px 10px 14px 7px rgba(0,0,0,.17);}
.card-list li:hover:before{content:'';border:4px solid #196af3;}
.card-list li:hover .list-tag{background:#196af3;}

.card-list.svc-status-list .list-title{max-height:97px;}
.card-list.svc-status-list li:before{display:none;}
.card-list.svc-status-list li:hover {transform:none;-webkit-box-shadow:none;box-shadow:none;}
.card-list.svc-status-list li:hover .list-tag{background:#595a6c;}

.card-list .svc-status {position:relative;margin-top:17px;font-size:16px;color:#666;line-height:1;}
.card-list .svc-status:before {content:'';position:absolute;left:38px;top:2px;z-index:0;display:inline-block;width:1px;height:15px;background:#ddd;}

.card-list .svc-status .status-value {margin-left:17px;font-size:16px;color:#666;}
.card-list .svc-status .status-value:before {content:'';display:inline-block;width:12px;height:12px;margin-right:5px;border-radius:50%;}
.card-list .svc-status .status-value.normal:before {background:#1eb650;}
.card-list .svc-status .status-value.delay:before {background:#eb1100;}

/* datepicker */
/* .ui-widget{font-family:'NotoSansCJKkr', Arial, sans-serif;} */
.ui-datepicker{width:340px;background:#fff;padding:30px 30px 20px 30px;border:1px solid #ddd;-webkit-box-sizing:border-box;box-sizing:border-box;z-index: 301 !important;}
.ui-datepicker .ui-datepicker-header {padding:0;border:0;background:#fff;}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title{margin:0;text-align:center;font-size:16px;}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title select{width:50%;padding:10px 40px 10px 15px;border:1px solid #ddd;border-radius:0;background:url(../images/com/arrow-select2.png) no-repeat 100% 50%;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;}
.ui-datepicker .ui-datepicker-header .ui-datepicker-title select:first-child{border-right:0;}
.ui-datepicker .ui-datepicker-header .ui-datepicker-prev,.ui-datepicker .ui-datepicker-header .ui-datepicker-next{display:none;}
.ui-datepicker .ui-datepicker-calendar th{font-weight:500;}
.ui-datepicker .ui-datepicker-calendar th:first-child span,
.ui-datepicker .ui-datepicker-calendar td:first-child span,
.ui-datepicker .ui-datepicker-calendar td:first-child a{color:#eb1100;}
.ui-datepicker .ui-datepicker-calendar td{padding:0;}
.ui-datepicker .ui-datepicker-calendar td a,
.ui-datepicker .ui-datepicker-calendar td span{width:34px;height:34px;margin:5px 4px;border-radius:50%;}
.ui-datepicker .ui-datepicker-calendar td a{display:inline-block;border:0;background:none;font-size:16px;color:#666;font-weight:400;text-align:center;line-height:1.9;transition:all .1s 0s ease;}
.ui-datepicker .ui-datepicker-calendar td.ui-datepicker-current-day a{background:#196af3;color:#fff;}
.ui-datepicker .ui-datepicker-calendar td a:hover{background:#c5cff3;}
.ui-datepicker .ui-datepicker-calendar td.ui-datepicker-current-day a:hover{background:#196af3;}

/* daterangepicker */
.daterangepicker{display:none;position:absolute;top:100px;left:20px;z-index:130;width:683px;background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;}
.daterangepicker .ranges,
.daterangepicker .drp-buttons,
.daterangepicker .next{display:none;}
.daterangepicker .drp-calendar{display:inline-block;width:340px;padding:20px 30px 30px 30px;border:1px solid #ddd;-webkit-box-sizing:border-box;box-sizing:border-box;}
.daterangepicker .drp-calendar.left{border-right:0;}
.daterangepicker .drp-calendar .calendar-table caption{position:inherit;left:inherit;top:inherit;z-index:inherit;margin:0 0 15px 0;}
.daterangepicker .drp-calendar .calendar-table caption:after{display:block;font-size:16px;color:#000;font-weight:400;text-align:center;line-height:1;}
.daterangepicker .drp-calendar.left .calendar-table caption:after{content:'시작일';}
.daterangepicker .drp-calendar.right .calendar-table caption:after{content:'종료일';}

.daterangepicker .drp-calendar .select-option th{padding-bottom:15px;}
.daterangepicker .drp-calendar .select-option select{width:50%;padding:10px 40px 10px 15px;border:1px solid #ddd;border-radius:0;background:url(../images/com/arrow-select2.png) no-repeat 100% 50%;font-size:16px;color:#000;font-weight:400;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box;}
.daterangepicker .drp-calendar .select-option select:first-child{border-right:0;}
.daterangepicker thead tr:nth-child(2) th{width:40px;height:40px;font-size:16px;color:#000;font-weight:500;text-align:center;}
.daterangepicker td{position:relative;z-index:10;width:40px;height:40px;font-size:16px;color:#666;font-weight:400;text-align:center;border-radius:50%;cursor:pointer;}
.daterangepicker td.active{color:#fff;}
.daterangepicker td.active,.daterangepicker td.active:hover{background:none;}
.daterangepicker td:before{content:'';position:absolute;left:3px;top:3px;z-index:-1;display:inline-block;width:34px;height:34px;border-radius:50%;}
.daterangepicker td.active:before{background:#196af3;}
.daterangepicker td.in-range{background:#e8ecf8;border-radius:0;}
.daterangepicker.ltr.auto-apply.show-calendar.opensright{display:none;}
/* monthpicker */
.month-picker-open-button{display:none !important;}
.month-picker{width:340px;border:1px solid #ddd;background:#fff;z-index: 301;position: absolute !important;}
.month-picker-header{margin:0;padding:15px 25px;border-radius:0;border:0;border-bottom:1px solid #ddd;background:none;font-size:16px;color:#000;font-weight:500;}
.month-picker table{border-spacing:0;}
.month-picker-table-wrap{padding:15px 22px;}
.month-picker-year-table a{border:0;}
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled{opacity:1;}
.month-picker .month-picker-previous{text-align:left;}
.month-picker .month-picker-next{text-align:right;}
.month-picker .month-picker-previous,.month-picker .month-picker-next{display:inline-block;width:30px;height:30px;font-size:0;cursor:pointer;}
.month-picker .month-picker-previous .ui-button,
.month-picker .month-picker-next .ui-button{width:30px;height:30px;background:none;}
.month-picker .month-picker-previous .ui-button:hover,
.month-picker .month-picker-next .ui-button:hover{background:none;}
.month-picker .month-picker-previous .ui-button .ui-icon{background:url(../images/com/btn-prev.png) no-repeat 0 0;}
.month-picker .month-picker-next .ui-button .ui-icon{background:url(../images/com/btn-next.png) no-repeat 0 0;}
.month-picker .month-picker-title{width:230px;height:30px;pointer-events:none;vertical-align:top;text-align:center;}
.month-picker .month-picker-title:hover{background:none;}
.month-picker .month-picker-title .ui-button{border-radius:0;margin:0;padding:0;font-size:16px;color:#000;font-weight:700;line-height:1;}
.month-picker .ui-icon{display:inline-block;width:7px;height:12px;margin-top:8px;text-indent:0;}
.month-picker a.ui-button:hover{border:0;}
.month-picker-month-table td{width:88px;height:inherit;padding:4px;text-align:center;}
.month-picker-month-table .ui-button{display:inline-block;width:88px;height:72px;margin:0;padding:0;border:0;background:none;border-radius:0;font-size:16px;color:#000;font-weight:400;line-height:4.5;text-align:center;}
.month-picker-month-table a.ui-button:hover{font-weight:400;background:#c5cff3;}
.month-picker-month-table a.ui-state-active{background:#196af3;color:#fff;}
.month-picker-month-table a.ui-state-active:hover{background:#196af3;color:#fff;}
.month-picker .month-picker-previous .ui-state-disabled,.month-picker .month-picker-next .ui-state-disabled{pointer-events:inherit;cursor:pointer !important;}

/* button */
.button-area,.bottom-area{display:flex;justify-content:center;align-items:baseline;}
.button-area:after{content:'';display:block;clear:both;}
.button-area a,.bottom-area a{float:left;margin-left:8px;vertical-align:middle;}
.button-area a:first-child,.bottom-area a:first-child{margin-left:0;}
.button-area > span{display:inline-block;}
.button-area > div{display:block;margin-top:25px;}
.button-area > div:first-child{margin-top:0;}
.button-area2{display:flex;justify-content: center;}

.button{display:inline-block;min-width:104px;padding:11px 24px 13px 24px;/* padding:14px 36px; */background:#196af3;border-radius:4px;font-size:16px;color:#fff;font-weight:500;vertical-align:top;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;}
.button-area2 .button{width:100%;height:60px;padding:16px 24px;font-size:18px;font-weight:400;text-align: center;border-radius:0;}
.button.round{border-radius:30px;}
.button.primary{background:#196af3;color:#fff;transition:background .15s ease;}
.button.primary:hover{background:#064fcb;}
.button.secondary{background:#6d6f82;color:#fff;transition:background .15s ease;}
.button.secondary:hover{background:#595a6c;}
.button.tertiary{border:1px solid #ddd;background:#f5f5f5;color:#000;}
/* .text-button.disabled{color:#e1e1e1;} */
.outline-button{display:inline-block;padding:8px 16px;border-radius:4px;border:2px solid #1f2029;color:#1f2029;font-size:14px;}
.outline-button.primary{border:2px solid #1976d2;color:#1976d2;}
.outline-button.secondary{min-width:104px;padding:11px 24px 13px 24px;background:#f5f5f5;border:1px solid #ddd;font-size:16px;color:#000;font-weight:500;vertical-align:top;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;}
/* .outline-button.disabled{border:2px solid #e1e1e1;color:#e1e1e1;} */
.button.small,[class*='-button'].small{padding:11px 15px;font-size:16px;}
/* .button.medium,[class*='-button'].medium{padding:9px 16px;font-size:14px;}
.button.large,[class*='-button'].large{padding:10px 18px;font-size:16px;} */
.button.medium,[class*='-button'].medium{min-width:80px;padding:16px 24px;font-size:16px;line-height:1;text-align:center;}
[class*="button"].disabled{background:#dadada !important;color:#fff !important;cursor:default !important;outline:0;}
[class^="table-"] .outline-button.small,
.api-list .outline-button.small{padding:8px 14px;border:1px solid #ddd;font-size:14px;color:#000;font-weight:400;line-height:1;box-sizing:border-box;-webkit-box-sizing:border-box;transition:border .15s ease;}
[class^="table-"] .outline-button.small:not(.disabled):hover,
.api-list .outline-button.small:not(.disabled):hover{border:1px solid #666;}
[class^="table-"] .outline-button.small.secondary{padding:8px 17px;background:#f5f5f5;border:1px solid #ddd;font-size:14px;color:#000;line-height:1;}
[class^="table-"] .delete-button{display:inline-block;width:12px;height:12px;margin-top:8px;background:url(../images/com/btn-delete.png) no-repeat 0 0;font-size:0;vertical-align:top;}
.status-button{display:inline-block;padding:8px 15px;background:#6d6f82;font-size:14px;color:#fff;font-weight:400;line-height:1;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #6d6f82;}
.status-button.suspending{color:#eb1100;border:1px solid #eb1100;background:#fff;}
[class^="table-"] .outline-button.small + .outline-button.small{margin-left: 4px;}
.outline-button.secondary.search:after {content: '';display: inline-block;width: 15px;height: 15px;margin-left: 10px;background: url(../images/com/search_icon2.png) no-repeat 0 0;}
@media (max-width:1240px) {
    .button{display:inline-block;min-width:104px;padding:9px 11px;background:#196af3;border-radius:4px;font-size:12px;color:#fff;font-weight:500;vertical-align:top;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;}
    .button.primary{background:#196af3;color:#fff;transition:background .15s ease;}
    .button.primary:hover{background:#064fcb;}
    .button.secondary{background:#6d6f82;color:#fff;transition:background .15s ease;}
    .button.secondary:hover{background:#595a6c;}
}

/* checkbox */
.checkbox .checkbox-group{margin-top:40px;}
.checkbox .checkbox-group:first-child{margin-top:0;}
.checkbox-group:after{content:'';clear:both;display:block;}
span.checkbox-group{display:inline-block;}
.checkbox-item{position:relative;}
div.checkbox-item{display:block;margin-top:10px;}
div.checkbox-item:first-child{margin-top:0;}
span.checkbox-item{float:left;display:inline-block;margin-right:40px;}
.check-all .checkbox-item{margin-right:0;}
[class^="table-"] table tbody td span.checkbox-item {float:inherit;}
/* span.checkbox-item:first-child{margin-left:0;} */
.checkbox-item input[type=checkbox]{display:inline-block;position:absolute;left:10px;top:50%;z-index:0;width:1px;height:1px;}
.checkbox-item input[type=checkbox] + label{display:inline-block;min-height:24px;height:26px;padding-left:33px;border:1px dashed transparent;font-size:16px;color:#222;line-height:1.4;cursor:pointer;vertical-align:top;cursor:pointer;}
.checkbox-item input[type=checkbox] + label:before{content:'';display:inline-block;position:absolute;left:0;top:0;z-index:0;width:24px;height:24px;background:#fff;border:1px solid #ddd;border-radius:3px;vertical-align:middle;transition:all .2s .1s ease;}
.checkbox-item input[type=checkbox]:checked + label:before,
.checkbox-item input[type=checkbox]:checked:focus + label:before{background:#196af3;border:1px solid #196af3;}
.checkbox-item input[type=checkbox]:checked + label:after,
.checkbox-item input[type=checkbox]:checked:focus + label:after{content:'';display:inline-block;position:absolute;left:10px;top:5px;width:5px;height:9px;border-top:2px solid #fff;border-left:2px solid #fff;-webkit-transform:rotate(-135deg);transform:rotate(-135deg);}
.checkbox-item input[type=checkbox]:focus + label{border:1px dashed #ccc;}
.checkbox-item input[type=checkbox]:disabled + label{color:#c5c5c5;cursor:default;}
.checkbox-item input[type=checkbox]:disabled + label:before{border:1px solid #d5d5d5;}
.checkbox-item input[type=checkbox]:checked:disabled + label:before{background:#d5d5d5;}

/* radio */
.radio .radio-group{margin-top:40px;}
.radio .radio-group:first-child{margin-top:0;}
.radio-item{position:relative;}
div.radio-item{display:block;margin-top:10px;}
span.radio-item{display:inline-block;margin: 0 8px 0 0;}
.table-form span.radio-item{display:inline-block;margin-right:30px;margin-bottom:10px;}
span.radio-item:first-child{margin-left:0;}
.radio-item input[type=radio]{display:inline-block;position:absolute;left:10px;top:10px;z-index:0;width:1px;height:1px;}
.radio-item input[type=radio] + label{display:inline-block;min-height:23px;padding-left:30px;border:1px dashed transparent;font-size:16px;color:#222;line-height:1.3;font-weight:400;vertical-align:top;cursor:pointer;}
.radio-item input[type=radio] + label:before{content:'';display:inline-block;position:absolute;left:0;top:0;z-index:0;width:24px;height:24px;background:#fff;border:1px solid #e0e0e0;border-radius:50%;vertical-align:middle;-webkit-box-sizing:border-box;box-sizing:border-box;transition:all .1s 0s ease;}
.radio-item input[type=radio] + label:after{content:'';display:inline-block;position:absolute;left:6px;top:6px;z-index:0;width:12px;height:12px;background:#196af3;border-radius:50%;transform-origin:50%;transform:scale(0);transition:all .2s .1s ease;}
.radio-item input[type=radio]:checked + label:before,
.radio-item input[type=radio]:checked:focus + label:before{border:1px solid #196af3;}
.radio-item input[type=radio]:checked + label:after{transform:scale(1);}
.radio-item input[type=radio]:checked + label:after,
.radio-item input[type=radio]:checked:focus + label:after{transform:scale(1);}
.radio-item input[type=radio]:focus + label{border:1px dashed #ccc;}
.radio-item input[type=radio]:disabled + label{color:#c5c5c5;cursor:default;}
.radio-item input[type=radio]:disabled + label:before{border:2px solid #d5d5d5;}
.radio-item input[type=radio]:disabled + label:after{background:#d5d5d5;}
.radio-item label.hidden{font-size:0;}

/* tab */
.default-tab{/* margin-top:40px; */}
.default-tab .tab-list{display:flex;justify-content:center;}
.default-tab .tab-list:after{content:'';clear:both;display:block;}
.default-tab .tab-list .tab{position:relative;margin-left:15px;padding-left:15px;cursor:pointer;}
.default-tab .tab-list .tab:before{content:'';display:inline-block;position:absolute;left:0;top:13px;z-index:0;width:4px;height:4px;background:#ccc;border-radius:50%;}
.default-tab .tab-list .tab:first-child{margin-left:0;padding-left:0;}
.default-tab .tab-list .tab:first-child:before{display:none;}
.default-tab .tab-list .tab a{display:block;padding-bottom:1px;font-size:16px;color:#666;font-weight:400;outline:0;text-decoration:none;}
.default-tab .tab-list .tab.active a{color:#1976d2;border-bottom:3px solid #1976d2;}
.default-tab .tab-list .tab:focus{outline:0;}
.default-tab .tab-list .ui-state-active a{border-bottom:2px solid #1976d2;color:#09a4cb;}
.default-tab .tab-list-line{display:block;width:100px;height:3px;margin-top:-3px;background:#1976d2;}
.default-tab .tab-list .tab[aria-selected=true]{color:#1976d2;}
.default-tab .tabpanel-list .tabpanel{padding:30px;}

.tab-area .box-tab{display:flex;justify-content:center;margin-bottom:48px;}
.tab-area .box-tab:after{content:'';clear:both;display:block;}
.tab-area .box-tab .tab{position:relative;margin-left:15px;padding-left:15px;cursor:pointer;}
.tab-area .box-tab .tab:before{content:'';display:inline-block;position:absolute;left:0;top:13px;z-index:0;width:4px;height:4px;background:#ccc;border-radius:50%;}
.tab-area .box-tab .tab:first-child{margin-left:0;padding-left:0;}
.tab-area .box-tab .tab:first-child:before{display:none;}
.tab-area .box-tab .tab a{display:block;padding-bottom:1px;font-size:18px;color:#666;font-weight:400;outline:0;text-decoration:none;}
.tab-area .box-tab .tab.disabled a{color:#ddd;cursor:default;}
.tab-area .box-tab .tab.active a{color:#1976d2;border-bottom:3px solid #1976d2;}
.tab-area .box-tab .tab:focus{outline:0;}

.tab-list.box-tab2{display:flex;justify-content:flex-start;}
.tab-list.box-tab2 .tab{padding:0 15px;border-left:1px solid #ddd;}
.tab-list.box-tab2 .tab a{display:block;padding-bottom:2px;font-size:20px;color:#000;font-weight:500;line-height:1;}
.tab-list.box-tab2 .tab.active a{color:#196af3;border-bottom:2px solid #196af3;font-weight:700;}
.tab-list.box-tab2 .tab:first-child{padding-left:0;border-left:0;}

.tab-list.box-tab3{display:flex;justify-content:space-between;margin-bottom:40px;}
.tab-list.box-tab3.no-auth{justify-content:left;}
.tab-list.box-tab3 .tab{position:relative;width:25%;}
.tab-list.box-tab3 .tab:before,
.tab-list.box-tab3 .tab:after{content:'';display:inline-block;position:absolute;top:0;z-index:10;width:20px;height:72px;}
.tab-list.box-tab3 .tab:before{left:-20px;z-index:20;}
.tab-list.box-tab3 .tab:after{right:-20px;background:url(../images/utl/bg-step.jpg) no-repeat 0 0;}
.tab-list.box-tab3 .tab:last-child:after{display:none;}
.tab-list.box-tab3 .tab a{display:block;position:relative;height:72px;padding:24px 24px 24px 76px;background:#f5f5f5;color:#000;font-weight:400;line-height: 1.3;-webkit-box-sizing: border-box;box-sizing: border-box;}
.tab-list.box-tab3 .tab a:focus {outline:0;}
.tab-list.box-tab3 .tab:first-child a{padding:24px 24px 24px 56px;}
.tab-list.box-tab3 .tab a i{display:inline-block;position:absolute;left:44px;top:50%;z-index:0;width:24px;height:24px;margin-top:-12px;margin-right:8px;background:#9a9a9a;border-radius:50%;font-size:16px;color:#fff;font-style:400;text-align: center;font-weight:400;line-height: 1.4;vertical-align: top;}
.tab-list.box-tab3 .tab:first-child a i{left:24px;}
.tab-list.box-tab3 .tab.active:before{left:0;background:url(../images/utl/bg-step-before.jpg) no-repeat 0 0;}
.tab-list.box-tab3 .tab.active:first-child:before{background:none;}
.tab-list.box-tab3 .tab.active:after{background:url(../images/utl/bg-step-after.jpg) no-repeat 0 0;}
.tab-list.box-tab3 .tab.active a{background:#196af3;color:#fff;}
.tab-list.box-tab3 .tab.active a i{background:#fff;color:#196af3;}

@media (max-width:1240px) {
    .tab-list.box-tab3{display:block;margin-bottom:20px;}
    .tab-list.box-tab3:after{content:'';display:block;clear:both;}
    .tab-list.box-tab3 .tab{display:inline-block;float:left;width:50%;border-left:1px solid #ddd;border-top:1px solid #ddd;-webkit-box-sizing: border-box;box-sizing: border-box;}
    .tab-list.box-tab3 .tab:nth-child(odd){border-left:0;}
    .tab-list.box-tab3 .tab:nth-child(1),
    .tab-list.box-tab3 .tab:nth-child(2){border-top:0;}
    .tab-list.box-tab3 .tab:before,
    .tab-list.box-tab3 .tab:after{display:none;}
    .tab-list.box-tab3 .tab a {display:flex;align-items:center;height:55px;padding:10px 10px 10px 45px;font-size:14px;}
    .tab-list.box-tab3 .tab:first-child a{padding:10px 10px 10px 45px;}
    .tab-list.box-tab3 .tab a i {left:14px;width:20px;height:20px;margin-top:-10px;font-size:13px;line-height: 1.5;}
    .tab-list.box-tab3 .tab:first-child a i{left:14px;}
    .tab-area.type2 .tab-cont .img-box img{width:100%;}
}

/* accordion */
.default-accordion,
[data-accordion="default"]{border-top:2px solid #000;}
.accordion-item{border-bottom:1px solid #ddd;}
.accordion-item:last-child {/* border-bottom:0; */}
.accordion-item .accordion-title{position:relative;padding:21px 30px;background:#fff;color:#000;font-size:20px;font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;}
.accordion-item .accordion-title .list-tag{margin-right:8px;}
.accordion-item .accordion-title:first-child{border-top:0;}
.accordion-item .accordion-title:focus{outline:1px dashed #555;}
.accordion-item .accordion-title .arrow-button{display:inline-block;position:absolute;right:34px;top:50%;z-index:0;width:30px;height:30px;font-size:0;transform:translateY(-50%);}
.accordion-item .accordion-title .arrow-button:after{content:'';display:inline-block;margin-left:6px;padding:8px;border:solid #999;border-width:0 2px 2px 0;transform-origin:50%;transform:rotate(45deg);-webkit-transform:rotate(45deg);transition:all .2s 0s ease;}
/* .accordion-item .accordion-panel{display:none;padding:32px;background:#f5f5f5;color:#666;font-size:16px;font-weight:400;line-height:1.8;} */
.accordion-item .accordion-panel{display:none;padding:32px;background:#f3f7fe ;color:#666;font-size:16px;font-weight:400;line-height:1.8;border-top: 1px solid #ddd;}
.accordion-item.active .accordion-title .arrow-button{font-weight:500;}
.accordion-item.active .accordion-title .arrow-button:after{margin-top:10px;border-color:#000;transform:rotate(-135deg);-webkit-transform:rotate(-135deg);}
/* .accordion-item.active .accordion-panel{display:block;} */
.term .accordion-panel {overflow-y:auto;height:300px;}
.term .accordion-item:last-child {border-bottom:1px solid #ddd;}


/* 약관동의 */
.term-agree .checkbox-item input[type=checkbox] + label{font-size:16px;line-height:24px;}
.term-agree .accordion-item .checkbox-item input[type=checkbox] + label {color:#666;font-weight:400;}
.term-agree .check-all{padding:25px 30px;border-bottom:1px solid #ddd;}
.term-agree .check-all .checkbox-item input[type=checkbox] + label{font-weight:500;}

/* 완료페이지 */
.complete{display:flex;flex-direction:column;justify-content:center;/*height:calc(100vh - 546px);*/}
.complete img{display:inline-block;width:80px;margin:0px auto 42px;}
.complete .title-h2{margin-bottom:13px;font-size:32px;font-weight:700;display:block;color:#000;line-height:1.4;}
.complete .title-h2 strong{color:#196af3;}
.complete p{font-size:16px;font-weight:400;color:#666;line-height:1.5;}
.complete p + p{margin-top:4px;}
.complete .button-area{margin-top:34px;}
.complete .button-area a{font-weight:700;min-width:130px;padding:14px 25px;}
.complete .table-horizonal{width:590px;margin:33px auto 0 auto;}
.complete .table-horizonal + .button-area{margin-top:40px;}

/* 에러페이지 */
.error{display:flex;flex-direction:column;justify-content:center;height:calc(100vh - 546px);}
.error img{display:block;margin:0px auto 46px;width: 91px;}
.error .title-h2{margin-bottom:18px;font-size:32px;font-weight:700;display:block;color:#000;}
.error p{font-size:16px;font-weight:400;color:#666;line-height:1.7;}
.error .button-area{margin-top:34px;}
.error .button-area a{font-weight:700;width:130px;padding:14px 0;}

/* no data */
.no-data{display:block;margin:120px 0;padding-top:105px;background:url(../images/com/ico_warning.png) no-repeat 50% 0;text-align:center;}
.no-data p{font-size:16px;font-weight:400;color:#666;}
.no-data2{display:flex;align-items:center;min-height:164px;padding:20px;border-bottom:0;font-size:16px;color:#666;justify-content:center;}
.table-board .no-data{margin:100px 0;}

/* 공유하기 */
.sns-share{position:relative;}
.sns-share-layer{display:none;position:absolute;top:70px;left:0;width:min-content;border:1px solid #ddd;background:#fff;min-width:380px;}
.sns-share-layer .popup-header{padding:32px 40px;border-bottom:1px solid #ddd;}
.sns-share-layer .popup-header h1{font-size:24px;font-weight:700;color:#222;line-height:1;}
.sns-share-layer .popup-close{position:absolute;top:35px;right:40px;width:18px;height:18px;background:url(../images/com/popup_close.png) center / 100%;text-indent:-9999px;}
.sns-share-layer .popup-close:after{content:'';position:absolute;top:50%;left:50%;transform:translate3d(-50%, -50%, 0);padding:20px;}
.sns-share-layer .popup-container{padding:40px 55px;}

.sns-list{display:block;width:272px;}
.sns-list li{float:left;margin-left:64px;}
.sns-list li:nth-child(3n+1){margin-left:0;}
.sns-list li:nth-child(n+4){margin-top:40px;}
.sns-list li a{position:relative;;display:block;width:48px;height:77px;font-size:0;}
.sns-list li a:after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);font-size:14px;font-weight:400;color:#666;}
.sns-list .facebook{background:url(../images/com/ico-facebook.png) center top no-repeat;}
.sns-list .facebook:after{content:'페이스북';}
.sns-list .twitter{background:url(../images/com/ico-twitter.png) center top no-repeat;}
.sns-list .twitter:after{content:'트위터';}
.sns-list .kakaotalk{background:url(../images/com/ico-kakaotalk.png) center top no-repeat;}
.sns-list .kakaotalk:after{content:'카카오톡';}
.sns-list .naverblog{background:url(../images/com/ico-naverblog.png) center top no-repeat;}
.sns-list .naverblog:after{content:'블로그';}
.sns-list .instagram{background:url(../images/com/ico-instagram.png) center top no-repeat;}
.sns-list .instagram:after{content:'인스타그램';}
.sns-list .urlcopy{background:url(../images/com/ico-urlcopy.png) center top no-repeat;}
.sns-list .urlcopy:after{content:'URL복사';}
.sns-list:after{content:'';display:block;clear:both;}

/* popup */
/* .popup-layer{display:none;position:fixed;left:0;top:0;z-index:140;width:100%;height:100%;background:rgba(0,0,0,.6);text-align:center;}
.popup-layer:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-.25em;} */
.popup-layer{/* display:none; */position:relative;margin:0 auto;width:1216px;}
.popup-layer.large{width:800px;}
.popup-layer.medium{width:540px;}
.popup-layer.small{width:380px;}
.popup-layer.x-small{width:320px;}
.popup-wrap{display:block;position:relative;width:100%;background:#fff;/* vertical-align:middle;text-align:left; */}
.popup-wrap *{-webkit-box-sizing:border-box;box-sizing:border-box;}
.popup-wrap .title-h3{font-size:20px;}
.popup-wrap .popup-header{padding:32px 40px;border-bottom:1px solid #ddd;}
.popup-wrap .popup-header h1 *:not(span),
.popup-wrap .popup-header h1{font-size:24px;font-weight:700;color:#222;line-height:1;padding-right: 20px;}
.popup-wrap .popup-header h1 span{font-size:inherit;font-weight:inherit;color:inherit;line-height:inherit;}
.popup-wrap .popup-container{padding:24px 40px 0px;max-height:calc(720px - 89px);overflow-y:auto;font-size:16px;}
.popup-wrap .popup-container > p{margin-bottom:16px;}
.popup-wrap .popup-container > *:last-child{padding-bottom: 40px;}
.popup-layer button.mfp-close{position:absolute;top:35px;right:40px;width:18px;height:18px;background:url(../images/com/popup_close.png) center / 100%;text-indent:-9999px;opacity:1;}
.popup-wrap .btn-area{display:flex;justify-content:center;margin-top:36px;}
.popup-wrap .btn-area a{width:auto;height:auto;padding:14px 24px;font-size:16px;line-height:1.3;}
.popup-wrap .btn-area a+a{margin-left:8px;}
.mfp-bg{opacity:0.6;}
/* .popup-layer.small .popup-wrap .btn-area a{min-width:120px;width:auto;height:auto;padding:14px;font-size:16px;text-align:center;line-height:1;} */
.popup-layer.small .table-horizonal{margin-bottom:20px;}
.popup-layer.small .table-horizonal tbody th{padding:12px 17px;font-size:16px;vertical-align:middle;}
.popup-layer.small .table-horizonal tbody td{padding:12px 17px;font-size:16px;}
.popup-layer .table-api-list{overflow-y:auto;max-height:169px;}

/* 팝업관련 21-02-01 추가 설정 */
.dim{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:119;transition:all .1s ease;}
/* .popup-area{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:100;} */
.popup-layer{display:none;position:fixed;top:50%;left:50%;transform:translate3d(-50%,-50%,0);z-index:120;border:1px solid #ddd;background:#fff;/* box-shadow:0 7px 14px 7px rgba(0,0,0,.5); */}
.popup-layer .popup-close{position:absolute;top:35px;right:40px;width:18px;height:18px;background:url(../../resources/images/com/popup_close.png) center / 100%;text-indent:-9999px;opacity:1;}
.popup-layer .popup-close:after{content:'';position:absolute;top:50%;left:50%;transform:translate3d(-50%, -50%, 0);padding:20px;}

/* main popup */
.popup-layer.notice {overflow-x:hidden;width:660px;border:0; }
/* .popup-layer.notice {overflow-x:hidden;width:325px;border:0;} */
.popup-layer.notice .popup-wrap {overflow-y:auto;position:relative;height:600px;padding:50px 0 0;-webkit-box-sizing:border-box;box-sizing:border-box; }
/* .popup-layer.notice .popup-wrap {overflow-y:auto;position:relative;height:445px;padding:50px 0 0;-webkit-box-sizing:border-box;box-sizing:border-box;} */
.popup-layer.notice:after {content:'';display:block;position:absolute;left:0;top:-1px;z-index:10;width:100%;height:50px;background:#fff;}
.popup-layer.notice h1 {margin-bottom:10px;font-size:24px;font-weight:700;color:#000;line-height: 1.45;text-align: center;}
.popup-layer.notice .popup-close {right:18px;top:18px;width:14px;height:14px;background: url(../../resources/images/com/popup_close2.png) no-repeat 0 0;background-size:14px;z-index:20;}
.popup-layer.notice .button-area2 .button {height:50px;padding:13px 14px;font-size:15px;text-align:right;}

/* 요금계산기 POPUP */
.company-select{margin-top:24px;}
.company-select .select{width:240px;float:left;}
.company-select .select+.select{margin-left:8px;}
.company-select:after{content:'';display:block;clear:both;}

/* input 숫자 입력시 오른쪽정렬 */
.input.numerical input{text-align:right;}

/* gray-box */
.gray-box{margin:16px 0 24px;padding:32px 24px;border:solid #ddd;border-width:1px 0;background:#f9f9f9;}

/* 양쪽정렬 UL */
.cols2{display:flex;justify-content:space-between;flex-wrap:wrap;}
.cols2 li{width:50%;font-size:20px;color:#666;line-height:1;}
.cols2 li:nth-child(even){text-align:right;}
.cols2 li:nth-child(n+3){margin-top:8px;}
.price-sum{display:inline-block;font-size:20px;font-weight:400;color:#ff0000;line-height:1;}
.price-sum i{display:inline-block;margin-left:3px;font-size:inherit;color:inherit;font-style:400;line-height:1;}

/* 주소검색/입력 팝업 */
[data-id="popup-address-search"] .popup-wrap .popup-container > p{color:#000;}
.add-search-box{width:460px;}
.add-search-box input{padding:8px 72px 8px 8px;border-bottom:solid #666;border-width:0 0 2px;border-radius:0;}
.add-search-box .input-clear{top:12px;right:40px;}
.add-search-box .btn-add-search{position:absolute;top:12px;right:6px;}
.btn-add-search{display:inline-block;width:20px;height:20px;background:url(../images/com/search_icon.png)no-repeat center/100%;opacity:.6;text-indent:-9999px;}

/* 주소입력 팝업 팁 */
.add-search-tip{margin-top:40px;}
.add-search-tip strong{display:block;font-size:16px;color:#000;font-weight:400;margin-bottom:16px;}
.add-search-tip p{font-size:16px;color:#666;}

/* 주소검색 결과 리스트 */
.add-search-result{margin-top:40px;}
.add-search-result.more ul{height:auto;}
.add-search-result > p{font-size:16px;color:#999}
.add-search-result > p strong{display:inline-block;margin:0 3px;font-size:16px;color:#000;font-weight:500;}
.add-search-result ul{margin:8px 0 0;display:block;height:295px;overflow:hidden;}
.add-search-result li{border-top:1px solid #ddd;}
.add-search-result li a{display:block;padding:24px 0;}
.add-search-result li p{font-size:16px;color:#666;line-height:1.2;}
.add-search-result .more-view{display:block;text-align:center;margin-bottom:24px;}
.add-search-result .more-view span{position:relative;padding-right:27px;font-size:16px;color:#000;} 
.add-search-result .more-view span:after{content:'';position:absolute;top:10px;right:0;width:16px;height:9px;background:url(../images/com/arrow-select.png) no-repeat center/100%;}
.add-search-result .more-view strong{display:inline-block;font-size:16px;color:#196af3;}

/* 주소상세 입력 */
.detail-add{display:flex;flex-direction:column;justify-content:center;margin:0 0 24px;padding:32px 24px;border:solid #ddd;border-width:1px 0;background:#f9f9f9;}
.detail-add .input{background:#fff;}
.detail-add input{font-size:16px;color:#000;}
.detail-add a.button{display:block;width:120px;margin:16px auto 0;padding:10px 0 12px;border:1px solid #ddd;background:#fff;font-size:16px;font-weight:500;color:#000;text-align:center;}
.add-double-check{display:block;}
.add-double-check p{font-size:16px;color:#000;}

/* alert-layer */
/* .alert-layer .popup-wrap{min-width:320px;width:320px;}
.alert-layer .popup-container{text-align:center;} */

[class^="table-"] .button-area{margin-top:32px;text-align:center;}
.space-between{display:flex;justify-content:space-between;align-items:center;}
.flex-start{display:flex;align-items:center;justify-content:start;}

/* 라디오 탭 */
.radio-tab-area .radio-box{display:flex;justify-content:center;align-items:center;margin-bottom:32px;}
.radio-tab-area .radio-item{position:relative;}
.radio-tab-area .radio-item + .radio-item{margin-left:40px;}
.radio-tab-area .radio-item label{cursor:pointer;}
.radio-tab-area .content-area{display:none;}
.radio-tab-area .content-area.active{display:block;}

/* sms인증 input-active */
.sms-certify [data-id="input-active"] input{position:relative;padding:8px 96px 10px 16px;}
.sms-certify [data-id="input-active"] .input-clear{right:64px;}

/* 인풋 에러 텍스트 */
.error-text{display:block;background:url(../images/com/ico_input_error.png)no-repeat left center;margin-top:8px;padding-left:24px;font-size:16px;font-weight:400;color:#eb1100;line-height:18px;} 

/* form error-box */
.error-box{display:flex;justify-content:center;flex-direction:column;padding:24px;margin-bottom:16px;background:#f5f5f5;border-radius:4px;text-align:center;}
.error-box p{font-size:16px;color:#eb1100;}

/* search form */
.detail-search-area{display:flex;justify-content:space-between;align-items:center;padding:30px 55px;margin-bottom:40px;border-top:0;background:#eff2f8;}
.detail-search-area > div{display:flex;align-items:center;justify-content:space-between;}
.detail-search-area input,.detail-search-area select{color:#000;}
/* .detail-search-area > * + *{margin-left:32px;} */
.detail-search-area > div span{margin-right:8px;font-size:16px;color:#000;}
.detail-search-area .input.datepicker {margin-right:5px;}
.detail-search-area > div .input{width:120px;}
/* .detail-search-area > .date span{margin:0 3px;} */
.detail-search-area > .date .input{width:136px;}
.detail-search-area+.count{margin-top:64px;}
[class^="table-"] .space-between{align-items:center;}
/* search-area type2 */
.search-area > div + div{margin-top:16px;}
.search-area span{font-size:16px;color:#000;}
.search-area .search-item{display:inline-flex;align-items:center;width:100%;}
.search-area .search-item span+.input,.search-area .search-item span+.select{width:100%;margin-left:16px;}
.search-area .search-item.type2 + .search-item.type2{margin-left:0;}

.search-area.type2{padding:30px 55px;margin:48px 0;}
.search-area.type2 .search-item:first-child{margin-left:0;}
.search-area.type2 .search-item span{display:inline-block;margin-left:20px;white-space:nowrap;}
.search-area.type2 .search-item span:first-child:not(.input) {margin-left:30px;}
.search-area.type2 .search-item:first-child span:first-child {margin-left:0;}
.search-area.type2 .search-item.date {min-width:442px;}
.search-area.type2 .search-item.date.single {min-width:215px;width:215px;}
.search-area.type2 .search-item.date .input {width:150px;}
.search-area.type2 .search-item.date .input + span {margin-left:8px;}
.search-area.type2 .search-item.date .input + span + .input {margin-left:8px;}
.search-area.type2 .search-item.category {min-width:230px;width:230px;}
.search-area.type2 .search-item.api-name-input {min-width:500px;width:500px;}
.search-area.type2 .button{margin-left:10px;}
.search-area.type2 .hashtag-tab,
.search-area.type2 .hashtag-area{margin-left:16px;max-width: 1010px;}
.search-area.type2 .hashtag-area
.search-area.type2 + .count{margin-top:48px;}
.search-area.type2 .hashtag-tab a{margin: 4px;}

.search-area.type3{display:flex;padding:16px;background:#eff2f8;}
.search-area.type3 .space-between{width:100%;}
.search-area.type3 .search-item:first-child{min-width:240px;margin-right:10px;}
.search-area.type3 .search-item:first-child .select{width:100%;}
.search-area.type3 .search-item:nth-child(2){width:100%;margin-right:10px;}
.search-area.type3 .search-item:first-child.label.api {display:inline-block;width:55px;min-width:55px;text-align:center;}

.search-form dl{display:flex;padding:30px 55px;background:#eff2f8;}
.search-form dl dt{width:222px;}
.search-form dl dt label{display:inline-block;margin-top:9px;}
.search-form dl dd{display:flex;}
.search-form dl dd .input{width:260px;margin-left:4px;}
.search-form dl dd .input:first-child{margin-left:0;}
.search-form dl dd .button{margin-left:8px;}
.search-form .desc{margin-top:10px;}


/* account form */
.account-form{display:flex;padding:15px;background:#eff2f8;}
.account-form .input{width:268px;margin-left:4px;}
.account-form .input:first-child{margin-left:0;}
.account-form .button{margin-left:8px;height:48px;box-sizing:border-box;-webkit-box-sizing:border-box;}

/* hashtag-area */
.hashtag-area{display:block;}
.hashtag-area:after{content:'';display:block;clear:both;}
.hashtag-area a{float:left;display:inline-block;padding:11px 16px;border-radius:2px;border:1px solid #1f2029;background:#fff;font-size:16px;color:#1f2029;line-height:1;}
.hashtag-area a+a{margin-left:8px;}
.hashtag-area .active{color:#196af3;border-color:#196af3;}

.hashtag-tab{display:block;}
.hashtag-tab:after{content:'';display:block;clear:both;}
.hashtag-tab a{float:left;display:inline-block;padding:11px 16px;border-radius:2px;border:1px solid #1f2029;background:#fff;font-size:16px;color:#1f2029;line-height:1;transition:all .2s ease;}
.hashtag-tab a+a{margin-left:8px;}
.hashtag-tab .active{color:#196af3;border-color:#196af3;}

/* step progress */
.step-progress{display:flex;justify-content:center;margin-top:17px;}
.step-progress span{position:relative;margin-left:8px;padding-left:8px;font-size:16px;color:#999;font-weight:400;line-height:1;}
.step-progress span:before{content:'';display:inline-block;position:absolute;left:0;top:50%;width:3px;height:5px;margin-top:-2px;background:url(../images/com/ico-step.png) no-repeat 0 0;}
.step-progress span.active{color:#196af3;}
.step-progress span:first-child{margin-left:0;padding-left:0;}
.step-progress span:first-child:before{display:none;}

/* loading */
#loading-dim{position:fixed;top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.5);z-index:200;}
#loading{position:fixed;top:50%;left:50%;width:80px;height:80px;border-radius:50%;transform:translate3d(-50%,-50%,0);background : #d1e1fd url(../images/com/Loading01.gif)no-repeat center/ 50px 50px;}

/* 21-02-16 변경사항 */
.notic-wrap{margin-top:24px;}
.title + .contents-item > .default-tab,
.title + .contents-item > .tab-area:not(.type2){margin-top:-32px !important;}
.table-horizonal .center p + p{margin-top:8px;}

/* 21-03-05 공지사항 팝업 관련 공지 */
table tr.notice-top a{color:#000 !important;}
table tr.notice-top .headline{margin-right:4px;}

/* editor - note-editor */
.note-editor.note-frame .note-editable{background: #fff;text-align: left;}
.note-editor.note-frame .note-editable * {font-family: 'NotoSansCJKkr';}
.note-editor.note-frame .note-editable ul > li{position:relative;margin-top:6px;padding-left:11px;}
.note-editor.note-frame .note-editable ul > li:first-child{margin-top:0;}
.note-editor.note-frame .note-editable ul > li:before{content:'';width:4px;height:4px;background:#999;text-indent:-12px;position:absolute;left:0;top:12px;z-index:0;}
.note-editor.note-frame .note-editable ol > li{list-style: decimal;margin-left: 20px;/* font-size:16px;color:#555; */}
.note-editor.note-frame .note-editable li + li{margin-top: 8px;}
.note-editor.note-frame .note-editable li > ol,
.note-editor.note-frame .note-editable li > ul{padding-left: 20px;}
.note-editor.note-frame .note-editable p{margin: 0 !important;}
.note-editor .note-editing-area .note-editable table {border:1px solid #ddd;border-top:1px solid #000;letter-spacing:-.25px;color:#000;}
.note-editor .note-editing-area .note-editable table th{padding:12px 0 !important;background:#f5f5f5;}
/* .note-editor .note-editing-area .note-editable table td{padding:20px 10px !important;background:#fff;border-left:1px solid #ddd;border-bottom:1px solid #ddd;line-height:1.2;} */
.note-editor .note-editing-area .note-editable table th:first-child,
.note-editor .note-editing-area .note-editable table td:first-child{border-left:0;}
.note-editor .note-editing-area .note-editable table td, 
.note-editor .note-editing-area .note-editable table th{padding:12px 10px !important;height:56px;background:#fff;border-left:1px solid #ddd !important;border-bottom:1px solid #ddd !important;line-height:1.2;-webkit-box-sizing:border-box;box-sizing:border-box;}
.note-editor .note-editing-area .note-editable table th {background:#f5f5f5;}
.note-editor .note-btn-group a {display:inherit;max-width:inherit;height:inherit;overflow:inherit;text-overflow: inherit;white-space: inherit;-webkit-box-sizing:inherit;line-height: inherit;font-size:inherit;vertical-align: inherit;}
.note-editor .note-btn-group a:hover {color:inherit;text-decoration: inherit;}

/* editor - terms-content */
.terms-content *:not(font) {color:#000;}
.terms-content a:hover font{color:#196af3;text-decoration: underline;}
.terms-content p, .terms-content li, .terms-content span, .terms-content a {font-size:inherit;color:inherit;}
.terms-content ul > li{position:relative;margin-top:6px;padding-left:11px;}
.terms-content ul > li:first-child{margin-top:0;}
.terms-content ul > li:before{content:'';width:4px;height:4px;background:#999;text-indent:-12px;position:absolute;left:0;top:12px;z-index:0;}
.terms-content ol > li{list-style: decimal;margin-left: 28px;/* font-size:16px;color:#555; */}
.terms-content li + li{margin-top: 3px;}
.terms-content li > ol,
.terms-content li > ul{padding-left: 20px;}
.terms-content p{/* margin: 0 !important; */}
.terms-content table {border:1px solid #ddd;border-top:1px solid #000;letter-spacing:-.25px;}
.terms-content table th{padding:12px 0 !important;height:56px;border-bottom:1px solid #ddd;border-left:1px solid #ddd;background:#f5f5f5;-webkit-box-sizing:border-box;box-sizing:border-box;}
.terms-content table td{padding:12px 10px !important;height:56px;background:#fff;border-left:1px solid #ddd;border-bottom:1px solid #ddd;line-height:1.2;-webkit-box-sizing:border-box;box-sizing:border-box;}
.terms-content table tr td:first-child,
.terms-content table tr td:first-child {border-left:0;}
.note-modal-content {top:50%;transform:translate(0, -50%);margin:0 auto;}

/* editor toolbar reset */
.note-toolbar .note-dropdown-menu a {display:inherit !important;height:inherit !important;text-overflow: inherit !important;white-space: inherit !important;line-height:inherit !important;font-size:inherit !important;color:inherit !important;transform:inherit !important;-webkit-box-sizing:inherit !important;}
.note-toolbar .note-dropdown-menu blockquote,.note-toolbar .note-dropdown-menu pre {margin:inherit !important;padding:inherit !important;}
.note-toolbar .note-dropdown-menu h1 {font-size:2em !important;}

/* Mobile ------------------------------------------------------------------- */
@media (max-width:1215px) {
    .top-button{width: 40px;height: 40px;background:#196af3 url(../images/com/btn_top.png)no-repeat center / 11.5px 16.5px;right: 16px;bottom: 30px;}
}

/* 21-04-08 필수항목 삭제 */
.desc-form:not(.sub-title),
.desc-form span.required{display: none;}

.filedragenter table td{background-color: #f3f7fe !important;}
.scroll-y{overflow-y: auto;max-height:337px;}

.company-code .input{width: 100%;}
.company-code .checkbox-item label{outline: 0;}
.company-code table td{line-height: 1.3;}
.company-code table td,
.company-code table th{padding: 5px !important;}
.company-code table td .select{height: 32px;width: 100%;min-width:100%}
.company-code table td .select select{padding-right: 30px;}
.company-code .add-row{margin-bottom: 0;}
.company-code table td .input input{padding: 6px 24px 6px 8px;}
.company-code table td [data-id="input-active"] .input-clear{top: 7px;right: 5px;}

/***************************************************************************
23-11-21 신규(as-is px단위)
****************************************************************************/
.wrap.renewal {min-width:1280px;}
/* Sub #header */
.renewal #header {z-index:101;display:flex;position:relative;margin:0 auto;padding:23px 0;width:100%;width:1280px;height:92px;align-items:center;justify-content:space-between;font:300 16px 'NotoSans', sans-serif;border-bottom:0;}
.renewal #header *, #header *:before, #header *:after {box-sizing:border-box;word-break:keep-all;word-wrap:break-word;}
.renewal #header .logo a {display:inline-block;width:191px;height:30px;color:transparent;user-select:none;background:url(../images/com/logo.png) no-repeat 0 0;background-size:100% auto;}
.renewal nav.nav-gnb .gnb-menu {display:inline-flex;align-items:center;}
.renewal nav.nav-gnb .gnb-menu > li {position:relative;}
.renewal nav.nav-gnb .gnb-menu > li > a {display:block;position:relative;padding:0 35px 0 20px;width:auto;font:300 16px 'NotoSans', sans-serif;color:#000;z-index:1;}
.renewal nav.nav-gnb .gnb-menu > li > a.dep-no {padding-right:20px}
.renewal nav.nav-gnb .gnb-menu > li > a:not(.dep-no)::after {content:'선택';display:block;position:absolute;right:20px;top:50%;width:7px;height:7px;font-size:0;transform:translateY(-50%);-webkit-transform:translateY(-50%);background:url(../images/com/ico_merge_75.png) no-repeat -34px -34px;background-size:100px;}
.renewal nav.nav-gnb .gnb-menu ul.depth2 {display:none;}
.renewal nav.nav-gnb .gnb-menu > li.open > a {font:500 16px 'NotoSans', sans-serif;color:#3b77ff}
.renewal nav.nav-gnb .gnb-menu > li.open > a:after {background-position:-34px -60px}
.renewal nav.nav-gnb .gnb-menu > li:first-child.open > a {letter-spacing:-.5px;}/*영문 weight 흔들림 대응*/
.renewal nav.nav-gnb .gnb-menu li.open ul.depth2 {display:block;position:absolute;left:50%;top:56px;padding:15px 0 14px;width:160px;box-shadow:0 2px 4px 1px rgba(0, 0, 0, 0.1);background:#fff;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);}
.renewal nav.nav-gnb .gnb-menu li.open ul.depth2 li a {display:block;padding:8px 24px;font:300 14px 'NotoSans', sans-serif;color:#000;}
.renewal nav.nav-gnb .gnb-menu li.open ul.depth2 li a:hover {font-weight:500;}
.renewal nav.nav-gnb .util {display:inline-flex;align-items:center;justify-content:center}
.renewal nav.nav-gnb .util a:not(.btn-default) {display:inline-block;padding:0 20px;font:300 16px 'NotoSans',  sans-serif;color:#000}
.renewal nav.nav-gnb .util a[class^="btn"]:last-of-type {margin-left:10px;padding:2px 16px 1px;line-height:40px;letter-spacing:-1px;}
.renewal nav.nav-gnb .util a.open:not(.btn-default) {font-weight:500;color:#3b77ff}
/* breadcrumb-area */
.renewal .breadcrumb {border:0;}
.renewal .breadcrumb *, .renewal .breadcrumb *:before, .renewal .breadcrumb *:after {box-sizing:border-box;word-break:keep-all;word-wrap:break-word;}
.renewal .breadcrumb .breadcrumb-area {max-width:1280px;}
.renewal .breadcrumb-area > li:not(:first-child) > a {width:100%;font:300 16px 'NotoSans', sans-serif;line-height:49px;}
.renewal .breadcrumb-layer {border-top:0;}
.renewal .breadcrumb-layer ul ul {left:214px}
.breadcrumb-layer li > a{font:300 16px 'NotoSans', sans-serif;}
/* conterns */
.renewal .title-h1 {padding-top:5px;font:700 40px 'Noto Sans KR', sans-serif;letter-spacing:-1px;}
.renewal .default-tab .desc-notice {font:350 16px 'Noto Sans KR', sans-serif;word-spacing:-1px;}
.renewal .default-tab .desc-notice + .search-area {margin-top:60px}

.renewal .contents {max-width:100%;width:1280px }
.renewal .txt-info1 {font:350 16px NotoSans, sans-serif;text-align:center;line-height:1.5;word-spacing:-1px;color:#666;}
.renewal .contents-item .txt-info1:first-child {margin-top:-32px;}
.renewal .list-partner {overflow: hidden;padding-top:33px;}
.renewal .list-partner li {float:left;margin:24px 24px 0 0;padding:32px 40px 0;width:302px;height:201px;text-align:center;border:1px solid #dfdfdf;border-radius:8px;box-sizing:border-box;transition:.3s cubic-bezier(0.6, 0.1, 0.2, 1);transform: translateY(0);}
.renewal .list-partner li:nth-child(4n) {margin-right:0;}
.renewal .list-partner li:hover {transform: translateY(-12px);}
.renewal .list-partner li span {display:block;height:52px;}
.renewal .list-partner li span img {max-width:100%;height:100%}
.list-partner li p {margin-top:11px;}
.list-partner li p strong {display:block;margin-bottom:5px;font:500 18px Noto Sans KR, sans-serif;color:#000;}
.list-partner li p {font:350 14px NotoSans, sans-serif;line-height:1.5;color:#000;}

.renewal .year-menu {display:flex;justify-content:center;align-items:center;margin-top:40px;}
.renewal .year-menu li + li:before {content: '';display: inline-block;margin: -2px 16px 0; width:4px; height:4px;vertical-align: middle; background:#d9d9d9;border-radius:50%;}
.renewal .year-menu li button {position:relative;font:500 16px NotoSans, sans-serif;color: #666;border:0;background:none;}
.renewal .year-menu li.on button {color:#0046ff; }
.renewal .year-menu li.on button:after {content:'';display:inline-block;position:absolute;left:0;right:0;bottom:-4px;width:100%;border-bottom:2px solid #0046ff;}
.renewal .yearbox {margin-top:66px;width:1280px;height:750px;}
.renewal .yearbox .tab-panel {display:none;}
.renewal .yearbox .tab-panel.on {display:block}

.renewal .year-menu {display:flex;justify-content:center;align-items:center;margin-top:40px;}
.renewal .year-menu li + li:before {content: '';display: inline-block;margin: -2px 16px 0; width:4px; height:4px;vertical-align: middle; background:#d9d9d9;border-radius:50%;}
.renewal .year-menu li button {position:relative;font:500 16px NotoSans, sans-serif;color: #666;border:0;background:none;}
.renewal .year-menu li.on button {color:#0046ff; }
.renewal .year-menu li.on button:after {content:'';display:inline-block;position:absolute;left:0;right:0;bottom:-4px;width:100%;border-bottom:2px solid #0046ff;}
.renewal .yearbox {margin-top:66px;width:1280px;height:750px;}
.renewal .yearbox .tab-panel {display:none;}
.renewal .yearbox .tab-panel.on {display:block}

/* footer */
.renewal #footer .footer-area{display:flex;justify-content:space-between;align-items:center;width:1280px;max-width:100%;margin:0 auto;padding:62px 0 59px;}
.renewal #footer .footer-area .footer-menu{display:flex;justify-content:flex-start;}
.renewal #footer .footer-area .footer-menu a{display:inline-block;position:relative;padding:0 16px;margin:0;line-height:130%;color:#000;font:500 16px 'NotoSans', sans-serif;}
.renewal #footer .footer-area .footer-menu a:not(:first-child)::before{content:'';display:inline-block;position:absolute;left:0;top:50%;width:1px;height:16px;background:#dfdfdf;-ms-transform:translateY(-50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);}
.renewal #footer .footer-area .footer-menu a:first-child{padding-left:0;}
.renewal #footer .footer-area .copyright{margin-top:17px;font:350 16px 'NotoSans', sans-serif;line-height:150%;color:#4d4d4d;opacity:0.6;}
.renewal #footer .family-site{position:relative;height:45px;}
.renewal #footer .family-site .family-site-button{display:inline-block;position:relative;z-index:10;width:203px;padding:10px 15px;border-bottom:2px solid #000;font-size:16px;font-weight:350;color:#000;-webkit-box-sizing:border-box;box-sizing:border-box;outline:0;}
.renewal #footer .family-site .family-site-button:after{content:'';display:inline-block;position:absolute;right:15px;top:19px;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #000;vertical-align:top;transform:rotate(180deg);transition:all .3s 0s ease;}
.renewal #footer .family-site .family-site-list{overflow:hidden;display:inline-block;position:absolute;left:0;bottom:0;z-index:-1;width:100%;height:0;background:#000;-webkit-box-sizing:border-box;box-sizing:border-box;}
.renewal #footer .family-site .family-site-list li{opacity:0;}
.renewal #footer .family-site .family-site-list li a{display:block;padding:8px 15px;font:350 16px 'NotoSans', sans-serif;color:#fff;transition:all .1s 0s ease;}
.renewal #footer .family-site .family-site-list li:first-child a{padding-top:20px;}
.renewal #footer .family-site .family-site-list li:last-child a{padding-bottom:20px;}
.renewal #footer .family-site .family-site-list a:hover{color:#196af3;}
.renewal #footer .family-site.active .family-site-list{z-index:0;}
.renewal #footer .family-site.active .family-site-button{background:#000;color:#fff;}
.renewal #footer .family-site.active .family-site-button:after{border-top:6px solid #fff;transform:rotate(0deg);}
.renewal #footer .family-site.animation-in .family-site-button{transition:all .3s 0s ease;}
.renewal #footer .family-site.animation-out .family-site-button{transition:all .3s .1s ease;}
.renewal #footer .family-site.animation-in .family-site-list{transition:all .3s 0s ease;}
.renewal #footer .family-site.animation-out .family-site-list{transition:all .3s .1s ease;}
.renewal #footer .family-site.animation-in .family-site-list li{opacity:1;transition:all .3s .2s ease;}
.renewal #footer .family-site.animation-out .family-site-list li{opacity:0;transition:all .3s 0s ease;}



/***************************************************************************
 Main Layout
****************************************************************************/
/* #wrapper {z-index:1;overflow-x:clip;position:relative;min-height:100vh;} */
#wrapper {overflow-x:clip;position:relative;min-height:100vh;}
    #header {z-index:5;display:flex;position:fixed;left:0;right:0;top:0;margin:0 auto;padding:2.3rem 0;width:100%;max-width:128rem;height:9.2rem;align-items:center;justify-content:space-between;transition:.7s background-color ease;-webkit-transition:.7s background-color ease;}
    .scroll #header:before{content:'';display:block;position:absolute;left:50%;top:0; bottom:0; width:100vw;min-width:128rem;height:100%;background:#fff;-ms-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);z-index:-1; }
    #container {z-index:3;position:relative;width:100%;}
        #content {max-width:128rem;margin:0 auto;padding-bottom:12rem}
    footer{z-index:3;position:relative;}
/***************************************************************************
  #header :PC
****************************************************************************/
#header .logo a {display:inline-block;width:19.1rem;height:3rem;color:transparent;user-select:none;background:url(../images/com/logo.png) no-repeat 0 0;background-size:100% auto; }
#header .btn-nav-open {display:none;}
nav.nav-gnb .gnb-menu {display:inline-flex;align-items:center;}
nav.nav-gnb .gnb-menu > li {position:relative;}
nav.nav-gnb .gnb-menu > li > a {display:block;position:relative;padding:0 3.5rem 0 2rem;width:auto;font-weight:300;color:#000;z-index:1;}
nav.nav-gnb .gnb-menu > li > a.dep-no {padding-right:2rem}
nav.nav-gnb .gnb-menu > li > a:not(.dep-no)::after {content:'선택';display:block;position:absolute;right:2rem;top:50%;width:.7rem;height:.7rem;font-size:0;transform:translateY(-50%);-webkit-transform:translateY(-50%);background:url(../images/com/ico_merge_75.png) no-repeat -3.4rem -3.4rem;background-size:10rem;}
nav.nav-gnb .gnb-menu ul.depth2 {display:none;}
nav.nav-gnb .gnb-menu > li.open > a {font-weight:500;color:#3b77ff}
nav.nav-gnb .gnb-menu > li.open > a:after {background-position:-3.4rem -6rem}
nav.nav-gnb .gnb-menu > li:first-child.open > a {letter-spacing:-.05rem}
nav.nav-gnb .gnb-menu li.open ul.depth2,
nav.nav-gnb .util .top-mypage ul.depth2 {display:block;position:absolute;left:50%;top:5.8rem;width:16rem;padding:1.5rem 0 1.4rem;box-shadow:0 .2rem .4rem .1rem rgba(0, 0, 0, 0.1);background:#fff;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);}
nav.nav-gnb .gnb-menu li.open ul.depth2 li a,
nav.nav-gnb .util .top-mypage ul.depth2 li a{display:block;padding:.8rem 2.4rem;font-size:1.4rem;font-weight:300;color:#000;}
nav.nav-gnb .gnb-menu li.open ul.depth2 li a:hover,
nav.nav-gnb .util .top-mypage ul.depth2 li a:hover {font-weight:500;}
nav.nav-gnb .gnb-menu li ul.depth2 li a.more {display:block;position:relative;}
nav.nav-gnb .gnb-menu li ul.depth2 > li a.more::after {content: '';display: inline-block;position: absolute;right:1.4rem;top:50%;width:1.2rem;height:1.2rem;text-align:center;transition:transform .3s 0s ease;transform: translate3d(-50%, -50%, 0);background: url(../images/com/breadcrumb_close.png) no-repeat center;opacity: .3;}
nav.nav-gnb .gnb-menu li ul.depth2 > li:hover > a.more:after{background:url(../images/com/breadcrumb_close_3.png) no-repeat center;opacity: 1;}
nav.nav-gnb .gnb-menu li ul.depth2 ul {display:none;position:absolute;top:0;left:16rem;padding:1.5rem 0 1.4rem;width:100%;height:100%;box-shadow:.1rem .2rem .4rem .1rem rgba(0, 0, 0, 0.1);background:#fff;}
nav.nav-gnb .gnb-menu li.open ul.depth2 li:hover ul {display:block;}

nav.nav-gnb .util {display:inline-flex;align-items:center;}
nav.nav-gnb .util a:not(.btn-default) {display:inline-block;padding:0 2rem;color:#000}
nav.nav-gnb .util a[class^="btn"]:last-of-type {margin-left:1rem;padding:.2rem 1.6rem 1rem;font-weight:500;letter-spacing:-.1rem;}
nav.nav-gnb .util a.open:not(.btn-default) {font-weight:500;color:#3b77ff}
nav.nav-gnb .util .btn-home {display:none;}
nav.nav-gnb .footer-area {display:none;}
nav.nav-gnb .util .top-mypage {position:relative;}
nav.nav-gnb .util .top-mypage ul.depth2 {display:none;}
nav.nav-gnb .util .top-mypage .mypage {position:relative;padding-left:2rem;}
nav.nav-gnb .util .top-mypage .mypage:before {content:'';display:block;position:absolute;left:0;top:.1rem;width:2rem;height:2rem;background: url(../images/com/ico_merge_75.png) no-repeat -4rem .2rem;background-size:8rem;}
nav.nav-gnb .util .top-mypage.open .mypage:before {background-position:-6rem .2rem;}
nav.nav-gnb .util .top-mypage.open .mypage {font-weight:500;color:#3b77ff;}
nav.nav-gnb .util .top-mypage.open ul.depth2 {display:block;}

.user-info {display:inline-block;padding: 0 2rem;}

.user-info .user-info-name {color:#3b77ff}
/***************************************************************************
  #container :PC
****************************************************************************/
#container > #content:after {content:'';display:block;clear:both;}
#container > #content > .section {position:relative;padding:5.2rem 0 5.6rem;z-index:1;}
#container > #content.page-main {position:relative;}
#container> #content.page-main:before,
#container> #content.page-main:after {content:'';display:block;width:82.8rem;height:82.8rem;position:absolute;border-radius:50%;backdrop-filter:blur(1rem);-webkit-backdrop-filter:blur(1rem);box-shadow:0 0 0 .2rem rgba(255, 255, 255, 0.3);}
#container> #content.page-main:before {right:-6.3rem;top:-43.2rem;background:linear-gradient(125deg, rgba(203, 219, 255, 0.20) 14.36%, rgba(210, 224, 255, 0.00) 71.98%);transform:rotate(-165deg); animation: gradient .5s ease infinite;}
#container> #content.page-main:after {right:-68.1rem;top:31.8rem;background:linear-gradient(146deg, rgba(203, 219, 255, 0.20) 14.9%, rgba(210, 224, 255, 0.00) 84.05%);z-index:-1;}
#container > #content.page-main header {overflow:hidden;position:absolute;width:.1rem;height:.1rem;opacity:0;padding:0;}

.main-visual {position:relative;padding-top:30.2rem}
.main-visual:before,.main-visual:after {content:'';display:block;position:absolute;box-shadow:.2rem .2rem 2rem 0 #f1f5ff inset;border-radius:50%;z-index:-2;}
.main-visual:before {width:24.7rem;height:24.7rem;right:-9rem;top:24.8rem;background:radial-gradient(64.58% 64.58% at 44.53% 33.2%, #3b77ff 0%, #afc8ff 82.29%, #dde7ff 100%);}
.main-visual:after {width:15.5rem;height:15.5rem;left:59.6rem;top:51.8rem;background:radial-gradient(85.33% 85.33% at 44.53% 33.2%, #3b77ff 0%, #afc8ff 82.29%, #dde7ff 100%);}
.main-visual p {font-size:4.8rem;font-weight:700;line-height:150%;letter-spacing:-.1rem;color:#bbb;}
.main-visual p strong {color:#000;}
.main-visual p .br-pc {display:block;}
.main-visual p .br-mb {display:inline;}
@supports not (backdrop-filter:blur(.1rem)) {
    #container> #content.page-main:before,
    #container> #content.page-main:after{filter:blur(.1rem);-webkit-filter:blur(.1rem);}
}
.total-area {display:flex;flex-direction:row;justify-content:space-evenly;align-items:flex-start;padding:8rem 19.4rem;width:100%;height:27.7rem;text-align:center;margin-top:12rem;border-radius:.8rem;border:.1rem solid rgba(255, 255, 255, 0.40);background:#1a1a1c;box-shadow:0 .2rem .4rem 0 rgba(0, 0, 0, 0.10); }
.total-area dl {position:relative;display:inline-block; width:20%}
.total-area dl:nth-child(2) {width:45%}
.total-area dl:nth-child(3) {width:35%}
.total-area dl dt {display:block;width:100%; font-size:2.2rem;font-weight:500;color:#888;}
.total-area dl dd {display:block;position:absolute;left:50%;top:3.3rem;margin-top:1rem;font-size:3rem;font-weight:500;line-height:145%;color:#fff;transform:translateX(-50%);-webkit-transform:translateX(-50%); -moz-transform:translateX(-50%);-ms-transform:translateX(-50%);}
.total-area dl dd strong {font-size:5.6rem;font-style:normal;font-weight:700;letter-spacing:-.1rem;}

.news-area {margin-top:1.6rem;padding-left:43.8rem;width:128rem;height:6.1rem;border-radius:.8rem;background:#3B77FF;}
.news-area p {position:absolute;left:11rem;line-height:6.1rem;font-size:1.4rem;font-weight:500;color:#fff;}
.news-area p em.ico-new {display:inline-block;margin-right:.2rem;padding:.2rem .5rem;height:2rem;font-size:1.2rem;font-weight:500;line-height:1.6rem;letter-spacing:-.1rem;color:#0046ff;border-radius:.4rem;background:#fff;}
.news-area ul {display:table;table-layout:fixed;/*width:100%*/}
.news-area ul li {display:table-cell;padding-right:2rem;/*line-height:6.1rem*/}
.news-area ul li:last-child {padding-right:0;}
.news-area ul li a {display:inline-block;padding-right:1.4rem;position:relative;font-size:1.4rem;color:#fff; margin-top:1.8rem; }
.news-area ul li a:after {content:'';display:block;position:absolute;right:.1rem;top:50%;margin-top:-.3rem;width:.7rem;height:.7rem;font-size:0;border:.1rem solid #fff;border-width:.1rem .1rem 0 0;transform:rotate(45deg); -webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);opacity:0.6;}
.news-area ul li a strong {font-weight:500;}
.news-area ul li a span {padding-left:.4rem;opacity:0.6;}
.news-area .swiper-new {overflow:hidden;position:relative;margin:0 auto; padding:0;height:4.5rem;z-index:1;}
.news-area .swiper-slide {display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center; -ms-flex-align:center;-webkit-align-items:center;align-items:center;-webkit-backface-visibility: hidden;-webkit-transform: translate3d(0, 0, 0);}

main section h2.tit {margin-bottom:4rem;padding-top:1rem;text-align:center;font-size:3rem;font-weight:700;line-height:1.5;letter-spacing:-.06rem;color:#000;}
main section h2.tit strong {color:#0046ff;}
.campany-area {position:relative;padding-bottom:12rem }
.campany-area h2.tit {margin-bottom:0;}
.campany-area .btn-more {position:absolute;top:18.3rem;left:50%;line-height:1.2;transform:translateX(-50%);-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);}
.campany-area .btn-more a {display:inline-block;position:relative;padding-right:1.6rem;font-weight:300;color:#000;}
.campany-area .btn-more a:before {content:'';display:block;position:absolute;right:0;top:0;width:1rem;height:2.2rem;background:url(../images/com/ico_merge_75.png) no-repeat -.8rem -5.3rem;background-size:10rem;}
.campany-area .swiper-campany{margin:7.9rem 0 0;}
.campany-area .swiper-wrapper {transition-timing-function:linear;}
.campany-area .swiper-slide { display:flex;align-items:center;justify-content:center;width:auto;height:5.2rem;font-size:0;-webkit-backface-visibility: hidden;-webkit-transform: translate3d(0, 0, 0);}
.campany-area .swiper-slide img {height:100%;width:auto;}
.top5-area {position:relative;padding-bottom:12rem;text-align:center;border-radius:.4rem;border:.1rem solid rgba(255, 255, 255, 0.40);}
.top5-area:before{content:'';display:block;position:absolute;left:50%;top:0; bottom:0; width:100vw;min-width:128rem;height:100%;background:#fafafa;-ms-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);z-index:-1; }
.top5-area h2.tit {margin-bottom:2.3rem;}
.top5-area .tab-menu{display:inline-block}
.top5-area .tab-menu:after {content:'';display:block;clear:both;}
.top5-area .tab-menu li {float:left;}
.top5-area .tab-menu li + li:before {content:'';display:inline-block;margin:-.2rem 1.6rem 0;width:.2rem;height:.2rem;vertical-align:middle;background:#000;opacity:0.3; }
.top5-area .tab-menu li button {font-size:1.4rem;font-weight:300;color:#888;}
.top5-area .tab-menu li.on button {font-weight:500;color:#000;}
.top5-area .tab-conts {margin-top:3.1rem;}
.top5-area .tab-conts .tab-panel {display:none;}
.top5-area.view .tab-conts:first-of-type {animation:fadeIn 1s ease-in-out;}
@keyframes fadeIn {
    from{
        opacity:0;
        transform:translateY(5rem);
    }
    to {
        opacity:3;
        transform:none;
    }
}
.top5-area .tab-panel.on {display:block;}
.top5-area .tab-panel ol li {position:relative;}
.top5-area .tab-panel ol li:after {content:'';display:block;position:absolute;left:0;bottom:0;width:100%;border-bottom:0.2rem solid #dfdfdf;}
.top5-area .tab-panel ol li a {display:table;width:100%;table-layout:fixed; padding-right:10rem;font-size:1.8rem;font-weight:500;line-height:140%;text-align:left; color:#888;box-sizing:border-box;}
.top5-area .tab-panel ol li a:before {display:table-cell;width:10rem;padding-left:2rem;height:9.5rem;vertical-align:middle;box-sizing:border-box;}
.top5-area .tab-panel ol li:nth-child(1) a:before {content:'1위';}
.top5-area .tab-panel ol li:nth-child(2) a:before {content:'2위';}
.top5-area .tab-panel ol li:nth-child(3) a:before {content:'3위';}
.top5-area .tab-panel ol li:nth-child(4) a:before {content:'4위';}
.top5-area .tab-panel ol li:nth-child(5) a:before {content:'5위';}
.top5-area .tab-panel ol li a span {display:table-cell;vertical-align:middle;}
.top5-area .tab-panel ol li a span:after {content: '';display: block;position:absolute;right:2rem;top:50%;margin-top:-1.1rem;width: 1rem;height:2.2rem;background: url(../images/com/ico_merge_75.png) no-repeat -0.8rem -7.7rem;background-size: 10rem;}
.top5-area .tab-panel ol li.active:after  {border-bottom:0.3rem solid #3c77fe;-webkit-transition:all 200ms ease;-moz-transition:all 200ms ease;-o-transition:all 200ms ease;transition:all 200ms ease;}
.top5-area .tab-panel ol li.active a {font-size:2.6rem;color:#000;}
.top5-area .tab-panel ol li.active a:after{border-color:#000;}
.top5-area .tab-panel ol li.active a span:after {background-position-y:-5.2rem;}

.main-service-area {padding-bottom:12rem;}
.main-service-area ul {display:block;margin:0 -1.2rem;font-size:0;}
/* .main-service-area ul li {display:inline-block;height:38rem;padding:0 1.2rem;width:25%;vertical-align:middle;box-sizing:border-box;} */
.main-service-area ul li {display:inline-block;height:38rem;margin-bottom: 2.5rem;padding:0 1.2rem;width:25%;vertical-align:middle;box-sizing:border-box;}
.main-service-area ul li a {display:block;position:relative;padding:3.2rem;height:100%;border-radius:.8rem;background-color:#1a1a1c; }
.main-service-area ul li a:after {content:'';display:block;position:absolute;right:3.2rem;bottom:3.2rem;width:16.6rem;height:13.4rem;background:url(../images/com/bg_main_service.png) no-repeat 0 0;}
.main-service-area ul li:nth-child(2) a:after {background-position-x:-16.6rem;}
.main-service-area ul li:nth-child(3) a:after {background-position-x:-33.2rem;}
.main-service-area ul li:nth-child(4) a:after {background-position-x:-49.7rem;}
.main-service-area ul li a em {display:inline-block;padding:.3rem .3rem 0 .2rem; min-width:5rem;height:2.1rem;line-height:1.7rem;font-size:1.4rem;font-weight:500;color:#fff;border-radius:4px;
background:rgba(255, 255, 255, 0.20);}
.main-service-area ul li a strong {display:block;margin-top:.4rem;font-size:2.2rem;font-weight:500;line-height:150%;color:#fff;}
.main-service-area ul li a span {overflow:hidden;display:-webkit-box;margin-top:.5rem;max-width:100%;text-overflow:ellipsis;line-clamp:2;-webkit-line-clamp:2;-moz-line-clamp:2;-ms-line-clamp:2;-webkit-box-orient:vertical;word-break:break-word;line-height:150%;white-space:initial;font-size:1.6rem;font-weight:300;color:#fff;opacity:0.6;}
.process-area {position:relative;padding-bottom:7rem;}
.process-area:before{content:'';display:block;position:absolute;left:50%;top:0; bottom:0; width:100vw;min-width:128rem;height:100%;background:#f3f7ff;-ms-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);z-index:-1; }
.process-area h2.tit {margin-bottom:0;}
.process-area ul {display:flex;justify-content:space-between;margin-top:2rem;}
.process-area ul li {display:flex;padding:5rem 3.2rem 0;flex-direction:column;align-items:center;position:relative; width:30.2rem;height:30.7rem;text-align:center;background:#f3f7ff;-webkit-box-sizing:border-box;box-sizing:border-box;}
.process-area ul li:before {content:'';display:block;width:9rem;height:9rem;background:url(../images/com/bg_process.png) no-repeat 0 0;}
.process-area ul li:nth-child(2)::before {background-position-x:-9rem}
.process-area ul li:nth-child(3)::before {background-position-x:-18rem}
.process-area ul li:nth-child(4)::before {background-position-x:-27rem}
.process-area ul li:after {content:'';display:inline-block;position:absolute;left:-2.4rem;top:50%;width:100%;height:.2rem;background:url(../images/com/bg_process_line.png) repeat 0 0;background-size:.8rem 1rem;z-index:-1; }
.process-area ul li:first-child::after {display:none;}
.process-area ul li strong {display:block;margin:.8rem 0 .9rem;font-size:2.2rem;font-weight:500;line-height:150%;}
.process-area ul li span {display:block;font-size:1.6rem;font-weight:300;line-height:150%;color:#888;}
.community-area {position:relative;}
.community-area div {display:flex;margin-top:4rem;height:12rem;align-items:flex-start;gap:2.4rem;}
.community-area div a {display:flex;position:relative;padding:0 4rem;height:12rem;justify-content:space-between;align-items:center;flex:1 0 auto;align-self:stretch;font-size:2.2rem;font-weight:500;line-height:150%;color:#fff;border-radius:.8rem;background:var(--graphic-bg-black, #1a1a1c);}
.community-area div a:after {content: '';display: block;position:absolute;right:4rem;top:50%;margin-top:-1rem;width: 1rem;height:2.2rem;background: url(../images/com/ico_merge_75.png) no-repeat -3.3rem -.2rem;background-size: 10rem;}

/***************************************************************************
  footer :PC
****************************************************************************/
.footer-area{display:flex;justify-content:space-between;align-items:center;max-width:128rem;margin:0 auto;padding:6.2rem 0 5.9rem;}
.footer-area .footer-menu{display:flex;justify-content:flex-start;}
.footer-area .footer-menu a{display:inline-block;position:relative;padding:0 1.6rem;line-height:130%;color:#000;font-weight:500;}
.footer-area .footer-menu a:not(:first-child)::before{content:'';display:inline-block;position:absolute;left:0;top:50%;width:.1rem;height:1.6rem;background:#dfdfdf;-ms-transform:translateY(-50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);}
.footer-area .footer-menu a:first-child{padding-left:0;}
.footer-area .copyright{margin-top:1.7rem;font-weight:300;line-height:150%;color:#4d4d4d;opacity:0.6;}
.family-site{position:relative;height:45px;}
.family-site .family-site-button{display:inline-block;position:relative;z-index:10;width:20.3rem;padding:1rem 1.5rem;border-bottom:.2rem solid #000;font-size:1.6rem;font-weight:300;color:#000;-webkit-box-sizing:border-box;box-sizing:border-box;outline:0;}
.family-site .family-site-button:after{content:'';display:inline-block;position:absolute;right:1.5rem;top:1.9rem;width:0;height:0;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-top:.6rem solid #000;vertical-align:top;transform:rotate(180deg);transition:all .3s 0s ease;}
.family-site .family-site-list{overflow:hidden;display:inline-block;position:absolute;left:0;bottom:0;z-index:-1;width:100%;height:0;background:#000;-webkit-box-sizing:border-box;box-sizing:border-box;}
.family-site .family-site-list li{opacity:0;}
.family-site .family-site-list li a{display:block;padding:.8rem 1.5rem;font-size:1.6rem;color:#fff;transition:all .1s 0s ease;}
.family-site .family-site-list li:first-child a{padding-top:2rem;}
.family-site .family-site-list li:last-child a{padding-bottom:2rem;}
.family-site .family-site-list a:hover{color:#196af3;}
.family-site.active .family-site-list{z-index:0;}
.family-site.active .family-site-button{background:#000;color:#fff;}
.family-site.active .family-site-button:after{border-top:.6rem solid #fff;transform:rotate(0deg);}
.family-site.animation-in .family-site-button{transition:all .3s 0s ease;}
.family-site.animation-out .family-site-button{transition:all .3s .1s ease;}
.family-site.animation-in .family-site-list{transition:all .3s 0s ease;}
.family-site.animation-out .family-site-list{transition:all .3s .1s ease;}
.family-site.animation-in .family-site-list li{opacity:1;transition:all .3s .2s ease;}
.family-site.animation-out .family-site-list li{opacity:0;transition:all .3s 0s ease;}

/***************************************************************************
  Mobile Common
****************************************************************************/
.mb .response-web #wrapper {overflow:visible;position:relative;width:100%;min-width:32rem;}
.mb .response-web #header {display:block;padding:0;min-width:32rem;max-width:100%;height:5rem;}
.mb .response-web #container{height:100%;min-height:100vh;margin:0 auto;}
.mb .response-web #container > #content {overflow-x:clip;padding:0 2.4rem 8.7rem;max-width:100%}
.mb .response-web #header .logo {margin:1.6rem 0 0 2.4rem;width:14.6rem;height:2.4rem}
.mb .response-web #header .logo a {width:100%;height:100%;background-size:auto 2.3rem;}
.mb nav.nav-gnb .util a.hidden-mb {display:none;}
.mb .response-web #header .btn-nav-open{overflow:hidden;display:block;position:absolute;right:1.2rem;top:-0.6rem;z-index:140;width:3.2rem;height:3.2rem;}
.mb .response-web #header .btn-nav-open span{display:inline-block;position:absolute;top:1.5rem;left:.4rem;z-index:0;width:2.2rem;height:.2rem;color:transparent;background:#000;border-radius:.1rem;}
.mb .response-web #header .btn-nav-open span:before,
.mb .response-web #header .btn-nav-open span:after{content:'';display:block;position:absolute;top:0;right:0;z-index:0;width:2.2rem;height:.2rem;background:#000;border-radius:.1rem;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
.mb .response-web #header .btn-nav-open span:before{top:-.7rem;}
.mb .response-web #header .btn-nav-open span:after{top:.7rem;}
.mb .response-web #header .btn-nav-open.active {z-index:920;}
.mb .response-web #header .btn-nav-open.active span{height:0;}
.mb .response-web #header .btn-nav-open.active span:before{top:0;transform:rotate(45deg);}
.mb .response-web #header .btn-nav-open.active span:after{top:0;transform:rotate(-45deg);}
.mb .response-web #header .nav-gnb{overflow-y:auto;position:fixed;left:100%;top:0;bottom:0;width:100vw;padding:6.7rem 2.4rem 0;background:#fff;text-align:left;justify-content:flex-start;flex-direction:column;transition: all 0.5s ease;-webkit-transition: all 0.5s ease;z-index:-1;}
.mb .response-web #header .nav-gnb.open { z-index:910;overflow:hidden;left:0;}
.mb .response-web nav.nav-gnb .gnb-menu{overflow-y:auto;display:block;flex:1;}
.mb .response-web nav.nav-gnb .gnb-menu > li{display:block;padding:0;margin-left:0;width:100%;border-bottom:1px solid #f2f2f2;}
.mb .response-web nav.nav-gnb .gnb-menu > li > a {min-height:6.4rem;padding:2rem 0;font-size:1.6rem;font-weight:500; }
.mb .response-web nav.nav-gnb .gnb-menu > li.active > a {color:#3b77ff;}
.mb .response-web nav.nav-gnb .gnb-menu > li > a:not(.dep-no)::after {display:inline-block;position:static;right:auto;top:auto;margin-left:.8rem;vertical-align:middle; transform:translateY(0);-webkit-transform:translateY(0); -moz-transform:translateY(0);-ms-transform:translateY(0);}
.mb .response-web nav.nav-gnb .gnb-menu > li.active > a:after {background-position:-3.4rem -6rem}
.mb .response-web .gnb-menu > li ul.depth2{padding:1.7rem 2rem 1.6rem;border-top:.1rem solid #f2f2f2;background:#fafafa;}
.mb .response-web .gnb-menu > li li{height:inherit;}
.mb .response-web .gnb-menu > li li a{display:block;padding:0.8rem 0;border-top:0;font-size:1.4rem;font-weight:300;color:#000;}
.mb .response-web .gnb-menu > li li.active a {color:#000;}
.mb .response-web .gnb-menu > li li a:focus {outline:0;}
.mb .response-web nav.nav-gnb .util {position:absolute;left:0;top:0;padding:.6rem 7.2rem .6rem 2.4rem;width:100%;}
.mb .response-web nav.nav-gnb .util [class*=btn] {flex:none;}
.mb .response-web nav.nav-gnb .util .btn-home {margin-left:auto;}
.mb .response-web nav.nav-gnb .util a[class*="btn-default"] { display:flex;padding:0.2rem 1.5rem 0.1rem;height:3.7rem;min-width:7rem;line-height:3.2rem;font-size:1.4rem;font-weight:500;}
.mb .response-web nav.nav-gnb .util a[class*="btn-default"] + a[class*="btn-default"] {margin-left:.8rem}
.mb .response-web nav.nav-gnb .util a.login.btn-default02 {color:#3b77ff;}
.mb nav.nav-gnb .util .btn-home {display:inline-block;width:3.2rem;height:3.2rem;}
.mb nav.nav-gnb .util .btn-home:before {content:'';display:inline-block;width:2.5rem;height:2.5rem;vertical-align:top;background:url(../images/com/ico_merge_75.png) no-repeat 0 -2.5rem;background-size:10rem; }
.mb nav.nav-gnb .footer-area.hidden-mb {display:none;}
.mb .response-web nav.nav-gnb.open .footer-area {display:block;}
.mb .news-area p {display:none;}
.mb .footer-area {justify-content:center;max-width:100% ;padding:3.5rem 0 4rem;}
.mb .footer-area .footer-menu {justify-content:center;}
.mb .footer-area .footer-menu a,.mb .footer-area .copyright {line-height:120%;font-size:1.2rem;text-align:center;word-spacing:-.1rem}
.mb .footer-area .footer-menu a {padding-right:0;}
.mb .footer-area .footer-menu a + a {margin-left:1.6rem;}
.mb .family-site {display:none;}
.mb .response-web #container> #content.page-main:before,
.mb .response-web #container> #content.page-main:after {width:31.1rem;height:31.1rem;}
.mb .response-web #container> #content.page-main:before {right:1.4rem;top:-8rem;background:linear-gradient(125deg, rgba(203, 219, 255, 0.20) 14.36%, rgba(210, 224, 255, 0.00) 71.98%);}
.mb .response-web #container> #content.page-main:after {right:-21.8rem;top:19.3rem;background:linear-gradient(146deg, rgba(203, 219, 255, 0.20) 14.9%, rgba(210, 224, 255, 0.00) 84.05%);}
.mb .response-web main section h2.tit {margin-bottom:2rem;padding-top:1rem;font-size:1.8rem;}
.mb .main-visual {padding-top:11rem;}
.mb .main-visual p {font-size:2.6rem;}
.mb .main-visual:before{width:9.3rem;height:9.3rem;right:-2.1rem;top:17.5rem;transition:all .4s;}
.mb .main-visual:after {width:5.8rem;height:5.8rem;left:auto;right:23.6rem;top:27.7rem;transition:all .4s;}
.mb .total-area {display:block;padding:3.5rem 0 4.1rem;margin-top:4.3rem;height:auto;}
.mb .total-area dl {display:block;width:100%;padding-bottom:4.3rem}
.mb .total-area dl:nth-child(2) {width:100%;}
.mb .total-area dl:nth-child(3) {width:100%;}
.mb .total-area dl + dl {margin-top:3.8rem}
.mb .total-area dl dt {font-size:1.6rem}
.mb .total-area dl dd {top:auto;bottom:0;margin:0;font-size:2.2rem}
.mb .total-area dl dd strong {font-size:3.2rem}
.mb .news-area {overflow:hidden;padding:0;height:4.5rem;width:100%;text-align:center;}
.mb .news-area ul li {padding:0 1.2rem;line-height:inherit;}
.mb .news-area ul li a {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:-0.0rem;}
.mb .news-area ul li a:before {content:'NEW';display:inline-block;margin:0 0.6rem 0 0;padding:.2rem 0.4rem .1rem 0.4rem;min-width:3rem;height:1.8rem;font-size:1rem;line-height:1.5rem;vertical-align:middle;color:#0046ff;border-radius:.4rem;background:#fff;}
.mb .news-area ul li a * {vertical-align:middle;line-height:120%;}
.mb .campany-area {padding-bottom:8rem}
.mb .campany-area .swiper-campany {margin-top:6.3rem}
.mb .campany-area .swiper-slide {height:3.6rem}
.mb .campany-area .swiper {overflow:hidden;margin:6.3rem -2.4rem 0;}
.mb .campany-area .btn-more {top:15.0rem;font-size:1.4rem}
.mb .campany-area .btn-more a {padding-right:1.3rem}
.mb .campany-area .btn-more a:before {width:.8rem;height:1.7rem;background-position:-.7rem -4.1rem;  background-size:8rem;}
/***************************************************************************
  Media Query
****************************************************************************/
/* Extra large devices (large desktops, 1200px and down) */
@media only screen and (max-width:1199px){
.main-service-area {padding-bottom:8.5rem}
.main-service-area ul li a {padding:2rem;}
.main-service-area ul li a:after {right:2rem;bottom:2rem;width:15.4rem;height:12.5rem;background-size:61.8rem 12.5rem;}
.main-service-area ul li:nth-child(2) a:after {background-position-x:-15.4rem;}
.main-service-area ul li:nth-child(3) a:after {background-position-x:-30.8rem;}
.main-service-area ul li:nth-child(4) a:after {background-position-x:-46.2rem;}
.main-service-area ul li a em {padding:.3rem .4rem .2rem .3rem;height:2.5rem;line-height:2rem;font-size:1.2rem}
.main-service-area ul li a strong {font-size:1.8rem;}
.main-service-area ul li a span {font-size:1.3rem;}
.process-area {padding-bottom:8rem}
.process-area ul {flex-direction:column;align-items:center;}
.process-area:before {min-width:auto}
.process-area ul li {margin-top:4.8rem;padding-top:0;width:100%;height:auto}
.process-area ul li:before {width:6.4rem;height:6.4rem;background-size:25.6rem auto}
.process-area ul li:first-child {margin-top:0;}
.process-area ul li:nth-child(2)::before {background-position-x:-6.4rem}
.process-area ul li:nth-child(3)::before {background-position-x:-12.8rem}
.process-area ul li:nth-child(4)::before {background-position-x:-19.2rem}
.process-area ul li:after {left:50%;top:-2.5rem;margin-left:-.8rem;width:1.6rem;transform:rotate(90deg) translateZ(0);-webkit-backface-visibility:hidden;}
.process-area ul li strong {font-size:1.8rem}
.process-area ul li span {font-size:1.3rem}
.community-area div{height:100%;flex-direction:column;}
.community-area div a {height:9rem;font-size:1.6rem}
.top5-area {padding-bottom:8rem;border:none}
.top5-area .tab-menu li + li:before {margin:-0.2rem .8rem 0;}
.top5-area .tab-conts {margin-top:2.7rem;}
.top5-area .tab-panel ol li a {padding-right:4.5rem;height:8rem;font-size:1.3rem;}
.top5-area .tab-panel ol li a:before {width:6rem;height:8rem}
.top5-area .tab-panel ol li.active a {font-size:1.8rem;}
}
/* Large devices (desktops, 992px and Down) */
@media only screen and (max-width:991px) {

.main-service-area .scroll-box {overflow-x:auto;overflow-y:hidden;white-space:nowrap;}
.main-service-area ul{margin:0 -.8rem}
.main-service-area ul li {padding:0 .8rem;width:26rem;height:32.5rem}

}
