﻿@charset "utf-8";
@import url('/css/font.css');
@import url('/css/remixicon.css');
@import url('/css/xeicon.css');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/* Reset */
*{margin:0; padding:0; box-sizing:border-box;}
*:focus { outline:none; }
html, body { font-family:'SUIT','Noto Sans KR','나눔고딕', 'Nanum Gothic', 'sans-serif';color:#555555; -webkit-text-size-adjust:none;text-size-adjust:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale; line-height:1;  word-break: keep-all; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-backface-visibility: hidden;}
html, body, div, span, form, input, select, button, textarea, legend, fieldset, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, blockquote, address, p, th, td, caption {margin:0;padding:0}
ol, ul, li {list-style:none;}
em, dt, dd, address, i {font-style:normal}
img {vertical-align:top}
img, fieldset {border:0 none;}
button {border:0 none;background:transparent;cursor:pointer;}
hr {display:none;}
legend, .skip, .blind, .skip_nav, .hide {width:0;height:0;visibility:hidden;font-size:0;line-height:0;position:absolute;top:0;left:-9999em;overflow:hidden;}
table caption {display:none}
table {border-collapse:collapse;border-spacing:0; width:100%;}
header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {display:block;}
a{color:inherit}
a:link, a:visited {text-decoration:none; }
a:hover, a:active {text-decoration:none}
h1, h2, h3, h4, h5, h6{font-family: inherit;  font-size: inherit; font-weight: 600;color: inherit;margin: 0;line-height: 1.5;}
input, textarea, select {border-radius:0;-webkit-appearance:none; font-family: inherit; font-size: 0.85rem; letter-spacing: 0em; color: inherit;	padding: 0; outline: none;}
button {border:0; cursor: pointer;}

.clearfix { display:block; }
.clearfix:after { display:block; clear:both; content:"."; visibility:hidden; height:0; }

.score{font-family: 's-core-dream';}

/* 입력 스타일 */
input{appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;}
input[type="checkbox"]{vertical-align:middle; display: inline-block; width: 1rem;  height: 1rem; border: 1px solid var(--gray-c2) ; border-radius: 5px; background-color:#fff;}
input[type="checkbox"]:checked{background:var(--blue) url('/images/content/icon_check_w.svg')no-repeat 50% 50%; background-size:0.8rem 0.8rem; border: 1px solid var(--blue);}
input[type="checkbox"]:disabled{background:var(--gray-c2); border-color:var(--gray-7)}
input[type="checkbox"]:checked:disabled{background:var(--gray-c2) url('/images/content/icon_check_g.svg')no-repeat 50% 50%; background-size:0.8rem 0.8rem; border-color:#ddd}

input[type="radio"] { display: inline-block; width: 1rem;  height: 1rem; border: 1px solid var(--gray-c2) ; border-radius: 50%; background-color:#fff; vertical-align:middle}
input[type="radio"]:checked{background:var(--blue) url('/images/content/icon_check_w.svg')no-repeat 50% 50%; background-size:0.8rem 0.8rem; border: 1px solid var(--blue);}
input[type="radio"]:disabled{background:var(--gray-c2) ;border-color:var(--gray-7)}
input[type="radio"]:checked:disabled{background:var(--gray-c2) url('/images/content/icon_check_g.svg')no-repeat 50% 50%; background-size:0.8rem 0.8rem; border-color:#ddd}

input[type="password"],
input[type="text"] {-webkit-appearance:none; width:100%; background:#fff;  border:1px solid #b3b3b3; -webkit-appearance: none; box-shadow: none; padding: 0px 0.5rem;  box-sizing:border-box;  height: 2rem; text-align:left;}
select {height:2rem; line-height:2rem; padding:0 1.5rem 0 0.5rem;font-family: inherit; background:#fff url("/images/content/sel_icon.svg") no-repeat right+0.5rem center; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #b3b3b3; border-radius: 0px; vertical-align:middle;}
select::-ms-expand { /* for IE 11 */   display: none;}
textarea{padding:0.4rem; width:100%; box-sizing:border-box; vertical-align:middle; line-height:1.5; background:#fff; border:1px solid #b3b3b3;  color:#898989; -webkit-appearance: none; box-shadow: none; border-radius:0; resize: vertical; }

iframe{border:none;}

/*safari input*/
input[type='button'],
input[type='submit'] { -webkit-appearance: none; }

/* IPHONE */
input:disabled, textarea:disabled { opacity: 1; -webkit-text-fill-color: inherit; }
input[type="text"], input[type="password"] { -webkit-appearance: none;  }


:-ms-input-placeholder{color:$color-dusty-gray !important;}/* Internet Explorer 10-11 */
::-ms-input-placeholder{color:$color-dusty-gray !important;}/* Microsoft Edge */
::placeholder{color:$color-dusty-gray;opacity:1;}/* Chrome, Firefox, Opera, Safari 10.1+ */


/* 아이폰(사파리) 터치 메뉴 활성화 관련 */
a, button,
[role=button], [role=link], [role=tab] {-webkit-touch-callout:none;}


/*basic*/
.clear {clear:both;}
.of{overflow:hidden;}
.blind{display:none;}


/*width*/
.w0 { width:0% !important; }
.w10 { width:10% !important; }
.w20 { width:20% !important; }
.w22 { width:22% !important; }
.w30 { width:30% !important; }
.w40 { width:40% !important; }
.w45 { width:45% !important; }
.w50 { width:50% !important; }
.w60 { width:60% !important; }
.w70 { width:70% !important; }
.w80 { width:80% !important; }
.w90 { width:90% !important; }
.w100 { width:100% !important; }


/*margin-top*/
.mt100 {margin-top:100px !important;}
.mt90 {margin-top:90px !important;}
.mt80 {margin-top:80px !important;}
.mt70 {margin-top:70px !important;}
.mt60 {margin-top:60px !important;}
.mt50 {margin-top:50px !important;}
.mt40 {margin-top:3rem !important;}
.mt30 {margin-top:30px !important;}
.mt20 {margin-top:20px !important;}
.mt10 {margin-top:10px !important;}
.mt5 {margin-top:5px !important;}
.mt0 {margin-top:0 !important;}

/*divide*/
.divide0 { width: 100%; height: 0px;}
.divide2 { width: 100%; height: 2px;}
.divide3 { width: 100%; height: 3px;}
.divide5 { width: 100%; height: 5px;}
.divide10 {width: 100%; height: 10px;}
.divide15 {width: 100%; height: 15px;}
.divide20 {width: 100%; height: 20px;}
.divide25 {width: 100%; height: 25px;}
.divide30 {width: 100%; height: 30px;}
.divide35 {width: 100%; height: 35px;}
.divide40 {width: 100%; height: 40px;}
.divide45 {width: 100%; height: 40px;}
.divide50 {width: 100%; height: 50px;}
.divide55 {width: 100%; height: 55px;}
.divide60 {width: 100%; height: 60px;}
.divide65 {width: 100%; height: 65px;}
.divide70 {width: 100%; height: 70px;}
.divide75 {width: 100%; height: 75px;}
.divide80 {width: 100%; height: 80px;}
.divide85 {width: 100%; height: 85px;}

.rm0 { margin-right: 0px}
.rm1 { margin-right: 1px}
.rm2 { margin-right: 2px}
.rm5 { margin-right: 5px}
.rm10 {margin-right: 10px}
.rm15 {margin-right: 15px}
.rm20 {margin-right: 20px}
.rm25 {margin-right: 25px}
.rm30 {margin-right: 30px}
.rm40 {margin-right: 40px}
.rm50 {margin-right: 50px}
.lm0 { margin-left: 0px}
.lm1 { margin-left: 1px}
.lm5 { margin-left: 5px}
.lm7 { margin-left: 7px}
.lm10 {margin-left: 10px}
.lm15 {margin-left: 15px}
.lm20 {margin-left: 20px}
.lm25 {margin-left: 25px}
.lm30 {margin-left: 25px}
.lm40 {margin-left: 40px}
.mb10 {margin-bottom: 10px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.bm0 { margin-bottom: 0px !important;}
.rp5 { padding-right: 5px}
.rp10 {padding-right: 10px}
.rp15 {padding-right: 15px}
.rp20 {padding-right: 20px}
.rp30 {padding-right: 30px}
.rp50 {padding-right: 50px}
.lp0 { padding-left: 0px}
.lp10 {padding-left: 10px}
.lp20 {padding-left: 20px}
.lp30 {padding-left: 30px}
.lp50 {padding-left: 50px}
.tp0 { padding-top: 0 !important}
.tp3 { padding-top: 3px}
.tp5 { padding-top: 5px}
.tp10 {padding-top: 10px}
.tp20 {padding-top: 20px}
.tp30 {padding-top: 30px}
.tm4 { margin-top: 4px}
.tm5 { margin-top: 5px}
.tm7 { margin-top: 7px}
.tm10 {margin-top: 10px}
.tm15 {margin-top: 15px}
.tm20 {margin-top: 20px}
.tm30 {margin-top: 30px}
.mbm1 {margin-bottom: -1px}
.bp0 { padding-bottom: 0 !important}
.bp10 {padding-bottom: 10px !important}
.bp20 {padding-bottom: 20px !important;}
.boximageon { margin-bottom: 0 !important}
.bm5 { margin-bottom: 5px !important}
.bm10 {margin-bottom: 10px !important}
.boximageoff { margin-bottom: 15px !important}
.bm20 {margin-bottom: 20px !important}
.bm30 {margin-bottom: 30px !important}
.bm50 {margin-bottom: 50px !important}
.bp50 {padding-bottom: 50px !important}

/*float*/
.fl {float:left !important;}
.fr {float:right !important;}
.fn {float:none !important;}

/*text-align*/
.ac {text-align:center !important;}
.al {text-align:left !important;}
.ar {text-align:right !important; justify-content: flex-end !important;}
.aj {text-align:justify !important;}

/*text-decoration*/
.tdo {text-decoration:overline;}
.tdl {text-decoration:line-through;}
.tdo {text-decoration:underline;}



@media (max-width:767px){
select{min-width:auto;}
/* Prevent Zoom in when foucing input */
input, select, textarea {font-size:15px !important;}

}


/*-----------------------------------------------------------------------------------*/
/*	BUTTON
/*-----------------------------------------------------------------------------------*/
.btn,
.parallax .btn-submit,
.btn-submit {
    color: #fff !important;
    background: #1abb9c;
    margin-bottom: 10px;
    margin-right: 4px;
    padding: 0 0.85rem;
    font-weight: 800;
    text-shadow: none;
    border: none;
    -webkit-border-radius: 0;
    border-radius: 0.1rem;
    height:2.4rem;
    text-transform: uppercase;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    display: inline-flex;
    align-items:center;
    justify-content:center;
    flex-direction:row;
    letter-spacing: 1px;
}
.btn-xlarge {
    height: 3.2rem !important;
    line-height: 3rem !important;
    padding: 0 1.2rem !important;
}
.btn-large {
    height: 2.8rem !important;
    line-height: 2.6rem !important;
    padding: 0 1rem !important;
}
.btn-s {
    padding: 0 0.6rem !important;
    height: 2rem !important;
    line-height: 1.8rem !important;
    font-size: var(--font15) !important;
}
.btn-xs {
    padding: 0 0.5rem !important;
    height: 1.5rem !important;
    line-height: 1.3rem !important;
    font-size: var(--font15) !important;
}

.btn.btn-green {
    background: #1abb9c
}
.btn.btn-blue {
    background: #3f8dbf
}
.btn.btn-red {
    background: #e8554e
}
.btn.btn-orange {
    background: #ee7757
}
.btn.btn-purple {
    background: #9b59b6
}
.btn.btn-pink {
    background: #d487be
}
.btn.btn-gray {
    background: #95a5a6
}
.btn:hover,
.btn:focus,
.btn:active,
.btn.active,
.parallax .btn-submit:hover {
    background: #17a78b;
    color: #fff !important;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.btn-green:hover,
.btn-green:focus,
.btn-green:active,
.btn-green.active {
    background: #17a78b !important
}
.btn-blue:hover,
.btn-blue:focus,
.btn-blue:active,
.btn-blue.active {
    background: #387eaa !important
}
.btn-red:hover,
.btn-red:focus,
.btn-red:active,
.btn-red.active {
    background: #cf4c45 !important
}
.btn-orange:hover,
.btn-orange:focus,
.btn-orange:active,
.btn-orange.active {
    background: #d96c4f !important
}
.btn-purple:hover,
.btn-purple:focus,
.btn-purple:active,
.btn-purple.active {
    background: #8a4fa2 !important
}
.btn-pink:hover,
.btn-pink:focus,
.btn-pink:active,
.btn-pink.active {
    background: #bd78a9 !important
}
.btn-gray:hover,
.btn-gray:focus,
.btn-gray:active,
.btn-gray.active {
    background: #859394 !important
}
.color-wrapper .btn {
    background: #FFF !important;
    color: #616161 !important;
}
.color-wrapper .btn:hover {
    background: #e9e9e9 !important
}
.share .btn {
    background: none;
    padding: 8px 17px;
}
.share .btn:hover {
    color: #FFF !important
}
.btn.share-facebook {
    color: #3d5b9b !important;
    border: 1px solid #3d5b9b !important;
}
.btn.share-facebook:hover {
    background: #334c8e !important;
    border: 1px solid #334c8e !important;
}
.btn.share-twitter {
    color: #5aa8cd !important;
    border: 1px solid #5aa8cd !important;
}
.btn.share-twitter:hover {
    background: #499ac8 !important;
    border: 1px solid #499ac8 !important;
}
.btn.share-googleplus {
    color: #3b3b3b !important;
    border: 1px solid #3b3b3b !important;
}
.btn.share-googleplus:hover {
    background: #2e2e2e!important;
    border: 1px solid #2e2e2e !important;
}
.btn.share-pinterest {
    color: #c53942 !important;
    border: 1px solid #c53942 !important;
}
.btn.share-pinterest:hover {
    background: #bc2d32 !important;
    border: 1px solid #bc2d32 !important;
}

.text-danger{color:var(--danger);}