@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');
@font-face {
  font-family: 'LotteMartDream';
  font-style: normal;
  font-weight: 400;
  src: url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamMedium.woff2') format('woff2'), url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamMedium.woff') format('woff');
}
@font-face {
  font-family: 'LotteMartDream';
  font-style: normal;
  font-weight: 700;
  src: url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamBold.woff2') format('woff2'), url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamBold.woff') format('woff');
}
@font-face {
  font-family: 'LotteMartDream';
  font-style: normal;
  font-weight: 300;
  src: url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamLight.woff2') format('woff2'), url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamLight.woff') format('woff');
}
.lottemartdream * {
 font-family: 'LotteMartDream', sans-serif;
}



.clear:after { 
    content:""; 
    display:block; 
    clear:both;
}
* { margin:0; padding:0; outline:none; }
body { line-height:1; font-size:14px; font-weight:400; color:#000; font-family: 'Noto Sans KR', sans-serif; word-wrap: break-word; word-break: keep-all; }
h1, h2, h3, h4, h5, h6 { margin:0; font-family: 'Noto Sans KR', sans-serif; line-height:1;  }
ul, ol { list-style:none; margin:0; }
a { outline:0; text-decoration:none; }
a:focus { outline:none; }
img { border:none; outline:none; max-width: 100%; }
p { margin:0; padding:0; word-break: keep-all;  }

/* 1400»çÀÌÁî */
.at-container { max-width: 1400px; }

@media (max-width:1450px) {
	.at-row {margin-left: 0px; margin-right: 0px; }
}






/* top_bar */
.top_bar_wrap { background:#60a7de; }
.top_bar { 
-ms-display:flex; -ms-justify-content:flex-end;
display:flex; justify-content:flex-end; padding:10px 0;
}
.top_bar > ul { -ms-display:flex; display:flex; }
.top_bar .t_btn { font-family: 'LotteMartDream'; color:#fff; font-size:13px; padding:0 10px; text-transform: uppercase; position: relative; }
.top_bar .t_btn:after { content: '|'; position: absolute; right: -2px; top: -1px; color: inherit; }
.top_bar .t_btn:last-child:after { display: none; }
.top_bar .t_btn a { color: inherit; }

@media (max-width:768px) {
	.top_bar { justify-content:center; }
}




/*---------------------------------------------------- Çìµå¼¼Æà -----------------------------------------------------------------------*/

.header_wrap { background:#fff; box-shadow:0 5px 10px rgba(0,0,0,.3); position:absolute; left:0; width:100%; z-index:2000; }

#header { 
-ms-display:flex; -ms-justify-content:space-between; -ms-align-items:center;
display:flex; justify-content:space-between; align-items:center;
}



/* menu */
/*---------------------------------------- outer ---------------------------------------------*/
#h_menu .outer { -ms-display:flex; display:flex; }
#h_menu .outer > li { position:relative; margin-right: 40px; } 
#h_menu .outer > li:last-child { margin-right: 0; }
#h_menu .outer > li > a {
display:block; font-size:18px; font-weight:500; text-align:center; 
height:100px; line-height:100px; transition:color 0.4s; color: #000; 
}
/*---------------------------------------- //outer ---------------------------------------------*/


/*---------------------------------------- inner ---------------------------------------------*/
#h_menu .outer > li > .inner {
position:absolute; right:0; z-index:1; border-top:5px solid #60a7de; width:200px; background:#fff; padding:10px 0; display:none;
}
#h_menu .outer > li > .inner > li > a  { display:block; transition:all 0.4s; padding:15px 20px; font-size:15px; text-align:right;  }
/*---------------------------------------- //inner ---------------------------------------------*/



/* hover */
#h_menu .outer > li:hover > a { color:#60a7de; }
#h_menu .outer > li:hover > .inner { display:block; } 
#h_menu .outer > li > .inner > li > a:hover { color:#60a7de; background:rgba(204,204,204,.2); } 



/* ÆäÀÌÁö ¹× °Ô½ÃÆÇ À̵¿Çϸé ÇØ´ç ¸Þ´º ½ºÅ¸ÀÏ */
#h_menu .outer > li > a.on { color:#ff0000; font-size: 30px;} 

/* scrollÇßÀ»¶§ ÇØ´õºÎºÐ È¿°ú */
.header_wrap.scroll { position:fixed; right:0; top:0; } 



@media (max-width:1200px) {
	#h_menu .outer > li { margin-right: 20px; }
	#h_menu .outer > li > a { font-size:15px; } /* outer */
}




@media (max-width:991px) {
	
	.header_wrap { position:static; }
	.header_wrap.scroll { position:static; } 
	.header_wrap #header { padding:10px 20px; }

	/* ·Î°í */
	.header_wrap #header .logo a { display: block; max-width: 200px; }
	.header_wrap #header .logo a img { max-width: 100%; }

	/* ¸ð¹ÙÀÏ ¿­±â ¹öÆ° */
	.header_wrap .open_btn { font-size:25px; cursor:pointer; color:#000;}



	

	/* menu */
	.menu_box { 
	background-color:#60a7de; width: 20em; height: 100%; 
	position: fixed; right:0; top: 0; z-index:9999; margin-right:-20em; transition:margin-right 0.3s;
	}
	#h_menu {
	width: 20em; height: 100%; overflow-x: hidden; overflow-y:auto; position: absolute;  top:0; 
	}

	/* ¸ð¹ÙÀϴݱâ¹öÆ° */
	.close_btn { width:50px; height:50px; margin-right:auto; margin-left:0; cursor:pointer; }
	.close_btn > i { display:block; color:#fff; text-align:center; line-height:50px; font-size:30px; }
	
	

	/*---------------------------------------- outer ---------------------------------------------*/
	#h_menu .outer { flex-wrap:wrap; padding:30px 0; border-top:1px solid rgba(255,255,255,.1); }
	#h_menu .outer > li { width:100%; margin-right: 0; }
	#h_menu .outer > li > a { 
	padding:12px 20px; font-weight:500; color:rgba(255,255,255,0.7); text-align:left; height:auto; line-height:1; border-bottom:1px solid rgba(255,255,255,.4);
	pointer-events:none;
	}
	/*---------------------------------------- //outer ---------------------------------------------*/

	/*---------------------------------------- inner ---------------------------------------------*/
	#h_menu .outer > li > .inner { 
	position:static; width:100%; padding:0; margin-left:30px; border-left:1px solid rgba(255,255,255,0.4); background:none; border-top:none;
	}
	#h_menu .outer > li > .inner > li:last-child > a { border-bottom:none; }
	#h_menu .outer > li > .inner > li > a { padding:10px 0 10px 15px; font-size: 14px; position:relative; text-align:left; color:#fff; }
	#h_menu .outer > li > .inner > li > a:before { 
	content:''; position:absolute; left:-3px; top:50%; transform:translateY(-50%); width:6px; height:6px; border-radius:50%; background:#fff; 
	}
	/*---------------------------------------- //inner ---------------------------------------------*/
	

	/* hover */
	#h_menu .outer > li:hover > a { color:#fff; }
	#h_menu .outer > li:hover .inner { display:none; } /* ¸ð¹ÙÀÏÀ϶§ inner ³ª¿À°Ô ÇÏ´Â ÈĹö È¿°ú X */
	#h_menu .outer > li > .inner > li > a:hover { color:#fff; background:none; } 


	/* ¸ð¹ÙÀϸ޴º¹Ú½º º¸ÀÌ°Ô Çϴ Ŭ·¡½º */
	.menu_box.inactive { margin-right:0; } 

	/* ¸ð¹ÙÀÏ¿¡¼­ outer li Ŭ¸¯ÇßÀ»¶§ inner ³ª¿À´Â È¿°ú */
	#h_menu .outer > li.on > a { border-bottom:1px solid transparent; }
	#h_menu .outer > li.on .inner { display:block; }

	/* ÆäÀÌÁö ¹× °Ô½ÃÆÇ À̵¿Çϸé ÇØ´ç ¸Þ´º ½ºÅ¸ÀÏ */
	#h_menu .outer > li > a.on { color:rgba(255,255,255,1); border-bottom:1px solid rgba(255,255,255,.4); }


	/* scrollÇßÀ»¶§ ÇØ´õºÎºÐ È¿°ú */
	.header_wrap.scroll #h_menu .outer > li > a { height: auto; line-height:1; }
	
	
}



