@charset "utf-8";


span.btn {display:inline-block; width:180px; border-radius:50px; text-align:center; cursor:pointer; height:50px; line-height:50px; font-size: 16px;}
span.btn.t1 {color: #fff; background-color: #142b4d; border: 1px solid #142b4d;}
span.btn.t2 {color: #111; background-color: #fff;	 border: 1px solid #111;	}

@media (max-width:767px) {

}

.swiper-container { width: 100%; height: 100%; }
.swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	overflow:hidden;

	/* Center slide text vertically */
	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;
}

.swiper-pagination-bullet {border-radius:0px !important; width:40px; height:3px; background:#fff;}
.swiper-pagination-bullet-active {background:#fff !important;}

.slide-con {position:absolute; width:100%; text-align:center; top:50%; transform:translateY(-50%);}
.slide-con h2 {font-size:54px; color:#fff; text-align:center; font-family: 'Roboto', sans-serif;}
.slide-con h4 {color:#fff; font-weight:normal; margin:20px 0 45px 0 ;font-family: 'Noto Sans KR', sans-serif; }
.slide-con h4 p {color:#fff; font-size:17px;}
.slide-con span.slide-btn {display:inline-block; border:1px solid #fff; width:180px; font-size:18px; color:#fff; border-radius:50px; padding:15px 0; cursor:pointer;}

.section {width:100%; text-align:center; padding:140px 0;}

.m1 {position: relative; display:table; width:1200px; margin:0 auto;}
.m1 dl {display:table-row;}
.m1 dl dd {display:table-cell; width:300px; height:400px; padding:10px; vertical-align:top; box-sizing:border-box;}
.m1 dl dd div {width:100%; height:100%; box-shadow:2px 2px 5px #ccc; vertical-align:middle;}
.m1 dl dd div.first {background-color:#193b61; box-shadow:10px 10px 15px 0 #ccc; text-align:center; padding:125px 0;} 
.m1 dl dd div.first span {display:block;}
.m1 dl dd div.first span:nth-child(1) {color:#798ba3; font-size:14px; line-height:18px; display: none;}
.m1 dl dd div.first span:nth-child(2) {color:#fff; font-size:36px; font-weight:bold; padding:20px 0; line-height:40px;}
.m1 dl dd div.first span:nth-child(3) {color:#fff; font-size:18px; line-height:26px;}
.m1 dl dd div {padding:60px 30px 60px 45px; text-align:left;}
.m1 dl dd div img {display:block;}
.m1 dl dd div strong {display:block; font-size:26px; margin-top:5px; padding:20px 0 25px 0;}
.m1 dl dd div span {display:block; font-size:18px; line-height:26px; color:#565656; letter-spacing:-1px;}

.main_portfolio {width:1200px; margin:80px auto;}

@media (max-width:1199px) {
	.wrap .header .inner {width:100%;}
	.wrap .footer .inner {width:100%;}
	
	.main_portfolio {width:100%;}
}


@media (min-width:1910px) {
	.swiper-slide img {width:100%;}
}


@media (min-width:1024px) and (max-width:1199px) {
	.m1 {width:100%;}
	.m1 dl dd {width:25% !important;}
}


@media (min-width:768px) and (max-width:1023px) {
	.m1 {margin:0; width:100%; padding:1.5rem; height:auto;}
	.m1 dl dd {display:block; width:100%; height:auto;}
	.m1 dl dd div {padding:1.5rem !important;}
	.m1 dl dd div.first {padding:1.5rem !important;}
}


@media (max-width:767px) {
	.mainslide {height:35.0rem;}

	.slide-con h2 {font-size:1.5rem;}
	.slide-con h4 {font-size:0.875rem;}
	.slide-con h4 p {font-size: 0.825rem; margin: 0.75rem 0;}
	.slide-con h4 p span {display:block; height: 0.75rem;}
	.slide-con span.slide-btn {width:8.0rem; padding:0.625rem 0; font-size: 0.875rem;}
	
	.section {padding:2.0rem 0;}

	.m1 {margin:0; width:100%; padding:1.5rem; height:auto;}
	.m1 dl dd {display:block; width:100%; height:auto;}
	.m1 dl dd div {position:relative; padding:1.5rem !important;}
	.m1 dl dd div.first {padding:1.5rem !important;}
	.m1 dl dd div.first span {margin:0;}
	.m1 dl dd div.first span:nth-child(1) {font-size:0.625rem; }
	.m1 dl dd div.first span:nth-child(2) {font-size:1.5rem; padding:0.5rem 0; line-height: 1.75rem;}
	.m1 dl dd div.first span:nth-child(3) {font-size:0.75rem;}
	.m1 dl dd div.first br {all:unset; display:none;}

	.m1 dl dd div img  {position:absolute; top:50%; transform:translateY(-50%); width:3.0rem;}
	.m1 dl dd div strong {font-size:1.125rem; margin-left:3.75rem; margin-top:0; padding: 0.75rem 0;}
	.m1 dl dd div span {font-size:0.75rem; margin-left:3.75rem; line-height:1.0rem;}

	.main_portfolio {width:100%;}
}


.banner {width: 100%; min-height: 400px; line-height: 400px; text-align: center;}
.banner.t1 {background: url(/images/main/banner_01.jpg) no-repeat 100% 100%; background-attachment:fixed; background-position:center center;  background-size:cover; }
.banner.t1 h2 {color:#fff; font-size:35px;}

.banner.t2 {background: url(/images/main/banner_02.jpg) no-repeat 100% 100%; background-attachment:fixed; background-position:center center;  background-size:cover; }
.banner.t2 div {position:relative; width:100%; height:400px; background-color:rgba(0,0,0,0.5);}
.banner.t2 div h2 {font-size:36px; margin:0; color:#fff; line-height:36px; padding-top:115px; padding-bottom:20px;}
.banner.t2 div h4 {font-size:20px; margin:0; color:#fff; line-height:20px; padding-bottom:45px;}
.banner.t2 div span {display:inline-block; color:#fff; width:180px; background-color:#142b4d; border-radius:50px; text-align:center; cursor:pointer; height:50px; line-height:50px;}

@media (max-width:767px) {
	.banner.t1 h2 {font-size: 1.25rem;}

	.banner.t2 div h2 {font-size: 1.5rem; line-height:2.0rem; padding-top:4.0rem; padding-bottom:1.0rem;}
	.banner.t2 div h4 {font-size: 0.75rem; line-height:2.0rem; padding: 0 1.5rem 3.0rem 1.5rem; }
}


.portfolioview {height:450px; background:#fff; cursor:pointer;}
.portfolioview .imgarea {background-color:#fff; margin:15px; overflow:hidden;}
.portfolioview .imgarea img {height: 100%; }
.portfolioview .imgarea img.typewidth { width: auto;}
.portfolioview .imgarea img.typeheight { width: auto;}
.portfolioview .txtarea {padding: 15px 15px 45px 15px; background-color:#fff; top: 77%; position:absolute; text-align:left; width:100%; left: 0;}
.portfolioview .txtarea span {display:block;}
.portfolioview .txtarea span:nth-child(1) {color: #999; font-size: 14px; line-height: 22px;}
.portfolioview .txtarea span:nth-child(2) {font-family: 'Noto Sans KR', sans-serif;  color: #111; font-size: 18px; line-height: 26px;}


@media (max-width:1199px) {
	.portfolioview .imgarea img.typewidth { width: 200% !important;}
	.portfolioview .imgarea img.typeheight { width: 100% !important;}
}

#fbfeed {max-width: 1200px; margin: 0 auto; padding-top:40px;}
.myfb_message {width:33.3%; box-sizing:border-box; transition: all .3s;}
.myfb_message div.img {max-height: 235px; min-height: 235px; overflow: hidden; padding: 0; margin: 0; box-shadow:0 0 0 0 #fff; border-radius: 0;}
.myfb_message div.img img {width:100%; display:block;}
.myfb_message div {text-align:left; margin:5px; padding: 12px; box-shadow:0px 0px 5px #ccc; border-radius:10px;}
.myfb_message div table {margin:10px 0;}
.myfb_message div table:nth-child(1) tr td {vertical-align: top;}
.myfb_message div table tr td {vertical-align: bottom;}
.myfb_message div table tr td img.profile {border-radius:50%; width: 40px;}
.myfb_message div h2{color:#002f6c; padding-left:10px; margin:5px 0 0 0; font-size:14px;}
.myfb_message div h4 {color:#aaa; padding-left:10px; margin:0; font-size:11px; font-weight:normal;}
.myfb_message div p {font-size:12px; font-weight:normal; margin-bottom: 30px; height: 50px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.myfb_message div.fb_box {background-color:#fafafa; vertical-align:middle; padding:5px 10px; margin:0; color:#002f6c; font-size:10px; width:155px; cursor:pointer;}
.myfb_message div.fb_box img {vertical-align:middle; width:32px; height:32px; display:inline-block;}
span.fb_shortcut {color:#002f6c; font-size:11px;}


@media (min-width:768px) and (max-width:1023px) {
	.myfb_message {width:50%; padding:0.25rem; transition: all .3s;}
}


@media (max-width:767px) {
	.myfb_message {width:100%; padding:0.25rem 1.0rem; transition: all .3s;}

	.myfb_message:nth-child(4),
	.myfb_message:nth-child(5),
	.myfb_message:nth-child(6) {display: none;}
}