@import url('https://fonts.googleapis.com/css?family=Black+Han+Sans&display=swap');
@import url("https://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700");
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(https://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
@font-face{
	font-family:gmarket-bold;
	src:url(./fonts/GmarketSansBold.eot);
	src:local(※),
	url(./fonts/GmarketSansBold.woff)
	format('woff')
}

@font-face{
	font-family:gmarket-medium;
	src:url(./fonts/GmarketSansMedium.eot);
	src:local(※),
	url(./fonts/GmarketSansMedium.woff)
	format('woff')
}

@font-face{
	font-family:gmarket-light;
	src:url(./fonts/GmarketSansLight.eot);
	src:local(※),
	url(./fonts/GmarketSansLight.woff)
	format('woff')
}


.goto{cursor: pointer;}
.vh{height: 100vh; height: calc(var(--vh, 1vh) * 100); margin: 0 auto; max-width: 100%;}
.gmarket-light{font-family: 'gmarket-light' !important}
.gmarket-medium{font-family: 'gmarket-medium' !important}
.gmarket-bold{font-family: 'gmarket-bold' !important}
.noto{font-family: 'Noto Sans KR' !important}
.roboto{font-family: 'Roboto' !important}

body{font-family: 'Noto Sans KR', Roboto, 나눔고딕, 'Nanum Gothic', Nanumbarungothic,arial,verdana,sans-serif; line-height: 1.6; font-size: 14px; color: #000; letter-spacing: -0.03em;}
.container-fluid{max-width: 1350px}



/* 이미지 해상도 고정*/
.aspect-ratio-box {
	position: relative;
}
/* Create a pseudo element that uses padding-bottom to take up space */
.aspect-ratio-box::after {
	display: block;
	content: '';
	/* 16:9 aspect ratio */
	/*padding-bottom: 56.25%;*/
	/* 4:3 aspect ratio */
	padding-bottom: 66%;
}

/* Image is positioned absolutely relative to the parent element */
.aspect-ratio-box img {
	/* Image should match parent box size */
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

/* 공통 코드 */
ul{ padding-left: 0 !important; margin-bottom: 0 !important}
ul li{list-style: none;}
p {margin-bottom: 0; color:#000;}
a {text-decoration: none !important;}
a:focus {color:#1A3296;}
input[type="text"], textarea {outline: none; box-shadow:none !important; border:1px solid #ccc !important; }

@media (min-width: 1200px) {
	.container {max-width: 1350px; }
}

@media (min-width: 992px) {
	.text-outline{font-size: 19px; margin-bottom: 30px}
}

a.link:hover {color: #1A3296;}
a.link > span{position: relative; padding-bottom: 2px; color: #000; -webkit-transition:all .3s; transition:all .3s}
a.link > span:after {content: ''; width:0; height: 1px; background: #000; position: absolute; bottom: 0; left: 0; -webkit-transition:all .3s; transition:all .3s}
a.link:hover > span {color: #000}
a.link:hover > span:after {width:100%;}

.color-red{color:#C40303}
.color-dark{color:#333 !important;}

.color-01{color: #000 !important}
.color-02{color: #007BFC !important}
.color-03{color: #60BBED !important}

.bg-01{background-color: #1A3296 !important; }	
.bg-02{background-color: #007BFC !important; }

.color-gray-v1{color:#5D636E !important;}
.color-gray-v2{color:#A9ADB1 !important;} 
.brd-color-gray-v1{border-color: #4b4b4b !important;}
.brd-color-gray-v2{border-color: #A9ADB1 !important;}
.brd-color-gray-v3{border-color: #ebebeb !important;}
.brd-color-gray-v4{border-color:  rgba(0, 0, 0, 0.1) !important;}
.brd-ci{border : 1px solid #FFFFFF !important;}

.box-rosegold{border: solid 1px #F4C9B7 !important; }
.box-border{border: solid 1px #ddd !important; }
.box-border-2{border: solid 1px #AA8064 !important; }
.box-shadow{box-shadow: 0 10px 6px -6px rgba(0, 0, 0, 0.2);}

.section-content{margin-bottom: 50px; -webkit-transition:all .3s; transition:all .3s}
.none-crumb{margin-top: 40px;}

@media (min-width: 768px) {
	.section-content{margin-bottom: 75px;}
	.none-crumb{margin-top: 80px;}
}

@media (min-width: 992px) {
	.section-content{margin-bottom: 100px;}
}


/*------------------------------------
  텍스트 스타일
------------------------------------*/
.text-title{font-weight: 600; font-size: 25px; margin-bottom: 20px; line-height: 1.2;}
.text-01{font-weight: 500; font-size: 20px; font-family: gmarket-bold;}
.text-02{font-size: 25px; font-weight: 400;}
.text-03{font-size: 22px; font-weight: 600; }
.text-04{font-size: 20px;  font-weight: 600;}
.text-05{font-size: 16px; }
.text-06{font-size: 12px; }
.text-07{font-size: 11px; }

.text-dooson-01{font-size: 22px; color: #C9A6ED; font-family: 'Roboto'; font-weight: 600; margin-bottom: 20px;}
.text-dooson-02{font-size: 25px; color: #fff; line-height: 1.2; visibility: hidden; font-family: gmarket-light;}
.text-dooson-02 span{display: inline-block;}
.text-dooson-03{font-size: 30px; font-weight: 600; color:#000; font-family: gmarket-bold;}}

@media (min-width: 768px){
	.text-title{font-size: 35px; margin-bottom: 25px}
	.text-01{font-size: 32px; }
	.text-02{font-size: 30px;}
	.text-03{font-size: 25px;}
	.text-04{font-size: 23px;}
	.text-05{font-size: 18px;}
	.text-06{font-size: 14px;}
	.text-07{font-size: 12px;}
	.text-dooson-01{font-size: 35px; margin-bottom: 25px;}
	.text-dooson-02{font-size: 60px;}
	.text-dooson-03{font-size: 45px; font-weight: 600;}
}

@media (min-width: 992px) {
	.text-title{font-size: 50px; margin-bottom: 30px}
	.text-01{font-size: 40px; }
	.text-02{font-size: 35px;}
	.text-03{font-size: 30px;}
	.text-04{font-size: 25px;}
	.text-05{font-size: 20px;}
	.text-06{font-size: 15px;}
	.text-07{font-size: 13px;}
	.text-dooson-01{font-size: 45px; margin-bottom: 30px;}
	.text-dooson-02{font-size: 80px;}
	.text-dooson-03{font-size: 60px; font-weight: 600;}
}

.text-outline{border:3px solid #162D4E; color: #162D4E; display: inline-block; padding:5px 15px; font-weight: bold; font-size: 16px; margin-bottom: 15px}

@-webkit-keyframes kenburns {
	 0% {
	 opacity: 1;
	 -webkit-transform: scale(1.2);
	 transform: scale(1.2);
	}
		 1.5625% {
		 opacity: 1;
	}
		 23.4375% {
		 opacity: 1;
	}
		 26.5625% {
		 opacity: 0;
		 -webkit-transform: scale(1);
		 transform: scale(1);
	}
	 100% {
		 -webkit-transform: scale(1.2);
		 transform: scale(1.2);
		 opacity: 1;
	}
}

@keyframes kenburns { 
	0% {
		 opacity: 1;
		 -webkit-transform: scale(1.2);
		 transform: scale(1.2);
	}
	 1.5625% {
	 opacity: 1;
	}
	 23.4375% {
	 opacity: 1;
	}
	 26.5625% {
	 -webkit-transform: scale(1);
	 transform: scale(1);
	}
	 100% {
	 -webkit-transform: scale(1.2);
	 transform: scale(1.2);
	 opacity: 1;
	}
}

.kenburns-wrapper{overflow: hidden;  height: auto; padding: 0 !important; position: relative;}
.kenburns{
	/*animation: kenburns 15s infinite alternate; height: 100%; */
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.kenburns{
	-webkit-animation-name: kenburns;
	animation-name: kenburns;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-duration: 20s;
	animation-duration: 20s;
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

/*------------------------------------
  페이지 상단
------------------------------------*/
.hero-wrapper{height: 200px;}
/*.text-hero-01{font-size: 17px; color:#fff; font-weight: lighter; -webkit-transition:all .3s; transition:all .3s; font-family: 'Nanum Myeongjo'; margin-left: 3px; line-height: 1.4}*/
.text-hero-01{font-size: 35px; color:#fff; line-height: 1; font-family: 'gmarket-light'; margin-bottom: -7px; -webkit-transition:all .3s; transition:all .3s;  visibility: hidden; color: #fff;}
.text-hero-01 span{display: inline-block}

@media (min-width: 768px) {
	.hero-wrapper{height: 320px}
	.text-hero-01{font-size: 50px; margin-bottom: -10px;}
}

@media (min-width: 992px) {
	.hero-wrapper{height: 400px}
	.text-hero-01{font-size: 70px; margin-bottom: -12px;}
}

/* 테이블 */
.table th, .table td{vertical-align: middle !important; color:#000; border-color: #D0D6DF !important; border-right: 1px solid #D0D6DF !important; font-size: 12px; }
th{background: #F7F7F7}
/*.table {border-bottom: 1px solid #000;}*/
.table .content{padding: 10px; color: #000;}
.table th.content{padding: 10px; color: #000; background: #F5E9E4 }
.table td:last-child, .table th:last-child{border-right: none !important}
.table .bb{border-bottom: 2px solid #000 !important;}
.table .bb-2{border-bottom: 1px solid #D0D6DF !important;}

.table th, .table td {
	border-bottom: 1px solid #e9ecef;
}

@media (min-width: 1200px) {
	.table .bb-xl{border-bottom: 2px solid #333 !important;}
}

.table .bt{border-top: 2px solid #000 !important;}
.table .bg-y{background-color: #162D4E !important; color:#fff;}
.table td.brn, .table th.brn{border-right: none !important}
.board td, .board th{border-right: none !important;}

a.table-link > span{position: relative; padding-bottom: 2px; color:#333;}
a.table-link > span:after{content: ''; width:0; height: 1px;  background: #333; position: absolute; bottom: 0; left: 0; -webkit-transition:all .3s; transition:all .3s}
a.table-link:hover > span:after{width:100%;}


@media (min-width: 768px) {
	.table th, .table td{font-size: 15px;}
}

@media (min-width: 1200px) {
	.table td.brn{border-right: 1px solid #D0D6DF !important}
}


/* 이미지 줌 설정 */
.zoom-wrapper{position: relative; overflow: hidden;}
.zoom-wrapper img{transition: transform .5s; }
.zoom-wrapper:hover {;}
.zoom-wrapper:hover img{-webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2);}
.zoom-wrapper:hover img.no-zoom{-webkit-transform: scale); -ms-transform: scale(1); transform: scale(1);}
hr {margin-top: 1.2rem; margin-bottom: 1.2rem; }


/*------------------------------------
  회사소개
------------------------------------*/
.map{height:250px; }
.bottom-banner{min-height: 125px;}
@media (min-width: 768px){
	.map{height:350px;}
	.bottom-banner{min-height: 250px;}
}
@media (min-width: 992px) {
	.map{height:500px;}
}


.text-map{font-size: 25px; font-weight: 700}
@media (min-width: 768px){text-decoration-color: 
	.text-map{font-size: 30px;}
}

/*------------------------------------
  고객센터
------------------------------------*/
.file-wrapper{border-bottom: 1px solid #ebebeb; margin-bottom: 10px; }





/* 퀵메뉴 */
.tab-menu-wrapper{background-image: url(/assets/img/common/bar.png); background-repeat: repeat; z-index: 5000}
.tab-menu{padding-bottom: 12px}
.tab-menu li{padding-left: 7px; padding-right: 7px}

.tab-menu li a span{color:white; font-size: 13px; position: relative; -webkit-transition:all .3s; transition:all .3s}
.tab-menu li a span:after{width:0; content: ''; height: 1px;  background: #F4C9B7; position: absolute; bottom: -7px; left: 50%; -webkit-transition:all .3s; transition:all .3s}
.tab-menu li a:hover span{color: #F4C9B7}
.tab-menu li a:hover span:after{width:100%; left:0%;}
.tab-menu li.active a span{color: #F4C9B7;}
.tab-menu li.active a span:after{ width:100%; left: 0;}

@media (min-width: 768px){
	.tab-menu li{padding-left: 30px; padding-right: 30px}
	.tab-menu li a span{font-size: 16px}
}


/*------------------------------------
  푸터
------------------------------------*/


/*------------------------------------
  탭 컨텐츠
------------------------------------*/
.nav-item{display: block !important}
.nav-link {width:130px; color:#1A3296 !important; background: #fff !important; font-size: 15px; border: 1px solid #1A3296 !important; padding:10px 0 !important; text-align: center; font-size: 13px;}
.nav-link.active {background: #1A3296 !important; color: white !important;  border:1px solid #1A3296 !important; color: #fff !important}

@media (min-width: 992px) {
	.nav-link {  font-size: 14px; width: 230px; font-weight: 600}
}

/*------------------------------------
  약관
------------------------------------*/
.text-terms {font-size: 14px !important; margin-bottom: 5px; color: #333 !important; }
.text-terms-02 {color: #333; font-weight: 600; font-size: 18px; margin-bottom: 10px; line-height: 1.2; }
.icon-email{color:#fff; font-size: 60px}
@media (min-width: 768px) {
	.text-terms {font-size: 15px; }
	.text-terms-02 {font-size: 20px; }
	.icon-email{font-size: 80px}
}

/* 커뮤니티 */
.notice-list{padding:10px 0; border-bottom: 1px solid #ebebeb; cursor: pointer;}
.notice-list:hover{background: #062d6a}
.notice-list:hover .notice-date{color:#fff;}
.notice-list:hover .notice-date{color:#fff;}
.notice-list:hover .notice-year-month{color:#fff;}
.notice-list:hover .notice-title{color:#fff;}
.notice-list:hover .notice-info{color:#fff;}
.notice-list:hover .arrow{color:white; background: #FF6200; border-color: #FF6200 !important}
.notice-date{font-weight: 500; font-size: 50px; line-height: 1; color: #A9ADB1; padding-bottom: 5px}
.notice-year-month{font-size: 15px; line-height: 1; color: #A9ADB1}
.notice-title{font-size: 15px; color:#333; margin-right: 15px}
.notice-info{font-size: 13px; color:#5D636E; margin-right: 20px;}

/* Q&A 관련 */
.faq .nav-link{background: #fff !important; border-bottom:5px solid #ffffff ; color:#5D636E !important; font-size: 15px; padding-left: 10px; padding-right: 10px}
.faq .nav-link.active{color: #ff6200 !important; border-color: #ff6200}
.nav-fill .nav-item {-ms-flex:1; flex: 1; text-align: center; }

.qna-text-01{color: #ff6200; font-size: 17px; font-weight: 500;}
.qna-text-02{color: #ff6200; font-size: 25px; font-weight: 500;}

.collapsed .qna-text-01{color:#333; font-size: 17px; font-weight: 500;}
.collapsed .qna-text-02{color:#333; font-size: 25px; font-weight: 500;}
@media (min-width: 768px) {
	.faq .nav-link{font-size: 17px; padding-left: 15px; padding-right: 15px}
	.collapsed .qna-text-01{font-size: 18px;}
	.qna-text-01{font-size: 18px;}
}

.qna-wrapper {border-top: 1px solid #A9ADB1; border-bottom: 1px solid #ccc;}
.qna-wrapper .icon {transform: rotate(deg); transition: .3s transform ease-in-out; display: inline-block;}
.qna-wrapper .collapsed .icon {color: #333;}
.qna-wrapper .icon {color: #ff6200;}
.qna-wrapper .collapsed .icon {transform: rotate(-180deg);}

.border-question{border-top: 1px solid #ccc;}


.slick-slide, .slick-slide *{ outline: none !important; } /* slick 슬라이더 외곽선 제거*/

.row .content {
	height: 100%;
}
.row-wrapper{margin-bottom: 30px}
.flex-fill{-webkit-flex: 1; flex: 1;}
@media (min-width: 768px) {
	/*section{margin-bottom: 50px;}*/
	.row-wrapper{margin-bottom: 60px}
}

/* 퀵(탭) 시작 */
/*.crumb_wrapper{display: none;}*/
.crumb-wrapper{border-bottom: 1px solid #ebebeb; display: block; padding-left: 0; padding-right: 0; background: #fff}
.crumb-wrapper .container{padding-left: 0; padding-right: 0;}
.q{text-align: center; border-left: 1px solid #ebebeb; border-right: 1px solid #ebebeb; display: none !important;}
.quick-wrapper-01{padding:0 0; border-right: 1px solid #ebebeb; border-right: 1px solid #ebebeb;display: block; cursor: pointer; width:50%; position: relative;}
.quick-wrapper-02{padding:0 0; border-right: 1px solid #ebebeb; display: block; cursor: pointer; width:50%; position: relative;}
/*.quick-wrapper-02{padding:0 0; display: bloc; cursor: pointer; width:50%; position: relative;}*/

.q_tab{margin-bottom: 0; }
.q_tab li{font-size: 14px; display: inline-block;  line-height: 50px;}
.q img{width:70px; height: auto; padding:0 20px;}

#collapse-01{position: absolute; width: 100%; z-index: 9999; left:1px}
#collapse-02{position: absolute; width: 100%; z-index: 9999; left:-1px;}

.quick-wrapper-01 .icon {transform: rotate(deg); transition: .3s transform ease-in-out; display: inline-block; }
.quick-wrapper-01.collapsed .icon {transform: rotate(-180deg);}
.quick-wrapper-02 .icon {transform: rotate(deg); transition: .3s transform ease-in-out; display: inline-block; }
.quick-wrapper-02.collapsed .icon {transform: rotate(-180deg);}
/*.quick-wrapper-02 .icon {transform: rotate(deg); transition: .3s transform ease-in-out; display: inline-block; }
.quick-wrapper-02 .collapsed .icon {transform: rotate(-180deg);}
*/
/*.quick-link{background: #f7f7f7; padding-left: 20px; border-bottom: 1px solid #bbb; line-height: 49px;}*/
.quick-link{background: #fff; padding-left: 20px;  line-height: 45px; border-right: 1px solid #ebebeb; border-left: 1px solid #ebebeb; margin-right: -2px}
.quick-link:last-child{border-bottom: 1px solid #ebebeb;}
.quick-link a{text-decoration: none; color: #333; display: block;}
.quick-link.active a{color: #C40303}

@media (min-width: 768px) {
	#collapse-01{left:-1px}
	#collapse-02{left:-1px;}

	.crumb-wrapper .container{padding-left: 15px; padding-right: 15px;}
	.crumb-wrapper{border-bottom: 1px solid #ebebeb; display: block;}
	.q{display: inline-block !important}
	.quick-wrapper-01{width: 200px; }
	.quick-wrapper-01 .quick-link{width: 201px; }
	.quick-wrapper-01 .quick-link:last-child{border-bottom: 1px solid #ebebeb; }
	.quick-wrapper-02{width: 160px; }
	
	/*.quick-wrapper-02 .collapse {display: inline !important;} /*collpase된 링크를 강제로 보이게 한다.*/*/
	/*#collapse-02{position: relative;}*/
	/*.quick-02{border-bottom: none; line-height: 42px; font-weight: bold; display: inline; background: #fff; display: inline !important;}*/
	
	.quick-02-btn{display: none !important}
}
/* 퀵(탭) 종료 */

/* 게시판 시작 */
.board_border_01{border-top: 2px solid #449CF2;}
.board_border_02{border-top: 1px solid #eaeaea;}
.board_border_03{border-bottom: 1px solid #333;}
.board-title{font-weight: 600; font-size: 24px; line-height: 1.2; text-align: left; padding-bottom: 20px}
.board-body{padding:15px 0 15px 0; border-bottom: 1px solid #ebebeb; margin-bottom: 15px; margin-top: 	30px; border-top: 3px solid #333; }
.board-content{font-size: 14px; margin-bottom: 20px}
.board-content a{color: #333 !important}
.board-content a:hover{color: #333 !important}
.board-content a:active{color: #333 !important}
.board-content img{max-width: 100%; height: auto;}
.media-body a, .media-body a:hover{color:#333;}
.files a, .files a:hover{color:#333;}
p{color:#333;}

@media (min-width: 768px){
	.board-title {font-size: 32px; padding: 20px 0 20px 0;}
	.board-content{font-size: 16px; margin-bottom: 30px}
}
/* 게시판 종료 */
.g-left-arrow{left:75px !important;}


/* 제품소개 */
.product-img{height: 280px;}
@media (min-width: 768px) {
	.product-img{height: 215px;}
}

/* 페이징 */
.page-item.active .page-link, .page-item.active .page-link:focus, .page-item.active .page-link:hover {
	border-color: #1A3296;
	background-color: #1A3296;
}
.page-link {color: #1A3296}
.page-link:focus, .page-link:hover {
	color: #1A3296;
}

/* 팝업 */
.mfp-close-btn-in .mfp-close {color: #fff; }
@media (min-width: 992px) {
	.mag-popup{width: 445px !important }
	.mag-popup img{max-width: 445px !important }
}
.pop_close_wrap{margin:8px 15px 8px 0; background:#fff; height:30px; text-align:right;}
.pop_close{cursor: pointer; }
#mag-popup {position: relative; background: #FFF; width: auto; max-width: 500px; margin: 20px auto; }

.scroll-btn{position: absolute; bottom:0; left:50%; z-index: 20; cursor: pointer; cursor: pointer; -webkit-transform: translate(-50%, 0); height: 69px}
.scroll-text{color: #fff; font-family: gmarket-medium; font-size: 12px;}
.scroll-line{position: absolute; background-color:white; width: 1px; height:50px; left:50%;}