/*---------------------------------------------------- Çìµå¼¼Æà ³¡ -----------------------------------------------------------------------*/








/*--------------------------------------------------- À妽º¼¼Æà ----------------------------------------------------------------------------*/



.test_index { height:1200px; background:#ddd; }

.wrap { padding-top:100px; }
@media(max-width:991px) {
	.wrap { padding-top:0; }
}




h2 { text-align: center; margin-bottom: 30px; text-transform: uppercase; font-weight: 700; margin-top: 50px; }

/* ½º¿ÍÀÌÇÁ½½¶óÀÌµå ±âº»¼ÂÆà */
.swiper-container { width: 100%; height: 100%; }
.swiper-slide { 
text-align: center; font-size: 18px; background: #fff;
display: flex;
justify-content: center;
align-items: center;
}
.swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; }






/* sample1 */
.mySwiper1 { padding: 0 0 50px; }

/* mySwiper_H */
.mySwiper_H { padding: 50px 0; width: 70%; height: 400px; }

/* sample2 */
.mySwiper2 { padding: 50px 0; width: 70%; height: 400px; }
.mySwiper2 .swiper-pagination-bullet { width: 18px; height: 18px; line-height: 18px; color: #fff; font-size: 13px; }
.page_number { text-align: center; font-size: 20px; font-weight: 700; }


/* sample3 */
.sample3 { 
display:flex; flex-wrap:wrap; 
padding: 50px 0 100px 50px; overflow: hidden;
}
.smaple3H2 { font-size: 40px; margin-top: 100px; padding-left: 50px; }

.sample3 > .swipeController { width: 25%; height: 380px; }
.sample3 > .swipeController .swiper-pagination { right: auto; left: 0; top: 0; transform:translate3d(0,0,0) }
.sample3 > .swipeController .swiper-pagination-bullet { 
width: auto; height: auto; opacity: 1; border-radius:0; background: none; font-size: 18px; text-align: left; position: relative; padding-right:100px;
}
.sample3 > .swipeController .swiper-pagination-bullet:after { 
content: ''; position: absolute; right: 0; top: 50%; transform:translateY(-50%); width: 100px; height: 2px; background: #000; display: none;
}
.sample3 > .swipeController .swiper-pagination-bullet-active { font-size: 24px; }
.sample3 > .swipeController .swiper-pagination-bullet.swiper-pagination-bullet-active:after { display: block; }
.sample3Btn { bottom: 0; top: auto; margin-top: 0; }
.sample3 .swiper-button-prev { left: 0; }
.sample3 .swiper-button-next { right: auto; left: 47px; }


.sample3 > .swipeItem { width: 75%; }
.sample3 > .swipeItem .swiper-slide { justify-content:flex-start; }
.sample3 > .swipeItem .img { width: 40%; }
.sample3 > .swipeItem .linkList { align-self:flex-start; width: 60%; text-align: left; padding-left: 20px; display:flex; flex-wrap:wrap; }
.sample3 > .swipeItem .linkList > li:first-child { width: 100%; margin-bottom: 20px; }
.sample3 > .swipeItem .linkList > li { width: 50%; }
.sample3 > .swipeItem .linkList h3 { font-size: 30px; }

@media (max-width:1400px) {
	.sample3 { padding: 0 0 100px 50px; }

	.sample3 > .swipeController { width: 100%; height: 60px; margin-bottom: 20px; }
	.sample3 > .swipeController .swiper-pagination { top: 50%; transform:translate3d(0,-50%,0); text-align: left; padding-left: 50px; }
	.sample3 > .swipeController .swiper-pagination-bullet { padding-right: 0; padding-bottom: 5px; }
	.sample3 > .swipeController .swiper-pagination-bullet:after { transform:translateY(0); top: auto; bottom: 0; width: 100%; }
	.sample3 > .swipeController .swiper-pagination-bullet-active { font-size:18px; font-weight: 700; }
	.sample3 .swiper-button-next { right: 0; left: auto; }


	.sample3 > .swipeItem { width: 100%; }
	.sample3 > .swipeItem .swiper-slide { flex-wrap:wrap; }
	.sample3 > .swipeItem .img { width: 100%; }
	.sample3 > .swipeItem .linkList { width: 100%; padding-left: 0; margin-top: 20px; }
}
@media (max-width:991px) {
	.smaple3H2 { padding-left: 0; padding: 0 15px; }
	.sample3 { padding: 0 15px 50px; }
}
@media (max-width:768px) {
	.sample3 > .swipeController { height: 100px; }
	.sample3 > .swipeController .swiper-pagination { top: 0; transform:translate3d(0,0,0); padding-left: 0; display:flex; flex-wrap:wrap; height: 60px; }
	.sample3 > .swipeController .swiper-pagination-bullet { width: 33.3333%; margin: 0; }
	.sample3 > .swipeController .swiper-pagination-bullet:after { display: none; }
	.sample3 > .swipeController .swiper-pagination-bullet.swiper-pagination-bullet-active:after { display: none; }
	.sample3 .swiper-button-next { right: auto; left: 47px; }
}


/* sample4 */
.mySwiper4 { margin-bottom: 100px; }
.mySwiper4 .parallax-bg { 
	position: absolute; left: 0; top: 0; width: 130%; height: 100%; 
	-webkit-background-size: cover; background-size: cover; background-position: center;
}

.mySwiper4 .swiper-slide { display: block; color: #fff; padding: 40px 60px; box-sizing: border-box; background: none; text-align: left; }

.mySwiper4 .swiper-slide .title { font-size: 41px; font-weight: 300; }

.mySwiper4 .swiper-slide .subtitle { font-size: 21px; }

.mySwiper4 .swiper-slide .text { font-size: 14px; max-width: 400px; line-height: 1.3; }


/*--------------------------------------------------- À妽º¼¼Æà ³¡ ----------------------------------------------------------------------------*/






/*--------------------------------------------------- ǪÅͼ¼Æà ----------------------------------------------------------------------------*/

/* footer_box*/
footer { background: #626262; }

footer > .contents_box { padding: 15px 0 20px; }
footer .contents {
-ms-display:flex; -ms-flex-wrap:wrap; -ms-align-items:center;
display:flex; flex-wrap:wrap; align-items:center;
}
footer .contents > li { font-weight: 300;  }
footer .contents > .f_logo { width: 300px; text-align: center; }

footer .textBox { padding: 0 20px; }
footer .textBox > div { line-height: 1.8; font-size: 14px; color: #fff; }
footer .textBox > div a { color: inherit;}
footer .textBox > .text > span { position: relative; margin-right:10px; font-weight: inherit;  }
footer .textBox > .text > span:after { content:'|'; position:absolute; right:-8px; top:50%; transform:translateY(-55%); }
footer .textBox > .text > span:last-child:after { display: none; }
footer .textBox > .copy { text-transform: uppercase; font-weight: inherit; }




footer > .info_box { padding:10px 0; background:#313131; }


footer > .info_box .info { 
-ms-display:flex; -ms-justify-content:center; -ms-flex-wrap:wrap; 
display:flex; justify-content:center; flex-wrap:wrap; 
text-align: center;
}
footer .info > .item { position:relative; }
footer .info > .item:before { content:'|'; position:absolute; right:7px; top:50%; transform:translateY(-50%); width:1px; height:13px; background:#fff; }
footer .info > .item:last-child:before { display:none; }
footer .info > .item > a { display:block; color:#fff; font-size:13px; font-weight:500; line-height:1.8; margin-right:15px;  }

@media (max-width:1200px) {
	footer .textBox { width: calc( 100% - 300px ); padding: 0; padding-left: 20px; }
}

@media (max-width:991px) {
	footer .contents > .f_logo { width: 100%; text-align: left; margin-bottom: 20px; }
	footer .textBox { width: 100%; padding-left: 0; }
}

@media (max-width:768px) {
footer .textBox > .text > span { display:block; margin-right:0; }
footer .textBox > .text > span:after { display:none; }
}
@media (max-width:450px) {
footer > .info_box .info {  }
footer .info > .item { width:50%; }
footer .info > .item:nth-child(1) { order:1; }
footer .info > .item:nth-child(2) { order:4; }
footer .info > .item:nth-child(3) { order:3; }
footer .info > .item:nth-child(4) { order:2; }
footer .info > .item:before { right: 0; }
footer .info > .item:nth-child(2n):before { display:none; }
footer .info > .item > a { margin-right: 0; }
}

/*--------------------------------------------------- ǪÅͼ¼Æà ³¡ ----------------------------------------------------------------------------*/









/*--------------------------------------------------- ¼­ºêÆäÀÌÁö¼¼Æà ----------------------------------------------------------------------------*/

/* ¼­ºêÆäÀÌÁö Æеù */
.tmt_sub_frame { padding:30px 0 50px; min-height: 600px; }

/*--------------------------------------------------- ¼­ºêÆäÀÌÁö¼¼Æà ³¡ ----------------------------------------------------------------------------*/



/* °Ô½ÃÆÇ ¹× °Ô½ÃÆÇÇìµå µî ±âŸ ¹öÆ°µé ±âº»Ä÷¯ º¯°æ */
.btn.btn-color {border: 1px solid #60a7de; background-color: #60a7de;}
.btn.active.btn-color, .btn.btn-color:hover, .btn.btn-color:focus, .btn.btn-color:active {background-color: #60a7de;}
.border-color, i.border-color, img.border-color {border-color: #60a7de;}