@charset "utf-8";
i, em{font-style:normal}
.owl-item {float:left;}
.owl-carousel .owl-wrapper {display: none;position:relative;-webkit-transform:translate3d(0px, 0px, 0px);-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.owl-stage-outer{overflow:hidden;}
.owl-stage:after{display:block; content:"";clear:both;}
.owl-stage-outer:after{display:block; content:"";clear:both;}
.disabled{display:none}



/*=======================================================
  skipNavi
=========================================================*/
#skipNavi {height:0;}
#skipNavi .skipLink {position:absolute;top:-1000px;left:-1000px;overflow:hidden;z-index:5000;}
#skipNavi .skipLink:focus, #skipNavi .skipLink:active {top:0;left:0;padding:10px 20px;background:#1e64ba;color:#fff;}



/*=======================================================
  input & select
=========================================================*/
.field{display:inline-block;vertical-align:top; font-size:0}
.field.choice .chk-check:nth-child(n+2){margin-left:25px;}
.field.choice .chk-radio:nth-child(n+2){margin-left:25px;}


.chk-input {display:inline-block; vertical-align:top; position:relative; box-sizing:border-box;}
.chk-input input{height:54px; letter-spacing:-0.03em; border-radius:5px; border:none;background:#539891; color:#fff; padding:0 10px;font-size:18px; box-sizing:border-box; display:block; width:100%; position:relative;}
.chk-input input::placeholder{color:rgba(10,10,10,0.5); font-size:18px;}
.chk-input.readonly input{background:#ffffff; color:#28498c;}

.chk-input textarea{height:140px; letter-spacing:-0.03em; border:1px solid #e2e2e2; border-radius:5px;background:#fff; color:#111; padding:15px;font-size:15px; box-sizing:border-box; display:block; width:100%; position:relative; resize:none;}
.chk-input textarea::placeholder{color:rgba(10,10,10,0.5); font-size:14px;}
	@media only screen and (max-width:999px){
		.chk-input input{height:50px; font-size:16px}
	}
	@media only screen and (max-width:680px){
		.chk-input input{height:45px; font-size:14px}
	}
	@media only screen and (max-width:480px){
		.chk-input input{height:40px; font-size:13px}
	}
	
.chk-select{position:relative; box-sizing:border-box;display:inline-block; vertical-align:top}
.chk-select:after{background:url(../img/select-arrow.png) no-repeat center center; position:absolute; width:20px; height:30px; margin-top:-15px; right:10px; top:50%; display:block; content:""; z-index:3}
.chk-select select{font-size:18px; border:1px solid #ffff; width:100%;border-radius:5px; height:54px; color:#fff; box-sizing:border-box; letter-spacing:-0.03em; padding:0 35px 0 10px;text-indent:-1px;-webkit-appearance:none; -moz-appearance:none;background:none; appearance:none;width:100%; margin:0;  position:relative; z-index:5; cursor:pointer;}
.chk-select select::-ms-expand{display:none;}
.chk-select.active select{color:#000;}
.chk-select select option {color:#000;}

	@media only screen and (max-width:999px){
		.chk-select select{height:50px; font-size:16px}
	}
	@media only screen and (max-width:680px){
		.chk-select select{height:45px; font-size:14px}
	}
	@media only screen and (max-width:480px){
		.chk-select select{height:40px; font-size:13px}
	}

.chk-radio {display:inline-block; font-size:0px; vertical-align:top; line-height:100%; color:#000;}
.chk-radio input[type="radio"]{position: absolute; width:1px; height:1px; padding: 0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border: 0; }
.chk-radio input[type="radio"] + label{display:block; position: relative; padding-left:26px; font-size:15px; color:#1e1e1e; line-height:20px; letter-spacing:-0.03em;cursor:pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
.chk-radio input[type="radio"] + label:before { content:''; position: absolute; left:0; top:0px; width:20px; height:20px; text-align:center; background:#fff; border:1px solid #757575; border-radius:100%; box-sizing:border-box; }
.chk-radio input[type="radio"] + label:after {}
.chk-radio input[type="radio"]:checked + label:before { background:url(../img/sub/check-on.jpg) no-repeat center center #6e98fa; border-color:#6e98fa;background-size:80% auto}


.chk-check{display:inline-block; font-size:0; vertical-align:top; }
.chk-check input[type="checkbox"]{position: absolute; width:1px; height: 1px; padding: 0; margin:-1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
.chk-check input[type="checkbox"] + label{display:block; position:relative; padding-left:24px; font-size:14px; line-height:18px; color:#fff; font-weight:400; letter-spacing:-0.03em; cursor:pointer;}
.chk-check input[type="checkbox"] + label:before{content:''; position: absolute; left:0px; top:0; box-sizing:border-box;width:20px; height:20px; text-align:center; background:#fff; border-radius:6px;  }
.chk-check input[type="checkbox"]:checked + label{color:#ff;}
.chk-check input[type="checkbox"]:checked + label:before{background:url(../img/check-on.jpg) no-repeat center center #2f3c5f;background-size:100% auto}
	@media only screen and (max-width:999px){
		
	}
	@media only screen and (max-width:680px){
		.chk-check input[type="checkbox"] + label{font-size:13px;}
	}
	@media only screen and (max-width:480px){
		
	}



/* 로딩 */
#LOADINGAREA{width:100%; height:100%; position:fixed; z-index:9999;display:none;}
.loadingbg{
	position:fixed;
	top:0; background:black;
	left:0;
	width:100%;
	height:100%;
	position:fixed; z-index:9999; opacity:0.5;}
.loadingbox{
	position:fixed; top:0; left:0; right:0; bottom:0; margin:auto; z-index:99999;
	width:170px; height:174px;
	} 

/* -----------------------------------------
  =CSS3 Loading animations
-------------------------------------------- */

/* =Elements style
---------------------- */
.load-wrapp {
	position:fixed; z-index:99999;
	top:0; left:0; right:0; bottom:0;
    width: 100px;
    height: 100px;
    margin:auto;
    padding: 20px 20px 20px;
    border-radius: 5px;
    text-align: center;
}

.load-wrapp p {padding: 0 0 20px;}
.load-wrapp:last-child {margin-right: 0;}

.line {
    display: inline-block;
    width: 15px;
    height: 15px;
    border-radius: 15px;

}

.ring-1 {
    width: 10px;
    height: 10px;
    margin: 0 auto;
    padding: 10px;
    border: 7px dashed white;
    border-radius: 100%;
}

.ring-2 {
    position: relative;
    width: 45px;
    height: 45px;
    margin: 0 auto;
    border: 4px solid #4b9cdb;
    border-radius: 100%;
}

.ball-holder {
    position: absolute;
    width: 12px;
    height: 45px;
    left: 17px;
    top: 0px;
}

.ball {
    position: absolute;
    top: -11px;
    left: 0;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    background: #4282B3;
}

.letter-holder {padding: 16px;}

.letter {
    float: left;
    font-size: 14px;
    color: #777;
}

.square {
    width: 12px;
    height: 12px;
    border-radius: 4px;
    background-color: #4b9cdb;
}

.spinner {
    position: relative;
    width: 45px;
    height: 45px;
    margin: 0 auto;
}

.bubble-1,
.bubble-2 {
    position: absolute;
    top: 0;
    width: 25px;
    height: 25px;
    border-radius: 100%;
    background-color: #4b9cdb;
}

.bubble-2 {
    top: auto;
    bottom: 0;
}

.bar {
    float: left;
    width: 15px;
    height: 6px;
    border-radius: 2px;
    background-color: #4b9cdb;
}

/* =Animate the stuff
------------------------ */
.load-1 .line:nth-last-child(1) {animation: loadingA 1.5s 1s infinite;}
.load-1 .line:nth-last-child(2) {animation: loadingA 1.5s .5s infinite;}
.load-1 .line:nth-last-child(3) {animation: loadingA 1.5s 0s infinite;}

.load-2 .line:nth-last-child(1) {animation: loadingB 1.5s 1s infinite;}
.load-2 .line:nth-last-child(2) {animation: loadingB 1.5s .5s infinite;}
.load-2 .line:nth-last-child(3) {animation: loadingB 1.5s 0s infinite;}

.load-3 .line:nth-last-child(1) {animation: loadingC .6s .1s linear infinite;}
.load-3 .line:nth-last-child(2) {animation: loadingC .6s .2s linear infinite;}
.load-3 .line:nth-last-child(3) {animation: loadingC .6s .3s linear infinite;}

.load-4 .ring-1 {animation: loadingD 1.5s .3s cubic-bezier(.17,.37,.43,.67) infinite;}

.load-5 .ball-holder {animation: loadingE 1.3s linear infinite;}

.load-6 .letter {
    animation-name: loadingF;
    animation-duration: 1.6s;
    animation-iteration-count: infinite;
    animation-direction: linear;
}

.l-1 {animation-delay: .48s;}
.l-2 {animation-delay: .6s;}
.l-3 {animation-delay: .72s;}
.l-4 {animation-delay: .84s;}
.l-5 {animation-delay: .96s;}
.l-6 {animation-delay: 1.08s;}
.l-7 {animation-delay: 1.2s;}
.l-8 {animation-delay: 1.32s;}
.l-9 {animation-delay: 1.44s;}
.l-10 {animation-delay: 1.56s;}

.load-7 .square {animation: loadingG 1.5s cubic-bezier(.17,.37,.43,.67) infinite;}

.load-8 .line {animation: loadingH 1.5s cubic-bezier(.17,.37,.43,.67) infinite;}

.load-9 .spinner {animation: loadingI 2s linear infinite;}
.load-9 .bubble-1, .load-9 .bubble-2 {animation: bounce 2s ease-in-out infinite;}
.load-9 .bubble-2 {animation-delay: -1.0s;}

.load-10 .bar {animation: loadingJ 2s cubic-bezier(.17,.37,.43,.67) infinite;}

@keyframes loadingA {
    0 {height: 15px;}
    50% {height: 35px;}
    100% {height: 15px;}
}

@keyframes loadingB {
    0 {width: 15px;}
    50% {width: 35px;}
    100% {width: 15px;}
}

@keyframes loadingC {
    0 {transform: translate(0,0);}
    50% {transform: translate(0,15px);}
    100% {transform: translate(0,0);}
}

@keyframes loadingD {
    0 {transform: rotate(0deg);}
    50% {transform: rotate(180deg);}
    100% {transform: rotate(360deg);}
}

@keyframes loadingE {
    0 {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}

@keyframes loadingF {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes loadingG {
    0% {transform: translate(0,0) rotate(0deg);}
    50% {transform: translate(70px,0) rotate(360deg);}
    100% {transform: translate(0,0) rotate(0deg);}
}

@keyframes loadingH {
    0% {width: 15px;}
    50% {width: 35px; padding: 4px;}
    100% {width: 15px;}
}

@keyframes loadingI {
    100% {transform: rotate(360deg);}
}

@keyframes bounce  {
  0%, 100% {transform: scale(0.0);}
  50% {transform: scale(1.0);}
}

@keyframes loadingJ {
  0%,100% {transform: translate(0,0);}
  
  50% {
      transform: translate(80px,0);
      background-color: #f5634a;
      width: 25px;
  }
}
