@charset "utf-8";
/* bootstrap.css */

output {display:inline-block}
.text-primary {color:#ff5950;}
.bg-primary {background-color:#ff5950;}

.container {margin:0 auto;padding-left:20px;padding-right:20px;padding-top:80px;padding-bottom:100px;}
.container-fluid {padding:0}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {position:relative;min-height:1px;padding-right:0px;padding-left:0px}

.navbar {margin:0}  
.navbar-nav {float:none;margin:0 auto;width:70%;}  
.navbar-nav > li > a:hover {background-color:#ff5950;color:#fff !important}
.navbar-nav > li > a.active {color:#ff5950}
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {color:#fff;background-color:#ff5950}
.navbar-inverse {display:none;border:none;background-color:transparent}    
.navbar-inverse .navbar-toggle {border:none;margin-right:20px;}
.navbar-toggle {padding:16px;background-color:#ff5950;border-radius:0;z-index:10000}
.navbar-toggle .icon-bar + .icon-bar {margin-top:6px}
.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {background-color:#ff5950 }
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {border:none}
.navbar-collapse {padding-right:0;padding-left:0}
.navbar-collapse .container {padding-top:0;padding-bottom:0;}

.nav-tabs {border:none;}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {border:none;background-color:transparent;}
.nav-tabs > li > a:hover {border:none;}


@media (min-width: 1200px){
.container {
    width: 1169px !important;
}
}
@media (min-width: 768px){
	.container {
   	 width: auto; 
	}
}
@media (max-width:360px) {
	html, body {font-size:12px}
}
@media (max-width:767px) {
	.wrap {padding-top:80px;position:absolute;left:0;transition:all 0.4s ease-in-out;z-index:1000}
	.wrap.on {left:-60%;}
	.header .logo {width:50%;}
	.hover-b li em {font-size:1.2rem}
	.hover-b li em.big {font-size:2.2rem}
	
	.lang {position:relative;padding:20px;margin-top:-130px;margin-right:55px;font-size: 1rem;color: #ff5950;z-index:10000}
	.main_pop.on.pop-show + header .lang {top:138px}

	.wrap .shadow {display:block;position:fixed !important;background-color:rgba(0,0,0,0.7);transform:translateX(-100%);-ms-transform:translateX(-100%);z-index:700 !important;transition:all 0.3s ease}
	.wrap.on .shadow {transform:translateX(-60%);-ms-transform:translateX(-60%);}

	.header {position:fixed;top:0;z-index:10000;border-bottom:2px solid #f2f2f2}
	.header .logo {float:left;position: relative;z-index:10;}
	.header .logo img {display:none}
	.header .logo span {display:block}
	.header .logo span img {display:block;width:120px;margin-top:-3px;}
	.navbar-inverse {display:block;padding:6px 0;}
	.navbar-nav {width:100%;}
	.navbar-nav > li > a {padding-top:20px;padding-bottom:20px}

	#nav {display:block;width:60%;position:fixed;top:0;bottom:0;right:0;margin-right:-60%;border-top:none !important;background-color:#fff;border-top:none;transition:all 0.4s ease-in-out;z-index:-100}
	#nav.on {right:60%;}	

	.main .fonts {height:360px;}
	.main .fonts .tit-area {bottom:0 !important}
	.main .last-txt {padding:50px 0;font-size:2.3rem}
	.main .bnr-area div button {margin-top:20px;width:70px;height:70px;}

	#font_list_type.list ul li dl dd.more_btn {display:none}

	.works ul li a p {margin-top:10px}
	.works ul li .tit {margin-top:0}
	.feature .tit-area {text-align:center}
	
	.case-tit .tit-area {margin-top:0}
	
	.footer .gnb {margin-top:20px;text-align:center !important;}
	.footer .gnb div {float:none !important;margin:30px;}
	.footer address {margin-left:0}
	
	.footer .pull-right {padding:0;border:none}
	
}

@media (max-width:991px) {
	.contactUs .col-md-4 {position:relative;}
	.contactUs .container {padding:0}
	.contactUs #myBtn {margin-top:10px;}
	.contactUs #submitBtn {margin-top:10px}
	.modal-open .modal.in .modal-dialog {margin:auto 20px;}
}

/* //bootstrap.css */


/* jquery.bxslider.css */
.bx-wrapper {height:100%;margin:0;max-width:100% !important;box-shadow:none;border:none;background-color:transparent}
.bx-viewport {height:100%}
.bxslider {height:100%;text-align:center;}
.bxslider > div {display:table;height:100%;}
.bxslider > div p {display:table-cell;vertical-align:middle;}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {width:100%;text-align:center}
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {bottom:25px}
.bx-wrapper .bx-pager.bx-default-pager a {width:13px;height:13px;border-radius:100px;background-color:rgba(255,255,255,0.3)}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus {background-color:#fff}
/* //jquery.bxslider.css */

/* timeline */
.timeline-dates {width: calc(100% - 140px);padding:30px 0 50px !important;box-sizing:border-box;}
.timeline-dates::before {content:"";position:absolute;top:30px;left:0;right:0;height:6px;background-color:#ff5950;border-radius:100px}
.timeline-dates .swiper-wrapper {margin-left:-4px;}
.timeline-dates .swiper-slide {color:#ff5950;height:80px;width:50px !important;cursor:pointer;width:auto;}
.timeline-dates .swiper-slide div {margin-top:40px;font-size:1.5rem;transform:rotate(-55deg) !important;-ms-transform:rotate(-55deg);color:#ff5950;font-size:1.313rem;}
.timeline-dates .swiper-slide div::before {content:"";position:absolute;top:-25px;left:140%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:27px;height:27px;border-radius:100%;background-color:#ff5950;transition:.2s;}
.timeline-dates .swiper-slide-active div {opacity:1;}
.timeline-dates .swiper-slide-active div::before {background-color:#fff;border:5px solid #ff5950;}


/* Arrows */
.timeline-dates .swiper-slide:after, .timeline-dates .swiper-slide div {transition:all .3s ease-in-out;}
.timeline-buttons-container {position:absolute;top:64px;right:20px;left:20px}
.timeline-button-next, .timeline-button-prev {position:absolute;top:47%;width:auto;height:auto;margin-top:0;z-index:2;
    cursor:pointer;width:40px;height:40px;transition:all .2s ease-in-out;
}
.timeline-button-next:hover, .timeline-button-prev:hover {}
.timeline-button-next {right:0;}
.timeline-button-prev {left:0;transform:rotate(-180deg)}
.swiper-button-disabled {opacity:0.3}
.swiper-container {display:block;}