@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(icon.css);

/************************************************************
	[PAGE]
************************************************************/
body { background-color:#0a0f2e; }
/************ [NAV] ************/
#mainNav { background-color:#d31145; }
#mainNav .navbar-brand { width:150px; margin-right:0; background-image:url(/Content/images/Ad/logo2.png); background-size:contain; }
/*  #mainNav .navbar-brand { width:150px; margin-right:0; background-image:url(//img.tenping.kr/Content/Landing/2019082813280001/logo.png); background-size:contain; } */
#mainNav .navbar-nav > li.nav-item > a.nav-link,
#mainNav .navbar-nav > li.nav-item > a.nav-link:focus  { color:rgba(255,255,255,1); }

.navbar-toggler { display:none; }

/*** Responsive ***/
@media (min-width:768px) {
	#mainNav .container { max-width:1280px !important; }
	#mainNav .navbar-brand { width:200px; }
	#mainNav .navbar-brand + .btn-apply { display:none; }
}
@media (min-width:992px) {
	#mainNav { padding:0.5rem 1rem; }
	#mainNav .navbar-brand { width:180px; }
	#mainNav .navbar-nav > li.nav-item > a.nav-link:focus:hover,
	#mainNav .navbar-nav > li.nav-item > a.nav-link:hover { color:#00bdcd; }
	#mainNav.navbar-shrink { border-bottom:1px solid rgba(211,17,69,.1); background-color:rgba(211,17,69,.9); }
	#mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link,
	#mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link:focus { color:#fff; }
}

/************ [HEADER] ************/
header.masthead { margin-top:57px; padding-top:7rem; padding-bottom:calc(7rem - 56px); background-image:url(/Content/images/Ad/img-top2.png); }
#mainNav.navbar-shrink + header.masthead { margin-top:0; }
.btn-apply { background-color:#ff0072; border-color:#ff0072; color:#fff !important; }
.btn-apply:hover { background-color:#fb2c89; border-color:#fb2c89; }
.btn-apply.disabled,
.btn-apply:disabled { background-color:#ff0072; border-color:#ff0072; color:#fff; }
.btn-apply:not(:disabled):not(.disabled):active,
.btn-apply:not(:disabled):not(.disabled).active { background-color:#000 !important; border-color:#000; color:#fff !important; }
.btn-apply:not(:disabled):not(.disabled):active:focus,
.btn-apply:not(:disabled):not(.disabled).active:focus { color:#fff !important; }
/*** Responsive ***/
@media (min-width:576px) {
	header.masthead { height:309px; }
}
@media (min-width:768px) {
	header.masthead { height:429px; }
	.btn-apply { font-size:0.8rem; }
}
@media (min-width:992px) {
	header.masthead { margin-top:57px; height:544px; }
	.btn-apply { font-size:0.9rem; }
}
@media (min-width:1200px) {
	header.masthead { height:561px; }
}
@media (min-width:1273px) {
	header.masthead { height:898px; }
}

/*************** [SECTION] ***************/
/********* Segment : Overview *********/
/*** Responsive ***/
@media (max-width:576px) {
	#overview.bg-primary { background-color:#fff !important; }
}

/********* Segment : Carousel *********/
.carousel-segment .swiper-slide {  }
.carousel-segment .swiper-slide1 {  }
.carousel-segment .swiper-slide2 {  }
.carousel-segment .swiper-slide3 {  }

.swiper-button-prev:before {border-right:7px solid rgba(164,124,255,0.7);border-top:7px solid rgba(164,124,255,0.7);}
.swiper-button-next:before {border-left:7px solid rgba(164,124,255,0.7);border-bottom:7px solid rgba(164,124,255,0.7);}
.swiper-button-prev:after {border-right:0px solid rgba(164,124,255,0.7);border-top:0px solid rgba(164,124,255,0.7);}
.swiper-button-next:after {border-left:0px solid rgba(164,124,255,0.7);border-bottom:0px solid rgba(164,124,255,0.7);}

/*** Responsive ***/
@media (max-width:768px) {
	.carousel-segment .swiper-slide { height:193vw; }
	.swiper-button-next:before,
	.swiper-button-next:after { width:80px; height:80px; margin-top:-34px; margin-left:-100px }
	.swiper-button-prev:before,	 
	.swiper-button-prev:after { width:80px; height:80px; margin-top:-34px; margin-left:50px }
}
@media (min-width:769px) {
	.carousel-segment .swiper-slide { height:49vw; }
}
@media (min-width:1440px) {
	.carousel-segment .swiper-slide { height:937px; }
}

/********* Segment : Form *********/
.form-segment { background-size:cover; background-image:url(/Content/images/Ad/bg_form3.jpg); }
.form-segment form { margin-bottom:3rem; background-color:#26356f; }
.form-segment form .col-form-label { letter-spacing:-0.02em; text-align:left; }
.form-segment form .form-col-basic { padding-right:20px; padding-left:20px; color:#fff; }
.form-segment form .form-col-terms .col { -ms-flex:0 0 100%; flex:0 0 100%; max-width:100%; }
.form-segment form .form-control { border-color:#ced4da; }

.custom-control-label::before { border:1px solid #ced4da; }
.was-validated .form-control:valid,
.form-control.is-valid,
.was-validated .custom-select:valid,
.custom-select.is-valid { border-color:#ced4da; }
/*** Responsive ***/
@media (min-width:576px) {
	.form-segment form { margin-left:0; margin-top:0rem; }
	.form-segment form .col-form-label { letter-spacing:0; }
}
@media (min-width:768px) {
	.form-col-basic .form-group { min-width:100%; width:100%; margin-right:0; margin-left:0;}
	.form-col-terms { margin:0 auto 0; }
}

@media (max-width:767px) {
	.form-segment form .form-col-basic { padding-right:20px; padding-left:20px; }
	.form-segment.img-responsive .img-item-m { display:block !important; }
}

/********* Form *********/
/****** Layout ******/
/****** Add on ******/
.input-group-text { border-left-color:#ced4da; }
.textarea-ask { height:120px; }
@media (min-width:768px) {
	.textarea-ask { height:84px; }
}


/************************************************************
	[ELEMENTS]
************************************************************/
/********* Sticky Banner *********/
/*** Responsive ***/
@media (max-width:768px) {
	#bnrApply { display:none !important; }
}

/************ [ELEMENTS DESIGN] ************/
/********* Background *********/
.bg-primary { background-color:#182e44 !important; }
.bg-dark { }

/********* Button *********/
.btn-primary { background-color:#ff0072; border-color:#ff0072; }
.btn-primary:hover { background-color:#fb2c89 !important; border-color:#fb2c89; }
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active { background-color:#000; border-color:#000; }


/************************************************************
	추가/수정
************************************************************/
/************ [youtube segment] ************/
#youtube { background-color:#fafafa; padding-bottom:100px !important; }
#youtube .container { max-width:1000px !important; }
#youtube .formbtn img { max-width:430px !important; margin-top:70px; margin-bottom:20px; }
section { padding:0; }
.container { max-width: 100% !important; }

#overview6 { background-color:#f0f0f0; }
#overview7 { background-color:#f0f0f0; }

.btn-apply { background-color:#000; border:2px solid #000 ; color:#fff !important; border-radius:0; font-size:20px; font-weight:500;  padding: 0.375rem 1.5rem; }
.btn-apply:hover { background-color:#333; border:2px solid #333; }

#mainNav.navbar-shrink { padding:0rem 1rem; }
#mainNav.navbar-shrink .btn-apply { font-size:20px; font-weight:500; }

.youtube-segment { position:relative; width:100%; padding-bottom:56.25%; }
.youtube-segment iframe { position:absolute; width:100%; height:100%; }

form-segment form { margin-bottom:0; }
.form-segment form .btn { border-radius:0; }
.img-segment .img-item { text-align:center; position:relative; }
.img-segment .img-item img { max-width:100%; text-align:center; }
#overview1.img-segment .img-item img { max-width:100%; text-align:center; }
.form-segment.img-segment .img-item img { max-width:579px; margin-top:10px; }
.form-segment.img-segment .img-item.img-footer img { max-width:150px; margin-bottom:100px; }

.form-col-terms { border-top:none; padding-bottom:50px; margin:0 auto 0; padding-top:10px !important; }
.form-checkbox-all { padding:0.5rem 1rem 0; border-bottom:none; background-color:rgba(255,255,255,0); color:#fff; }
.form-checkbox-sub { padding: 0.2rem 1rem 1rem; background-color:rgba(255,255,255,0); color:#fff; }
.form-checkbox-all .custom-checkbox .custom-control-label { font-weight:300; }
.custom-control-label { font-weight:300; }
.btn-group { padding:15px 15px 0; }

.btn-primary { background-color:#000 !important; border-color:#000; font-size:30px; }
.btn-primary:hover { background-color:#6182ff !important; border-color:#6182ff; color:#000; }
.btn-primary:active { border-color:#009cff !important; }

.custom-radio .custom-control-input:checked ~ .custom-control-label::after { background-color:#009cff; }
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after { color:#009cff !important; }
.btn-outline-primary { border-color:#000; color:#000; }
.btn-outline-primary:hover { background-color:#d31145; border-color:#d31145; }
.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active { background-color:#000; border-color:#000; }

#footer p { max-width:1280px; margin:0 auto; padding:0 10px; }
.bd-footer p { color:#777; }

.linkComponent1 { width:21.7%; height:6%; left:49.1%; top:63.4%; position:absolute; }
.linkComponent1-m { width:59.7%; height:4.8%; left:20.2%; top:86.5%; position:absolute; }

.content_box {
    max-width:1200px;
    margin:0 auto;
    height:100%;
	width:1200px; 
    position:relative;
}
.content_box .player {
    position:absolute;
    top:410px;
    right:10px;
}

/********* Segment : Carousel *********/
.swiper-container { width:100%; height:100%; margin:0 auto; padding:0; position:relative; list-style:none; overflow:hidden; z-index:1; }
.swiper-wrapper { width:100%; height:100%; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; position:relative; -webkit-transition-property:-webkit-transform; transition-property:-webkit-transform; -o-transition-property:transform; transition-property:transform; transition-property:transform, -webkit-transform; z-index:1; }
.swiper-container-android .swiper-slide,
.swiper-wrapper { -webkit-transform:translate3d(0px, 0, 0); transform:translate3d(0px, 0, 0); }
.swiper-slide { width:100%; height:100%; display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; 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-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; position:relative; -webkit-transition-property:-webkit-transform; transition-property:-webkit-transform; -o-transition-property:transform; transition-property:transform; transition-property:transform, -webkit-transform; background-color:#fff; background-repeat:no-repeat; background-position:center; background-size:cover; text-align:center; }
.swiper-slide img { width:100%; }
/*** Paginaition ***/
.swiper-pagination { position:absolute; text-align:center; -webkit-transition:300ms opacity; -o-transition:300ms opacity; transition:300ms opacity; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); z-index:10; }
.swiper-pagination.swiper-pagination-hidden { opacity:0; }
.swiper-pagination.swiper-pagination-bullets { width:100%; bottom:10px; left:0; }
.swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet { width:8px; height:8px; margin:0 4px; display:inline-block; border-radius:100%; background-color:#fff; opacity:0.3; }
.swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet-active { background-color:#fff; opacity:1; }
/*** Prev, Next Button ***/
.swiper-button-next,
.swiper-button-prev { width:27px; height:44px; margin-top:-22px; position:absolute; top:48%; background-size:27px 44px; background-position:center; background-repeat:no-repeat; cursor:pointer; z-index:10; }
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled { opacity:0.35; cursor:auto; pointer-events:none; }
.swiper-button-prev { right:auto; left:30px; }
.swiper-button-next { right:40px; left:auto; }
.swiper-button-next:before,
.swiper-button-prev:before,
.swiper-button-next:after,
.swiper-button-prev:after { content:''; width:30px; height:30px; margin-top:-10px; margin-left:-10px; display:block; position:absolute; top:50%; left:50%; -webkit-transform:rotate(-135deg); -ms-transform:rotate(-135deg); transform:rotate(-135deg); cursor:pointer; z-index:2; }
.swiper-button-next:after,
.swiper-button-prev:after { margin:-20px; z-index:1; }
.carousel-segment .swiper-slide1 { background-image:url(/Content/images/Ad/slide1.jpg); }
.carousel-segment .swiper-slide2 { background-image:url(/Content/images/Ad/slide2.jpg); }
.carousel-segment .swiper-slide3 { background-image:url(/Content/images/Ad/slide3.jpg); }
.swiper-button-prev:before {border-right:2px solid rgba(255,255,255,0.9);border-top:2px solid rgba(255,255,255,0.9);}
.swiper-button-next:before {border-left:2px solid rgba(255,255,255,0.9);border-bottom:2px solid rgba(255,255,255,0.9);}
.swiper-button-prev:after {border-right:0px solid rgba(0,0,0,0.1);border-top:0px solid rgba(0,0,0,0.1);}
.swiper-button-next:after {border-left:0px solid rgba(0,0,0,0.1);border-bottom:0px solid rgba(0,0,0,0.1);}
@media (max-width:768px){
	.carousel-segment .swiper-slide1 { background-image:url(/Content/images/Ad/slide1_m.jpg); }
	.carousel-segment .swiper-slide2 { background-image:url(/Content/images/Ad/slide2_m.jpg); }
	.carousel-segment .swiper-slide3 { background-image:url(/Content/images/Ad/slide3_m.jpg); }
	.swiper-button-next:before,
	.swiper-button-prev:before,
	.swiper-button-next:after,
	.swiper-button-prev:after { width:20px; height:20px; }
	.swiper-button-prev { left:10px; }
	.swiper-button-next { right:10px; }
}

/********* arrow animation *********/
.hero_scroll { position:relative; width:200px; margin:auto; display:block; cursor:pointer; padding-bottom:20px; left:0; right:0; text-transform:uppercase; z-index:1000; }
@-webkit-keyframes pulse {
  0% { -webkit-transform:translate(0, 0); transform:translate(0, 0); }
  50% { -webkit-transform:translate(0, 10px); transform:translate(0, 10px); }
  100% { -webkit-transform: translate(0, 0); transform:translate(0, 0); }
}
@keyframes pulse {
  0% { -webkit-transform:translate(0, 0); transform:translate(0, 0); }
  50% { -webkit-transform:translate(0, 10px); transform:translate(0, 10px); }
  100% { -webkit-transform:translate(0, 0); transform:translate(0, 0); }
}

.hero_scroll .arrow { 
	margin-top:20px; 
	display:block; 
	-webkit-animation:pulse 1s infinite; 
	animation:pulse 1s infinite; 
	color:#293e90 !important;
	text-align:center;
}
.arrow.bottom:before {
    top:0;
    -webkit-transform:rotate(135deg);
    -ms-transform:rotate(135deg);
    transform:rotate(135deg);
}
.arrow::before {
    border-style:solid;
    border-width:0.25em 0.25em 0 0;
    content:'';
    display:inline-block;
    height:20px;
    position:relative;
    -webkit-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
    vertical-align:top;
    width:20px;
}
@media (min-width:769px) {
	.navbar-brand { padding-top:17px; padding-bottom:17px; }
	.form-segment { padding-top:80px !important; }
    .form-segment form { padding:20px 0 0 0; margin:0 auto; margin-top:20px; margin-bottom:20px; width:600px; border:10px solid #26356f; }
}
@media (max-width:768px){
	.img-responsive .img-item-m { display:block; }
	.img-responsive .img-item-d { display:none; }
	#mainNav.navbar-shrink { padding:0.5rem 1rem; }
	#mainNav.navbar-shrink .btn-apply { font-size:18px; }
	#overview2 { padding:0; }
	#overview3 { padding:0; height:inherit; background-image:none; }
	#overview4 { padding:0; }
	#overview5 { background-image:none; height:inherit; padding:0; }
	#overview6 { padding:0; }
	#overview7 { padding:0; }
	.form-segment { padding:0; }
	.btn { padding:0.5rem 0.75rem 0.7rem; font-size:24px; }
	.btn-apply { font-size:18px; }
	.form-segment form { padding:10px 0 0 0; width:90%; margin:0 auto; margin-top:20px; }
    .form-segment.img-segment .img-item img { margin-top:0; }
	.img-responsive .img-item-d { display:none; }
	.form-segment.img-segment .img-item img { max-width:100%; }
	.form-segment.img-segment .img-item-m img { max-width:70%; margin-top:70px; }
	.form-segment.img-segment .img-item.img-footer img { max-width:30%; margin-bottom:50px; margin-top:30px; }
	.form-segment form .col-form-label { letter-spacing:-0.05rem; }
	.hero_scroll { margin-top:-10px; }
	.form-segment { background-size:cover; background-image:url(/Content/images/Ad/bg_form3_m.jpg); }
}
@media (max-width:360px){
	.form-segment form .col-form-label { letter-spacing:-0.05rem; font-size:13px; }
}