@charset "utf-8";

/*font
normal : 16px
small : 13px*/
/* body {min-width: 1400px;} */
html, body {line-height:1.5; font-size: 16px; color: #111; letter-spacing: -0.05rem;}
html {-ms-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; /*max-width: 1920px;*/ min-width: 360px; width: 100%;}
body {overflow-x: hidden; font-family: 'Pretendard', sans-serif;}
a{color: #111; text-decoration: none;}
img{max-width:100%; vertical-align: middle;}
i{font-style:inherit;}
hr{border:1px dashed #ddd; border-width:0 0 1px 0; margin:20px 0;}
[lang="en"] {font-family: 'Pretendard', sans-serif; letter-spacing: normal;}
ul, dl {font-size: 0;}

/* form control */
input, 
select, 
textarea, 
label{display:inline-block; box-sizing:border-box; width:auto; vertical-align:middle; line-height:1.4; margin: 3px 4px; border-radius:0;}
input[type=text],
input[type=tel],
input[type=email],
input[type=password],
input[type=url],
input[type=submit],
input[type=button],
input[type=number],
select{-webkit-appearance: none;-moz-appearance: none; appearance: none; -moz-box-sizing: border-box; box-sizing: border-box; height:50px; padding: 0 10px; outline: none; background: transparent; border:0; border:1px solid #eee; font-family: 'Pretendard', sans-serif; background-color: #fff;}
select {background:url(/images/page/common/icon_select.png) no-repeat; background-position: calc(100% - 10px) center; background-size: 10px auto;}
input[type=radio]{border-radius: 100%;}
input:disabled,
input:-moz-read-only{background: #f8f9fb;border-color: #eee;-webkit-box-shadow: none;box-shadow: none;}
input[readonly],
input[disabled]{background: #fff !important;}
.datepicker[readonly],
.datepicker[disabled]{background-color: #f9f9f9;}
select::-ms-expand{display: none;}
textarea{resize:none; font-family: 'Pretendard', sans-serif; border: 1px solid #eee; padding: 10px 10px;}
textarea:focus {outline: none;}
input[type=submit],
button{font-size:inherit; font-family: 'Pretendard', sans-serif; cursor: pointer;}
input[lang="en"],
textarea[lang="en"],
button[lang="en"] {font-family: 'Pretendard', sans-serif;}

/* 자동완성 배경색 */
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px transparent inset;}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s;}

.input60{width:60px !important;}
.input80{width:80px !important;}
.input100{width:100px !important;}
.input120 {width: 120px !important;}
.input200{width:200px !important;}
.input300{width:300px !important;}
.input400{width:400px !important;}
.inputFull{width:100% !important;}

/* margin */
.mr5{margin-right: 5px !important;}
.mr10{margin-right: 10px !important;}
.mb10 {margin-bottom: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}
.mt60 {margin-top: 60px !important;}

/* checkbox */
.checkbox {display: inline-block;}
.checkbox input[type="checkbox"] {display: none;}
.checkbox label {position: relative; display: inline-block; min-width: 20px; height: 20px;}
.checkbox label > span {color: #999; padding-left: 28px;}
.checkbox label:before,
.checkbox label:after {content: ''; position: absolute; top: 0; left: 0; width: 20px; height: 20px; border: 1px solid #ddd; border-radius: 0; box-sizing: border-box;}
.checkbox label:before {transition: all .2s linear; background-color: #fff;}
.checkbox input:checked + label:before {border: 2px solid #0033c3;}
.checkbox input:checked + label:after {content: ''; height: 8px; width: 8px; position: absolute; top: 50%; left: 6px; margin-top: -4px; background-color: #0033c3; border-color: #0033c3;}
.checkbox input:checked + label > span {color: #333;}


/* radio button */
.radio {display: inline-block;}
.radio input[type="radio"] {display: none;}
.radio label {position: relative; display: inline-block; min-width: 20px; height: 20px;}
.radio label > span {color: #666; padding-left: 28px;}
.radio label:before {content: ''; position: absolute; top: 0; left: 0; width: 18px; height: 18px; border: 1px solid #ddd; background-color: #fff; border-radius: 50%; transition: all .2s linear;}
.radio input:checked + label:before {border-color: #0033c3; background: #0033c3;}
.radio input:checked + label:after {content: ''; position: absolute; top:50%; left:8px; margin-top: -5px; width:3px; height:7px; border: solid #fff; transform:rotate(45deg); -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); border-width:0 2px 2px 0;}


/* file */
.file{position:relative;}
.file input[type="file"]{overflow:hidden; position:absolute; margin:-1px; width:1px; height:1px; clip:rect(0,0,0,0);}

/*table*/
table{border-collapse: collapse; border-spacing: 0;}
table,th,td{border:none;}
caption{overflow:hidden; line-height:0; text-indent:-2000em;}

/* placeholder */
::-webkit-input-placeholder {font-family: 'Pretendard', sans-serif; font-size: inherit;color: #999;}
::-moz-placeholder {font-family: 'Pretendard', sans-serif; font-size: inherit;color: #999;}
:-ms-input-placeholder {font-family: 'Pretendard', sans-serif; font-size: inherit;color: #999;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {color: transparent;}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {color: transparent;}
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder {color: transparent;}

/*button*/
.btn_wrap {position: relative; padding:40px 0 0; text-align:center;}
.btn_wrap:after{content:""; display: block; clear: both;}

.btn {display:inline-block; overflow:hidden; position:relative; height:50px; padding:0 14px; margin: 0 5px; border-radius: 10px; background: #999; font-weight: 400; color:#fff; text-align:center; vertical-align:middle; transition:all 0.35s;}
.btn:first-child {margin-left: 0;}
.btn span {position:relative; font-size: 1rem; z-index:2; line-height:48px; vertical-align: middle;}
.btn.primary {background-color: #0033c3;}
.btn.gray {background-color: #35337f;}
.btn.black{background-color: #333;}
.btn.white{background-color: #fff;}
.btn.white span {color: #111; font-weight: 200;}

.btn_wrap .btn_left{float: left;}
.btn_wrap .btn_right{float: right;}

/* btn hover */
.btn:hover,
.btn:focus{box-shadow:3px 3px 5px rgba(0,0,0,.1); opacity: .8;}
.btn.white:hover,
.btn.white:focus{box-shadow:3px 3px 5px rgba(0,0,0,.1);}

.btn-line.blue:hover {background-color: #0044a0;}
.btn-line.blue:hover span {color: #fff;}
.btn-line.purple:hover {background-color: #4840bb;}
.btn-line.purple:hover span {color: #fff;}

/* slider arrow */
.control_box .ctrl{width:54px; height:54px; background: transparent no-repeat 50% 50%; background-size:36px auto; cursor: pointer; -webkit-transition: background .3s; -moz-transition: background .3s; -ms-transition: background .3s; -o-transition: background .3s; transition: background .3s;}
.control_box .ctrl_prev{background-image:url(/images/page/common/icon_arw_left.svg);}
.control_box .ctrl_next{background-image:url(/images/page/common/icon_arw_right.svg);}
.control_box .ctrl_prev.white{background-image:url(/images/page/common/icon_arw_left_white.svg);}
.control_box .ctrl_next.white{background-image:url(/images/page/common/icon_arw_right_white.svg);}

/*tac*/
.tac{text-align: center !important;}
.tar{text-align: right !important;}
.tal{text-align: left !important;}

.point {color: #0033c3 !important;}
.red {color: #dc4252 !important;}
.blue {color: #1c96cc !important;}
.highlight {display: inline; color: #0033c3; border-bottom: 2px solid rgba(61, 99, 204, .3); box-shadow: inset 0 -8px 0 rgba(61, 99, 204, .3)}

.marking {position: relative;}
.marking:after {content: '\002A'; color: #dc4252; font-weight: 400;}

.sr_only{overflow:hidden; position:absolute; margin:-1px; width:1px; height:1px; clip:rect(0,0,0,0);}

::-moz-selection {background: #0033c3; color:#fff;}
::selection {background: #0033c3;  color:#fff;}
::-moz-selection {background: #0033c3; color:#fff;}

/*주석*/
.ellip{overflow:hidden; display:block; width:100%; white-space:nowrap; word-wrap:normal; text-overflow:ellipsis;}
.ellip2{overflow:hidden; display:-webkit-box; line-height:1.4em; max-height:2.8em; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; text-overflow:ellipsis;}

/* scroll bar */
::-webkit-scrollbar {width: 6px; height: 6px;}
::-webkit-scrollbar-thumb {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);}
::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);}

.pointer {cursor: pointer;}

/* **************************************** *
 * responsive
 * **************************************** */
@media (max-width:1600px){
	.control_box .ctrl{width: 42px; height: 42px;}
}

@media (max-width: 1400px) {

}

@media (max-width:1024px){
	.mobile_none{display: none !important;}
	.sr_not_mobile{overflow:visible; position:static; margin:0; width:auto; height:auto; clip:unset;}
	
	/*font
	normal : 15px
	small : 12px*/
	html, body {line-height:1.5; font-size: 14px;}

	.btn {min-width:92px;} /*-5*/

	.btn.bg {min-width: 120px; height: 50px; line-height:0; padding:0 10px; font-size:14px;}
	.btn.bg span {line-height: 48px;}
	.btn.bg2 {padding: 0 20px; height: 50px; line-height: 0; font-size: 14px;}
	.btn.bg2 span {line-height: 48px;}
}
@media (max-width:768px){
	input, 
	select, 
	textarea, 
	label{display:inline-block; box-sizing:border-box; width:auto; vertical-align:middle; line-height:1.4; margin: 3px 4px; border-radius:0;}
	input[type=text],
	input[type=tel],
	input[type=email],
	input[type=password],
	input[type=url],
	input[type=submit],
	input[type=button],
	input[type=number],
	select {height: 40px;}

	.input300,
	.input400 {width: 100% !important;}

	.file.mobile > input {width: calc(100% - 117px) !important;}
	
}

@media (max-width:576px){

	.btn_wrap .btn_left,
	.btn_wrap .btn_right {float: none; display: inline-block; vertical-align: middle;}

	.checkbox em {font-size: 1rem;}
	.radio em {font-size: 1rem;}
	
}

@media (max-width: 420px) {
	.input200 {width: 100% !important;}
}