@charset "utf-8";
/* CSS Document */
html {
    /* Prevent font scaling in landscape */
    -webkit-text-size-adjust:none; /*Chrome, Safari, newer versions of Opera*/
    -moz-text-size-adjust:none; /*Firefox*/
    -ms-text-size-adjust:none;  /*Ie*/
    -o-text-size-adjust:none; /*old versions of Opera*/
}
html::-webkit-scrollbar {width:10px;}
html::-webkit-scrollbar-thumb {background-color:#3843D0; border-radius:10px; background-clip:padding-box; border:2px solid transparent;}
html::-webkit-scrollbar-thumb:hover {background-color:#3843D0;}
html::-webkit-scrollbar-track {background-color:#fff;}


/* 영역구분 */
#wrap {position:relative; width:100%; margin:0 auto; text-align:center;}
.wrap {display:inline-block; vertical-align:middle; position:relative; box-sizing:border-box; width:100%; max-width:1920px; margin:0 auto; padding:0 60px;}
.wrap.t1 {max-width:1520px;}
/* 폰트 */
.font {font-family:"Pretendard";}

/* 컬러 */
.cm {color:#3843D0 !important;}	/* 메인 */
.ck {color:#000 !important;}	/* 검은색 */
.cw {color:#fff !important;}	/* 흰색 */
.cb {color:#231F20 !important;}	/* 연한 검정색 */


/* 타이틀 */
.title {font-size:50px; line-height:60px; word-wrap:normal; word-break:keep-all;}
.title.t1, .title .t1 {font-size:120px; line-height:110px;}
.title.t2, .title .t2 {font-size:100px; line-height:110px;}
.title.t3, .title .t3 {font-size:50px; line-height:50px;}
.title.enter {white-space:nowrap;}
.title.enter span, .title .enter span, .title.enter strong, .title .enter strong{display:block;}


/* 텍스트 */
.text {font-size:14px; font-weight:400; line-height:40px; word-wrap:normal; word-break:keep-all;}
.text.word, .text .word {word-break:break-all;}
.text.big, .text .big {font-size:16px; line-height:30px;}
.text a {color:#101111;}
.text.cw a, .text .cw a {color:#fff;}
.text a:hover {color:#101111; text-decoration:underline; text-decoration-color:#101111;}
.text.cw a:hover, .text .cw a:hover {color:#fff; text-decoration:underline; text-decoration-color:#c79d70;}
.text img {display:inline-block; vertical-align:middle; max-width:100%; margin:0;}
.text input {display:inline-block; vertical-align:middle;}
.text label {cursor:pointer;}
.text u {text-decoration:none; border-bottom:rgba(255, 255, 255, 0.1) solid 2px;}
.overflow {min-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:break-all;}
.text.enter, .text .enter {white-space:nowrap;}
.text.enter span, .text .enter span, .text.enter strong, .text .enter strong {display:block;}


.thin {font-weight:100;}
.light {font-weight:300;}
.medium {font-weight:500;}
.semibold {font-weight:600;}
.bold {font-weight:700;}
.semiblack {font-weight:800;}
.black {font-weight:900;}


/* 꾸밈요소 */
.line {border-style:solid; border-color:#dadce1;}
.line.bcm {border-color:rgba(175, 177, 176, 0.2);}
.line.bcl {border-color:rgba(191, 190, 197, 0.2);}
.line.bcg {border-color:rgba(103, 156, 128, 0.2);}
.line.bcj {border-color:rgba(154, 93, 127, 0.2);}
.line.bcr {border-color:rgba(78, 107, 123, 0.2);}
.line.bcb {border-color:#101111}
.line.bci {border-color:rgba(16,17,17,0.2);}
.line.dashed {border-style:dashed;}
.line.dotted {border-style:dotted;}
.line.bt {border-top-width:1px;}
.line.bl {border-left-width:1px;}
.line.br {border-right-width:1px;}
.line.bb {border-bottom-width:1px;}

/* 폼태그 */
.form {display:inline-block; vertical-align:middle; width:100%; text-align:left;}
.form .f_wrap {display:inline-block; vertical-align:middle; width:100%; padding:5px 0;}
.form .f_field {display:inline-block; vertical-align:middle; float:left; position:relative; width:100%;}
.form .f_field .ff_title {position:absolute; left:0; top:0; width:80px; height:40px; overflow:hidden; font-size:15px; font-weight:500; color:#101111; letter-spacing:-0.5px; line-height:40px; text-align:left;}
.form .f_field .ff_title label {position:relative;}
.form .f_field .ff_wrap {display:block; margin-left:100px !important;}
.form .f_field .ff_wrap.text {margin-top:5px;}
.form .f_field .ff_wrap.content {min-height:40px; margin-top:0; line-height:40px;}
.form .f_field input {display:inline-block; vertical-align:middle;}


/* 폼스타일 */
.input {display:inline-block; vertical-align:middle; box-sizing:border-box; width:100%; max-width:80px; height:30px; margin:0; padding:0 10px; outline:none; border-radius:5px; border:#E4E4EE solid 1px; background-color:#F1F1F6; font-size:14px; font-weight:500; color:#111327; letter-spacing:-0.5px; line-height:38px; text-align:center;}
.input:hover {border-color:#111327;}
.input::placeholder {color:#111327;}
.input.big {max-width:100%; height:50px; padding:0 20px; border-radius:25px; border:none; font-size:15px; line-height:50px; text-align:left;}
.input.middle {max-width:400px;}
.select {display:inline-block; vertical-align:middle; width:120px; height:30px; padding-left:10px; padding-right:27px; border-radius:5px; background-color:#F1F1F6 !important; border:#E4E4EE solid 1px; font-size:14px; font-weight:500; color:#111327; line-height:30px; appearance:none; background:url('../images/common/icon_selectarrow.svg') no-repeat right 10px center;}
.select:hover {border-color:#101111;}
.textarea {display:block; vertical-align:middle; box-sizing:border-box; width:100%; width:98%\9; min-height:40px; margin:0; padding:0; outline:none; border:#b0b0b0 solid 1px; border:rgba(16,17,17,0.2) solid 0;font-size:15px; font-weight:100; color:#101111; letter-spacing:-0.5px; line-height:38px; text-align:left;}
.file {display:block; vertical-align:middle; width:100%; height:40px; margin:0; padding:0; outline:none; border:rgba(16,17,17,0.2) solid 0; font-size:15px; font-weight:100; color:#101111; letter-spacing:-0.5px; line-height:38px; text-align:left;}
.file:hover {border-color:#101111;}

.checkbox {position:relative;}
.checkbox label {display:inline-block; position:relative; padding-left:34px; margin:0; font-size:14px; font-weight:500; color:#111327; line-height:30px; text-align:left; cursor:pointer;}
.checkbox label:before {content:""; position:absolute; left:0; top:50%; box-sizing:border-box; width:24px; height:24px; margin-top:-12px; border:#E4E4EE solid 2px; border-radius:5px; background-color:#fff;}
.checkbox label:after {content:""; position:absolute; left:4px; top:50%; width:16px; height:16px; margin-top:-8px; background-image:url("../images/common/icon_check.svg"); opacity:0;}
.checkbox input {position:absolute; left:0; top:50%; width:24px; height:24px; margin-top:-12px; opacity:0;}
.checkbox input:checked + label {font-weight:800;}
.checkbox input:checked + label:before {background-color:#F9E705; border-color:#F9E705;}
.checkbox input:checked + label:after {opacity:1;}
.checkbox.t1 {position:absolute; left:10px; top:10px;}
.checkbox.t1 label {height:24px;}
.checkbox.t1 label:before {top:0; margin-top:0 !important;}


.button {display:inline-block; box-sizing:border-box; width:160px; height:50px; border: 2px solid #3843D0; border-radius:25px; background-color:transparent; font-size:18px; font-weight:700; color:#3843D0 !important; line-height:46px; transition:0.3s all;}
.button.t1 {width:auto; min-width:160px; padding:0 40px;} 
.button:hover,
.button.t1:hover {background-color:#3843D0; border-color:#3843D0; color:#fff !important;}
.button.t2,
.button.on {background-color:#3843D0; border-color:#3843D0; color:#fff !important;}
.button.t2:hover {background-color:transparent; border-color:#3843D0; color:#3843D0 !important;}

.button.icon {width:120px; padding:0;}
.button.icon .icon {display:inline-block; position:relative; width:12px; height:12px; margin-right:10px; background-repeat:no-repeat; background-position:center; background-size:100% auto; }
.button.icon .icon.search {background-image:url("../images/common/icon_search.svg"); filter: invert(99%) sepia(35%) saturate(240%) hue-rotate(179deg) brightness(116%) contrast(100%);}
.button.icon .icon.refresh {background-image:url("../images/common/icon_refresh.svg"); filter: invert(7%) sepia(8%) saturate(4550%) hue-rotate(197deg) brightness(96%) contrast(98%);}
.button.big {width:100%; height:50px; border-radius:25px; line-height:46px;}

.decoline {position:relative; z-index:0;}
.decoline:before {content:""; position:absolute; left:-1px; right:-1px; bottom:7px; z-index:-1; height:4px; border-radius:1px; background-color:#F9E705;}
.decoline:hover {text-decoration:none !important;}

.decotitle {display:inline-block; position:relative; float:left; box-sizing:border-box; width:100%; margin-bottom:10px; padding-left:18px; font-size:16px; font-weight:700; color:#111327; line-height:30px; letter-spacing:-0.5px; text-align:left; word-break:keep-all;}
.decotitle:before {content:""; position:absolute; left:0; top:50%; width:8px; height:8px; margin-top:-4px; border-radius:50%; background-color:#F9E705;}
.decotitle .d_refresh {display:inline-block; position:relative; top:-2px; vertical-align:middle; width:20px; height:20px; margin-left:8px; background-color:#F1F1F6; border-radius:5px;}
.decotitle .d_refresh i {position:absolute; left:50%; top:50%; width:12px; height:12px; margin-left:-6px; margin-top:-6px; background-image:url("../images/common/icon_refresh.svg"); background-repeat:no-repeat; background-position:center; background-size:100% auto; filter: invert(7%) sepia(8%) saturate(4550%) hue-rotate(197deg) brightness(96%) contrast(98%);}
.decotitle.toggleArrow {width:100%; margin-bottom:5px; padding-right:20px; text-align:left; cursor:pointer;}
.decotitle.toggleArrow i {position:absolute; right:0; top:50%; width:20px; height:20px; margin-top:-10px; background-color:#F1F1F6; border-radius:5px;}
.decotitle.toggleArrow i:before {content:""; position:absolute; left:50%; top:50%; width:12px; height:12px; margin-left:-6px; margin-top:-6px; background-image:url("../images/common/icon_button_arrow.svg"); background-repeat:no-repeat; background-position:center; background-size:100% auto; filter: invert(7%) sepia(8%) saturate(4550%) hue-rotate(197deg) brightness(96%) contrast(98%); aspect-ratio:1/1; transform:rotate(180deg); transition:0.3s;}
.decotitle.toggleArrow.open i::before {transform:rotate(0deg);}
.decotitle .d_buttonwrap {position:absolute; right:0; top:0;}
.decotitle .d_buttonwrap {display:inline-block;}
.decotitle .d_buttonwrap li {display:inline-block; float:left;}
.decotitle .d_buttonwrap li + li {margin-left:5px;}
.decotitle .d_buttonwrap li .d_button {display:inline-block; position:relative; padding:0 15px; border-radius:20px; background-color:#F1F1F6; font-size:15px; font-weight:600; color:#111327; line-height:30px; letter-spacing:-0.5px; text-decoration:none !important;}
.decotitle .d_buttonwrap li .d_button i {display:inline-block; position:relative; top:0; width:12px; height:12px; margin-right:5px; background-repeat:no-repeat; background-position:center; background-size:100% auto; filter: invert(7%) sepia(8%) saturate(4550%) hue-rotate(197deg) brightness(96%) contrast(98%); pointer-events:none;}
.decotitle .d_buttonwrap li .d_button i.gallery {background-image:url("../images/common/icon_gallery.svg");}
.decotitle .d_buttonwrap li .d_button i.list {background-image:url("../images/common/icon_list.svg");}
.decotitle .d_buttonwrap li.on .d_button,
.decotitle .d_buttonwrap li:hover .d_button {background-color:#101111; color:#fff;} 
.decotitle .d_buttonwrap li.on .d_button i,
.decotitle .d_buttonwrap li:hover .d_button i {filter: invert(99%) sepia(35%) saturate(240%) hue-rotate(179deg) brightness(116%) contrast(100%);} 

.datepicker {display:inline-block; position:relative;}
.datepicker input {display:inline-block; box-sizing:border-box; width:120px; height:30px; padding-left:10px; padding-right:27px; border-radius:5px; background-color:#F1F1F6; border:#E4E4EE solid 1px; font-size:14px; font-weight:500; color:#111327; line-height:30px;}
.datepicker i {position:absolute; right:10px; top:50%; width:12px; height:12px; margin-top:-6px; background-image:url("../images/common/icon_cal.svg"); background-repeat:no-repeat; background-position:center; background-size:100% auto; filter: invert(7%) sepia(8%) saturate(4550%) hue-rotate(197deg) brightness(96%) contrast(98%); pointer-events:none;}
.datepicker label {margin-right:10px;}
.datepicker + span {margin:0 10px;}

/* 서식 */
.template {display:inline-block; vertical-align:middle; width:100%; text-align:left; word-wrap:normal; word-break:keep-all;}
.template > h4 {display:block; position:relative; width:auto; margin-top:30px; padding-left:20px; font-size:20px; font-weight:500; color:#101111; line-height:30px;}
.template > h4:first-child {margin-top:0;}
.template > h4:before {content:""; display:inline-block; vertical-align:middle; position:absolute; left:0; top:8px; width:6px; height:6px;border-radius:50%; border:#afb1b0 solid 3px;}
.template > strong {display:block; position:relative; width:auto; margin-top:20px; margin-left:25px; font-size:14px; font-family:'Noto Sans KR'; font-weight:500; color:#777; line-height:24px;}
.template > p {display:block; position:relative; width:auto; margin-top:10px; margin-left:25px; font-size:14px; font-family:'Noto Sans KR'; font-weight:400; color:#777; line-height:24px;}
.template > .box {margin-top:20px; margin-left:25px; padding:20px 25px; border:#e6e6e6 solid 1px; background-color:#f9f9f9; font-size:14px; font-family:'Noto Sans KR'; font-weight:400; color:#777; line-height:24px;}
.template strong {font-weight:500; color:#101111;}
.template a {color:#101111;}
.template a:hover {text-decoration:underline; text-decoration-color:rgba(0, 174, 239, 0.7);}
.template > ul {display:block; position:relative; width:auto; margin-top:10px; margin-left:25px; font-size:14px; font-family:'Noto Sans KR'; font-weight:400; color:#777; line-height:24px;}
.template > ul > li {position:relative; margin:5px 0; padding-left:10px;}
.template > ul > li:before {content:""; position:absolute; left:0px; top:11px; width:3px; height:3px; border-radius:50%; background-color:#999;}
.template > ul > li > ul {display:block; position:relative; width:auto; margin:5px 15px; font-size:12px; font-family:'Noto Sans KR'; font-weight:400; color:#999; line-height:22px;}
.template > ul > li > ul > li {position:relative; padding-left:10px;}
.template > ul > li > ul > li:before {content:""; position:absolute; left:0px; top:11px; width:4px; height:1px; background-color:#999;}
.template > ul > li > p {display:block; position:relative; width:auto; margin:5px 15px; padding-left:10px; font-size:12px; font-family:'Noto Sans KR'; font-weight:400; color:#999; line-height:22px;}
.template > ul > li > p:before {content:""; position:absolute; left:0px; top:10px; width:4px; height:1px; background-color:#999;}
.template > .table {margin-top:10px; margin-left:25px;}


/* sns */
.commonsns {display:inline-block;}
.commonsns ul {display:inline-block; width:100%;}
.commonsns ul li {display:inline-block; position:relative; float:left; width:50px; height:auto; aspect-ratio:1/1}
.commonsns ul li + li {margin-left:40px;}
.commonsns ul li a {position:absolute; left:0; right:0; top:0; bottom:0; z-index:0;}
.commonsns ul li a i {position:absolute; left:0; right:0; top:0; bottom:0; z-index:0; background-image:url("/images/common/icon_sns_header.svg"); background-repeat:no-repeat; background-size:200% auto; transition:0.3s;}
.commonsns ul li a:before {content:""; position:absolute; left:0; right:0; top:0; bottom:0; z-index:-1; border-radius:10px; background-color:#3843D0;  opacity:0; transition:0.3s;}
.commonsns ul li a i.blog {background-position:left 0;}
.commonsns ul li a i.instar {background-position:left 33.333%;}
.commonsns ul li a i.youtube {background-position:left 66.666%;}
.commonsns ul li a i.x {background-position:left 100%;}
.commonsns ul li a:hover:before{opacity:1;}
.commonsns ul li a:hover i.blog {background-position:right 0;}
.commonsns ul li a:hover i.instar {background-position:right 33.333%;}
.commonsns ul li a:hover i.youtube {background-position:right 66.666%;}
.commonsns ul li a:hover i.x {background-position:right 100%;}


/* 팝업 */
.popup {position:fixed; left:0; right:0; top:-100%; bottom:100%; z-index:999999; width:auto !important; height:auto !important; background:rgba(14, 14, 14, 0.9); opacity:0; pointer-events:none;}
.popup.on {top:0; bottom:0; opacity:1; pointer-events:auto;}
.popup.off {top:-100%; bottom:100%; opacity:0; pointer-events:auto;}
.popup .p_bg {position:absolute; left:0; right:0; top:0; bottom:0; cursor:pointer;}
.popup .p_body {position:absolute; left:50%; top:80px; bottom:80px; box-sizing:border-box; width:1040px; margin-left:-520px; padding:50px 60px; border-radius:30px; background-color:#fff; text-align:center;}
.popup .p_body .p_close {position:absolute; left:50%; top:-70px; width:60px; height:60px; margin-left:-30px; border-radius:50%; background-color:#fff;}
.popup .p_body .p_close:before {content:""; position:absolute; left:50%; top:50%; width:16px; height:16px; margin-left:-8px; margin-top:-8px; background-image:url("../images/common/icon_close.svg"); background-repeat:no-repeat; background-position:center; background-size:100% auto; filter: invert(7%) sepia(8%) saturate(4550%) hue-rotate(197deg) brightness(96%) contrast(98%); transition:0.3s;}
.popup .p_body .p_close:hover::before {transform:rotate(90deg);}
.popup .p_body .p_content {display:inline-block; overflow-x:hidden; overflow-y:auto; width:100%; height:calc(100% - 70px);}
.popup .p_body .p_list + .p_title {margin-top:10px;}
.popup .p_body .p_list {display:none; width:100%; padding-bottom:20px;}
.popup .p_body .p_title.toggleArrow.open + .p_list {display:inline-block;}
.popup .p_body .p_list ul {display:inline-block; width:calc(100% + 10px); margin-left:-5px;}
.popup .p_body .p_list li {display:inline-block; position:relative; float:left; box-sizing:border-box; width:20%; padding:5px}
.popup .p_body .p_list li .pl_more {display:inline-block; position:relative; box-sizing:border-box; width:100%; border-radius:10px; border:#F1F1F6 solid 1px; aspect-ratio:16/9; background-repeat:no-repeat; background-position:center; background-size:cover; pointer-events:auto; cursor:pointer;}
.popup .p_body .p_list li .pl_more .checkbox {position:absolute; left:10px; top:10px;}
.popup .p_body .p_list li .pl_more .checkbox label {height:24px;}
.popup .p_body .p_list li .pl_more .checkbox label:before {top:0; margin-top:0;}
.popup .p_body .p_list li .pl_more .state {position:absolute; right:10px; bottom:10px; box-sizing:border-box; height:34px; padding:0 15px; border-radius:17px; background-color:#2A85FF; border:transparent solid 2px; color:#fff; line-height:30px; pointer-events:none;}
.popup .p_body .p_list li .pl_more .state.t2 {background-color:#FF6A55;}
.popup .p_body .p_list li .pl_more .state.t3 {background-color:#fff; border-color:#FF6A55; color:#FF6A55;}
.popup .p_body .p_button {display:inline-block; width:100%; margin-top:30px;}
.popup .p_body .p_button ul {display:inline-block;}
.popup .p_body .p_button li {float:left; padding:0 5px;}
.popup .p_body .p_button li .button {padding:0 20px; min-width:120px;}
.popup .p_body .p_pic {display:inline-block; position:relative; overflow:hidden; width:100%; height:auto; border-radius:10px; border:#F1F1F6 solid 1px; font-size:0; line-height:0;}
.popup .p_body .p_pic img {width:100%; height:auto;}
.popup.t2 .p_body {padding-left:30px; padding-right:30px;}
.popup.t2 .p_body .p_box {display:inline-block; position:relative; box-sizing:border-box; width:100%; padding:0 90px;}
.popup.t2 .p_body .decotitle {width:calc(100% - 90px); margin-left:90px; padding-right:80px;}
.popup.t2 .p_body .p_nav {position:absolute; left:10px; right:10px; top:50%; height: 40px;}
.popup.t2 .p_body .p_nav button {display:inline-block; float:left; position:relative; width:40px; height:40px; border-radius:50%; background-color:#111327; transition:0.3s}
.popup.t2 .p_body .p_nav button:hover {transform:scale(1.1);}
.popup.t2 .p_body .p_nav button.next {float:right;}
.popup.t2 .p_body .p_nav button i {position:absolute; left:50%; top:50%; width:16px; height:16px; margin-left:-8px; margin-top:-8px; background-repeat:no-repeat; background-position:center; background-size:100% auto; filter:invert(99%) sepia(35%) saturate(240%) hue-rotate(179deg) brightness(116%) contrast(100%);}
.popup.t2 .p_body .p_nav button.prev i {background-image:url("../images/common/icon_arrow_prev.svg");}
.popup.t2 .p_body .p_nav button.next i {background-image:url("../images/common/icon_arrow_next.svg");}

.popup table {display:table; width:100%; max-width:800px; margin-left:90px; margin-top:10px; border-right:#E4E4EE solid 1px; border-bottom:#E4E4EE solid 1px;}
.popup table th {background-color:#F1F1F6;}
.popup table td div {display:inline-block; float:left;}
.popup table th,
.popup table td {padding:5px 15px; border-left:#E4E4EE solid 1px; border-top:#E4E4EE solid 1px; font-size:14px; font-weight:700; color:#111327; line-height:30px; letter-spacing:-0.5px; word-break:keep-all;}
.popup table.t2 td {padding:5px;} 
.popup table td .checkbox + .checkbox {margin-left:15px;}
.popup table span {display:inline-block;}



.popup.w400 .p_box {width:400px; margin-left:-200px;}.popup.w450 .p_box {width:450px; margin-left:-225px;} .popup.w500 .p_box {width:500px; margin-left:-250px;} .popup.w550 .p_box {width:550px; margin-left:-275px;} .popup.w600 .p_box {width:600px; margin-left:-300px;} .popup.w650 .p_box {width:650px; margin-left:-325px;} .popup.w700 .p_box {width:700px; margin-left:-350px;} .popup.w750 .p_box {width:750px; margin-left:-375px;} .popup.w800 .p_box {width:800px; margin-left:-400px;} .popup.w850 .p_box {width:850px; margin-left:-425px;} .popup.w900 .p_box {width:900px; margin-left:-450px;} .popup.w950 .p_box {width:950px; margin-left:-475px;} .popup.w1000 .p_box {width:1000px; margin-left:-500px;} .popup.w1100 .p_box {width:1100px; margin-left:-550px;} .popup.w1200 .p_box {width:1200px; margin-left:-600px;}
.popup.w50p .p_box {left:25%; right:25%; width:auto; margin-left:0;} .popup.w60p .p_box {left:20%; right:20%; width:auto; margin-left:0;} .popup.w70p .p_box {left:15%; right:15%; width:auto; margin-left:0;} .popup.w80p .p_box {left:10%; right:10%; width:auto; margin-left:0;} .popup.w90p .p_box {left:5%; right:5%; width:auto; margin-left:0;}
.popup.h300 .p_box {height:300px; margin-top:-150px;} .popup.h350 .p_box {height:350px; margin-top:-175px;} .popup.h400 .p_box {height:400px; margin-top:-200px;} .popup.h450 .p_box {height:450px; margin-top:-225px;} .popup.h500 .p_box {height:500px; margin-top:-250px;} .popup.h550 .p_box {height:550px; margin-top:-275px;} .popup.h600 .p_box {height:600px; margin-top:-300px;} .popup.h650 .p_box {height:650px; margin-top:-325px;} .popup.h700 .p_box {height:700px; margin-top:-350px;} .popup.h750 .p_box {height:750px; margin-top:-375px;} .popup.h800 .p_box {height:800px; margin-top:-400px;}
.popup.h50p .p_box {top:25%; bottom:25%; height:auto; margin-top:0;} .popup.h60p .p_box {top:20%; bottom:20%; height:auto; margin-top:0;} .popup.h70p .p_box {top:15%; bottom:15%; height:auto; margin-top:0;} .popup.h80p .p_box {top:10%; bottom:10%; height:auto; margin-top:0;} .popup.h90p .p_box {top:5%; bottom:5%; height:auto; margin-top:0;}



/* 버튼 */
.btn {display:inline-block; vertical-align:middle; position:relative; box-sizing:border-box; width:200px; height:60px; outline:none; border:rgba(13,13,14,0.2) solid 1px; text-align:left; transition:0.3s; -webkit-transition:0.3s;}
.btn.icon {padding-left:50px;}
.btn:hover {border:#101111 solid 1px;}
.btn:before {content:""; position:absolute; left:-1px; width:1px; height:100%; background-color:transparent; transition:0.3s; -webkit-transition:0.3s;}
.btn:hover:before {left:0; width:100%; background-color:#101111;}
.btn span {display:inline-block; vertical-align:middle; position:relative; font-size:15px; font-weight:300; color:#101111; line-height:58px; letter-spacing:-1px;}
.btn:hover span {color:#fff;}
.btn.icon span:after {content:""; position:absolute; left:-38px; top:50%; width:28px; height:28px; margin-top:-14px; background-image:url("../images/project/icon_inquery.png"); background-repeat:no-repeat; background-size:200% auto;}
.btn.icon.i_call {background-position:left top;}
.btn.icon.i_call:hover span:after {background-position:right top;}





@media all and (max-width:1024px) {
/* 영역구분 */
.wrap {padding:0 40px;}


/* button */
.button {width:120px; height:40px; border-radius:20px; font-size:16px; line-height:36px;}
.button.t1 {padding:0 20px;}

.popup .p_body {left:30px; right:30px; margin-left:0; width:auto;}
}





@media all and (max-width:768px) {
/* 영역구분 */
.wrap {padding: 0 25px;}

.title {font-size:45px; line-height:55px;}
}