/*===========================================================================
	main-visual
============================================================================*/
.main-visual {position: relative;height:100vh;width:100%;padding-top:100px;}
/* .main-visual .slide-img .back-img {width:100%;height:calc(100vh - 100px) !important ;object-fit:fill;} */

.main-visual .right-box {position: absolute;top:120px;right:40px}
.main-visual .right-box a {display:block;width:200px;}
.main-visual .right-box a:hover {opacity: 0.8;}
.main-visual .right-box img{width:100%;}

.main-visual .slide-img .img01 {position: relative;}
.main-visual .slide-img .img01 p {position: absolute;top:50px;left:80px;width:800px;height:120px}
.main-visual .slide-img .img01 p img{width:100%;height:100%}

.main-visual .slide-img .img02 {position: relative;}
.main-visual .slide-img .img02 p {position: absolute;bottom:40px;right:260px}
.main-visual .slide-img .img02 p img{width:95%;height:85px}

.main-visual .slide-img .main-img {width:100%;height:calc(100vh - 100px);}
.main-visual .slide-img .img01 {background: url(../images/visual-main01.png) no-repeat;background-size:cover;height: 100vh;}
.main-visual .slide-img .img02 {background: url(../images/visual-main02.png) no-repeat;background-size:cover;}
.main-visual .slide-img .img03 {background: url(../images/visual-main03.png) no-repeat;background-size:cover;}
.main-visual .slide-img .img04 {background: url(../images/visual-main04.png) no-repeat;background-size:cover;}
.main-visual .slide-img .img05 {background: url(../images/visual-main05.png) no-repeat;background-size:cover;}
/*===========================================================================
	section01
============================================================================*/
.section01 div{text-align: center;}
.section01 .top {padding-bottom:140px}
.section01 .top img{width:280px;padding-bottom:27px;margin:0 auto}
.section01 .top p{font-size:22px;padding:10px}
.section01 .center {padding-bottom:77px}
.section01 .center img {width:80%;margin:0 auto}
.section01 .bottom p {font-size:20px;color:#616161;text-align: left;padding-bottom:20px}
.section01 div ul {display:flex;justify-content: space-between;flex-wrap: wrap;padding-top:20px}
.section01 div ul li{width:calc(100% / 3 - 10px);padding:20px 10px;border:1px solid #013d79;margin-bottom: 15px;font-size:20px;font-weight: 600;}
.section01 div ul li:hover{background: #013d79;color:#fff}
.section01 div ul li:hover a {color:#fff}
/*===========================================================================
	section02/03
============================================================================*/
.section02 {width:100%;height:250px;background: url(../images/banner01.png);}
.section02 .container {position: relative;height:100%;color:#fff;text-align: left;}
.section02 .container div {position: absolute;top:50%;left:0;transform: translateY(-50%);}
.section02 .container div h3 {text-align: left;color: #fff}

.section03 {width:100%;height:250px;background: url(../images/banner02.png) no-repeat;border-bottom:1px solid #ddd}
.section03 .container {position: relative;height:100%;color:#000;text-align: right;}
.section03 .container div {position: absolute;top:50%;right:0;transform: translateY(-50%);}
.section03 .container h3 {text-align: right;}

/*===========================================================================
	section04
============================================================================*/
.section04 h3{font-size:40px;text-align: center;font-weight: bold;}
.section04 ul{display:flex;justify-content: center;padding-bottom:60px}
.section04 ul li {width:calc(100% / 3);margin:0 auto;text-align: center;}
.section04 ul li img {width:180px;margin-bottom:20px}
.section04 ul li p {font-size:20px;font-weight: bold;}
.section04 ul li p span {color:#013d79}
.section04 .m-vision .pc-img {width:85%;padding-bottom:100px;margin:0 auto}

.section05 .bottom img,
.section06 .bottom img {width:95%; margin:0 auto}
/*===========================================================================
	section07
============================================================================*/
.section07 {padding-bottom:50px}
.section07 .sec-tit{width:100%;margin: 0 auto;text-align: center;}
.section07 .sec-tit h3 {display:inline-block;color:#013d79;padding:15px 50px;}
.section07 h3 {padding-bottom:50px}
.section07 .group {display:flex;flex-wrap:wrap;justify-content: space-between;margin-top:20px}
.section07 .group .list {width:calc(100% / 3 -  20px);padding-bottom:80px}
.section07 .group .list .txt-box {padding-top:30px}
.section07 .group .list .txt-box h4{font-size:18px;color:#013e7a;padding-bottom:10px;}
.section07 .group .list .txt-box h3{font-size:22px;color:#000;padding-bottom:10px;}
.section07 .group .list .txt-box p{font-size:17px;color:#737373}
.section07 .btn-more {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.5rem;
	width: 100%;
	max-width: 120px;
	text-align: center;
	background: rgba(0,0,0, 0.6);
	padding: 1rem;
	border-radius: 4px;
	color: white;
	margin: 0 auto;
    border-radius: 999px;

}
.section07 .btn-more span {
	margin-top: 3px;
}
.section07 .btn-more:hover {
	opacity: 0.9;
}
/* .section07 .btn-more a {display:inline-block;padding:15px 50px;text-align: center;background:#013e7a;color:#fff} */
/* .section07 .btn-more a {display:block;margin:0 auto;width:300px;height:100px;background:url(../images/icon-more-on.png) no-repeat;background-size: contain;}
.section07 .btn-more a:hover {background:url(../images/icon-more-off.png) no-repeat;background-size: contain;} */

.section07 .btn-more img{width:20px;vertical-align: middle;margin-left:6px;}

/*===========================================================================
	section08
============================================================================*/
.section08 .chart {width:80%;margin:0 auto}
/*===========================================================================
	section09
============================================================================*/
.section09 h3 span{color:#013e7a}
.section09 .sec-txt p{font-size:20px;color:#737373}
.section09 .map-box{display:flex;justify-content: space-between;height:500px;padding-bottom:40px}
.section09 .map-box img{height:100%}
.section09 .map-box div {width:calc(100% / 2 - 40px)}
.section09 .map-box iframe {width:100%;height:100%}

/*===========================================================================
	포트폴리오
============================================================================*/
.sub-tit {padding:10px 0;border-top:1px solid #aaa;border-bottom:1px solid #aaa;margin-bottom:20px;font-size:30px}
.sub-tit div {display: flex;align-items: center;}
.sub-tit div h3 {width:50%;color:#013d79;font-size:26px;font-weight: 600;}
.sub-tit h4 {width:50%;color:#000;border-left:5px solid #4cadc0;padding-left:10px;font-weight: normal;font-size:24px}

/*버전1 office */
.version01{display:flex;flex-wrap:wrap;justify-content: space-between;}
.version01 .list {display:flex;width:calc(100% / 2 - 5px);margin-bottom:20px;border:1px solid #013e7a}
.version01 .list .img-box {width:30%;height:200px;border-right:1px solid #013e7a}
.version01 .list .img-box img {height:100%}
.version01 .list .txt-box {width:70%;}
.version01 .list .txt-box h4 {padding:10px;font-size: 19px;background: #013e7a;color:#fff;font-weight: 400;}
.version01 .list .txt-box .office-txt {padding:10px}
.version01 .list .txt-box .office-txt p {font-size:16px;color:#737373;padding-bottom:10px}
.version01 .list .txt-box .office-txt p::before {content: url(../images/icon/icon-check.png);}
/* 버전2 1줄 일때 */
.group .list {margin-bottom:20px}
.group .version02 {display:flex;justify-content: space-between;}
.group .version02 .img-box{width:30%}
.group .version02 .txt-box{width:calc(70% - 20px)}
.group .version02 .txt-box p{display:flex;color:#737373;border-bottom:1px solid#ccc;}
.group .version02 .txt-box p strong{width:120px;color:#000;font-weight: 500;background: #eee;padding:7px}
.group .version02 .txt-box p span {width:calc(100% - 100px);padding:5px;white-space:pre-line;word-break: keep-all;}
/* 버전3 2줄 일때 */
.group .version03 {display:flex;justify-content: space-between;}
.group .version03 .img-box{width:30%}
.group .version03 .txt-box{display:flex;flex-wrap:wrap;width:calc(70% - 20px)}
.group .version03 .txt-box p{display:flex;width:50%;color:#737373;border-bottom:1px solid#ccc;}
.group .version03 .txt-box p.row {width:100%}
.group .version03 .txt-box p strong{width:120px;color:#000;font-weight: 500;background: #eee;padding:7px}
.group .version03 .txt-box p span {width:calc(100% - 120px);padding:5px;white-space:pre-line;word-break: keep-all;}

.po-bottom div p {font-size:22px}
.po-bottom div p span {color:red;font-weight: bold;}
.sub-sec06 .sub-cont h4 {font-size:30px;color:#000;border-left:5px solid #4cadc0;padding-left:10px;margin:30px 0 10px}
.sub-sec06 .sub-cont .rolling {display:flex;align-items: center;width:100%;}
.sub-sec06 .sub-cont .rolling div {padding:2px}
.sub-sec06 .b-img {display:flex;justify-content: space-around;width:100%;height:auto;background-size: contain;}
.sub-sec06 .b-img div {width: calc(100% / 5 - 10px);}
.sub-sec06 .b-img div img {}

/* #rotating_img {
    -webkit-animation: rotation 2s infinite linear;
}


@-webkit-keyframes rotation {
    from {-webkit-transform: rotate(0deg);}
    to   {-webkit-transform: rotate(359deg);}
} */

/*===========================================================================
	고객문의 CONTACT US
============================================================================*/
.top-tit {margin-top:100px;}
.top-tit h2 {font-size:30px;padding:30px 0}
.top-tit h2 span {font-size: 28px;font-weight: 600;}
.top-tit p {font-size:24px;border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:10px 0}
.top-tit p span {display:block;text-align: left;font-size:20px}


.sub-wrap form {margin-bottom:50px}
.sub-wrap form .privacy {margin-bottom:50px}
.sub-wrap form .privacy ul {border:1px solid #737373; padding:20px 20px 10px;margin:20px 0}
.sub-wrap form .privacy ul li {padding-bottom:20px}
.sub-wrap form .privacy ul li h3 {font-size:20px;padding-bottom:5px}
.sub-wrap form .privacy ul li p {font-size:18px;}
.sub-wrap form .privacy label {font-size:18px}

.sub-wrap form .contactUs .form_content {display:flex;align-items: center;border-bottom:1px solid #ddd;padding:10px}
.sub-wrap form .contactUs .form_content h3{width:200px;font-size:18px;font-weight: 500;}
.sub-wrap form .contactUs .form_content input{width:400px;border:1px solid #ddd;padding:10px}
.sub-wrap form .contactUs .form_content textarea {width: 600px;border:1px solid #ddd;padding:10px;resize: none;box-sizing: border-box;}
.sub-wrap form .contactUs .write_btn {width:100%;margin:0 auto;text-align: center;}
.sub-wrap form .contactUs .write_btn button{width:240px;height:60px;padding:10px 30px;border:1px solid #737373;background:#013d79;color:#fff;margin-top:20px;font-size:20px}

@media (max-width:1200px) {
	.section01 .bottom p {font-size:18px}
	.section01 .top img {width:300px}
	.section01 .top p {font-size:20px;}
	.section02 {height: 200px;padding:0 20px;background-size: cover;}
	.section03 {height: 200px;padding:0 20px;background-size: cover;}

	.sec-tit h3 {font-size:24px}
	.sec-tit p {font-size:16px}

	.top-tit h2 {font-size:30px}
	.top-tit h2 span {font-size:24px}

	.sub-tit div {justify-content: space-between;}
	.sub-tit div h3 {width:calc(100% - 200px);font-size:20px}
	.sub-tit div h4 {width:30%;font-size:20px}

	.version01 .list {height:150px}
	.version01 .list .img-box {height:150px}
	.version01 .list .txt-box h4 {font-size:18px}
	.version01 .list .txt-box .office-txt p {font-size:14px}
	.sub-wrap form .privacy label {font-size:16px}

	.sub-wrap form .privacy ul li h3 {font-size:20px}
	.sub-wrap form .privacy ul li p {font-size:16px}
	.sub-wrap form .contactUs .form_content textarea {width:500px}
}
@media (max-width:768px) {
	.top-tit h2 {padding:20px 0}
	.main-visual {padding-top:65px;height:inherit}
	.main-visual .slide-img {height:400px !important}
	.main-visual .right-box {display:flex;position: initial;}
	.main-visual .right-box a {width:calc(100% / 3)}

	.main-visual .slide-img div {width:100%;height:400px !important ;}

	.main-visual .slide-img .main-img {width:100%;height:400px;}
	.main-visual .slide-img .img01 {background: url(../images/m-visual-main01.png) no-repeat;background-size:contain;}
	.main-visual .slide-img .img02 {background: url(../images/m-visual-main02.png) no-repeat;background-size:cover;}
	.main-visual .slide-img .img03 {background: url(../images/m-visual-main03.png) no-repeat;background-size:cover;}
	.main-visual .slide-img .img04 {background: url(../images/m-visual-main04.png) no-repeat;background-size:cover;}
	.main-visual .slide-img .img05 {background: url(../images/m-visual-main05.png) no-repeat;background-size:cover;}
	.main-visual .slide-img .img01 p {position: absolute;top:10px;left:10px}
	.main-visual .slide-img .img01 p img {width:300px; height:50px}
	.main-visual .slide-img .img02 p {position: absolute;bottom:10px;right:10px}
	.main-visual .slide-img .img02 p img {width:300px; height:50px}


	.section01 {margin-top:20px}
	.section01 .top {padding-bottom: 0;}
	.section01 .top img {width:200px;padding-bottom: 0;}
	.section01 .top p {font-size:16px}
	.section01 .center {padding-bottom: 0;}
	.section01 .center img {padding:20px 0}
	.section01 .bottom p {font-size:16px}
	.section01 div ul li {width: 100%;padding:10px}
	.section01 div ul li a {font-size:14px}

	.section02 {background: url(../images/m-section02.png) no-repeat;height:80px;background-size:cover;padding:20px 0}
	.section02 .container div {position:static;transform: initial;}
	/* .section02 .container div h3 {text-align: center;} */
	.section02 .container div p {text-align: left;color:#fff;padding-bottom: 0;}
	.section03 {background: url(../images/m-section03.png) no-repeat;height:80px;background-size:cover;padding:20px 0;margin-bottom:40px}
	.section03 .container div {position:static;transform: initial;}
	/* .section03 .container div h3 {text-align: center;} */
	.section03 .container div p {text-align:right;padding-bottom: 0;}

	.section04 .m-vision {}
	.section04 ul {padding-bottom:20px;align-items: center;}
	.section04 ul li {text-align: center;}
	.section04 ul li img {width:90%}

	.section05 .m-tit {padding-bottom:20px}
	.section06 .m-tit {padding-bottom:20px}

	.section07 .sec-tit h3 {background: #fff;color: #013d79;}
	.section07 .group {margin-top:0}
	.section07 .group .list {width:calc(100% / 2 - 5px);padding-bottom:0}
	.section07 .group .list .txt-box {padding-top:10px}
	.section07 .group .list .txt-box h4 {font-size:13px;font-weight: 500;}
	.section07 .group .list .txt-box h3 {font-size:16px}
	.section07 .group .list .txt-box p {font-size:12px}
	.section07 .btn-more a {background-size:cover;width:140px;height: 32px;}
	.section08 .chart {width:100%}
	.section09 .map-box {display:block;height: auto;}
	.section09 .map-box div {width:100%}
	.section09 .sec-txt p {font-size:16px}
	.section09 .map-box iframe {height:400px}

	.about-wrap .section01 {margin-top:20px}
	.sub-sec06 .sub-cont h4 {font-size:18px}

	.sub-tit div {display:block}
	.sub-tit div h3 {width:100%;padding-bottom:10px;font-size:18px}
	.sub-tit div h4 {width:100%;font-size:16px}

	.sec-tit h3 {font-size:18px}
	.sec-tit p {text-align: center;padding-bottom:20px;font-size: 14px;}

	.version01 .list {width:calc(100% / 2 - 2px);height: auto;}
	.version01 .list .img-box {width:100%;height:150px}
	.version01 .list .txt-box {width:100%;height: 160px;}
	.version01 .list .txt-box h4 {font-size:16px;font-weight: normal;}
	.version01 .list .txt-box p span {font-size:14px}
	.version01 .list .txt-box .office-txt p {padding-bottom:5px}
	.group .version02 {display:block}
	.group .version02 .img-box {width:100%}
	.group .version02 .txt-box {width:100%}
	.group .version02 .txt-box p strong {font-size:14px}
	.group .version02 .txt-box p span {font-size:13px}
	.group .version03 {display:block}
	.group .version03 .img-box {width:100%}
	.group .version03 .txt-box {width:100%}
	.group .version03 .txt-box p {width:100%}
	.group .version03 .txt-box p strong {font-size:14px}
	.group .version03 .txt-box p span {font-size:14px}

	.po-bottom div p {font-size:14px}
	/* .sub-sec06 .sub-cont h4 {font-size:20px} */
	.sub-wrap form .privacy {margin-bottom: 20px;}
	.sub-wrap form .privacy ul {padding:12px}
	.sub-wrap form .privacy ul li h3 {font-size:14px}
	.sub-wrap form .privacy ul li p {font-size:12px}

	.top-tit {margin-top:65px}
	.top-tit h2 {font-size:20px;padding-left:10px}
	.top-tit h2 span {font-size:18px}
	.top-tit p span {font-size:14px}
	.sub-wrap form .privacy label {font-size:12px}
	.sub-wrap form .contactUs .form_content h3 {width:90px;font-size:12px}
	.sub-wrap form .contactUs .form_content input {width:calc(100% - 90px);font-size:11px}
	.sub-wrap form .contactUs .form_content textarea {width:calc(100% - 90px);font-size:11px}
	.sub-wrap form .contactUs .write_btn button {width:140px;height:40px;padding:10px;font-size:13px}

	.main-visual .pc-img{display:none}


}
