@charset "utf-8";

@media (max-width: 1400px) {
	.section01 .cnt02 .col {flex-wrap:wrap; margin:0 -10px -20px; justify-content:center;}
	.section01 .cnt02 .col .row {width:33.33333%; margin-bottom:20px;}

	.section04 .col {display:block;}
	
	.section04 .tit-box .box {margin-bottom:40px;}
	.section04 .img-box {margin:0 0 0 auto;}
	
	.footer .col {display: block;}
	.footer .col .lbx {margin-bottom:60px;}
	.footer .col .lbx .ft-logo {padding-top:0;}
	.footer .col .rbx {max-width:none;}
}

@media (max-width: 1024px) {
	
	#header.hide {transform:translateY(0);} 

	#gnb>ul>li {padding:0 15px;}
	#gnb>ul>li>a {font-size:16px;}
	
	#header .btn {margin-right:20px;}
	#header .btn a {padding:0 15px; line-height:40px; font-size:16px;}

	.main-visual .txt-box h2 {font-size:40px; margin-bottom:16px;}
	.main-visual .txt-box p {font-size:18px; margin-bottom:40px;}
	.main-visual .txt-box a {font-size:20px; padding:0 30px; line-height:60px;}
	.main-visual .txt-box a:before {height:66px;}
	.main-visual .btns {bottom:40px;}
	.main-visual .btns .progress {width:180px; margin-right:15px;}
	/* section01 */
	.section01 {padding:160px 0;}
	.section01 .title {margin-bottom:100px;}
	.section01 .title span {font-size:18px; margin-bottom:18px;}
	.section01 .title h3 {font-size:36px; margin-bottom:30px;}
	.section01 .title p {font-size:18px;}
	.section01 .tit-box {margin-bottom:60px;}
	.section01 .tit-box h4 {font-size:28px; margin-bottom:18px;}
	.section01 .tit-box p {font-size:18px; padding-left:10px;}
	.section01 .tit-box p:before {width:3px; height:16px; top:6px;}

	.section01 .cnt01 {margin-bottom:100px;}
	.section01 .cnt01 .col {padding-left:0; border:2px solid #00A4E4; border-radius:10px 10px 0 0; margin-top:20px; flex-wrap:wrap;}
	.section01 .cnt01 .col .ti {width:100%; height:auto; padding:20px 0; position:relative; display:flex; align-items:center; justify-content:center; text-align:center;}
	.section01 .cnt01 .col .ti p {font-size:16px; transform:rotate(0) translateX(0);}
	.section01 .cnt01 .col .row {padding:20px;}
	.section01 .cnt01 .col .row p {font-size:16px;}

	.section01 .cnt02 .inner {border-radius:30px;}
	.section01 .cnt02 .inner .ti {padding:20px;}
	.section01 .cnt02 .inner .ti .num {font-size:20px;}
	.section01 .cnt02 .inner .ti .tt {font-size:22px;}
	.section01 .cnt02 .inner .ti h4 {font-size:24px;}
	.section01 .cnt02 .inner .ti h4 strong {font-size:30px;}
	.section01 .cnt02 .inner .ti p {font-size:16px;}
	.section01 .cnt02 .inner .tx {height:60px;}
	.section01 .cnt02 .inner .tx p {font-size:20px;}

	/* section02 */
	.section02 {padding:160px 0;}
	.section02 .tit-box {margin-bottom:30px;}
	.section02 .tit-box h3 {font-size:28px; margin-bottom:18px;}
	.section02 .tit-box p {font-size:18px; padding-left:10px;}
	.section02 .tit-box p:before {width:3px; height:16px; top:6px;}
	/* section03 */
	.section03 {margin-bottom:160px;}
	.section03 .cnt {padding:100px 15px 120px; border-radius:30px;}
	.section03 .cnt .tit-box {margin-bottom:50px;}
	.section03 .cnt .tit-box p {font-size:18px; margin-bottom:18px;}
	.section03 .cnt .tit-box h3 {font-size:32px;}
	.section03 .cnt .txt-box {margin-bottom:50px;}
	.section03 .cnt .txt-box dt {max-width:200px; font-size:18px; padding:15px 0;}
	.section03 .cnt .txt-box dt p {padding-left:10px;}
	.section03 .cnt .txt-box dt p:before {width:4px; height:4px; top:8px; left:0;}
	
	
	.section03 .cnt .txt-box dd {padding:0 15px; font-size:16px;}
	.section03 .cnt .btn ul li a {width:240px; line-height:60px; font-size:20px;}
	/* section04 */
	.section04 {padding:160px 0 100px; overflow:hidden;}
	.section04 .col {display:block;}
	.section04 .tit-box {max-width:none;}
	.section04 .tit-box .box {margin-bottom:60px;}
	.section04 .tit-box .tit {margin-bottom:30px;}
	.section04 .tit-box .tit p {font-size:18px; margin-bottom:18px;}
	.section04 .tit-box .tit h3 {font-size:32px;}
	.section04 .tit-box .txt {max-width:none; display:flex;}
	.section04 .tit-box .txt dl {width:33.333333%; padding:20px 10px; border-bottom:0;}
	.section04 .tit-box .txt dt {max-width:90px; font-size:18px; padding:0;}
	.section04 .tit-box .txt dd {font-size:24px;}
	.section04 .img-box {max-width:none; padding-left:0;}
	.section04 .img-box .row {padding-bottom:60px; margin:0 -20px;}
	.section04 .img-box .inner {width:50%; max-width:none; padding:0 20px; margin-bottom:40px;}
	.section04 .img-box .inner:nth-child(even) {transform:translateY(0);}
	.section04 .img-box .inner:hover .img {border-radius:30px;}
	.section04 .img-box .inner .txt p {font-size:18px;}
	.section04 .img-box .inner .txt h4 {font-size:24px;}
	.section04 .img-box .inner .over p {font-size:18px;}
	.section04 .img-box .inner .over h4 {font-size:24px; margin-bottom:18px;}
	.section04 .img-box .inner .over span {font-size:16px;}
	.section04 .img-box .inner .over span:after {width:20px; height:20px;  margin-left:10px; background-size:cover;}
	.section04 .img-box .more a {font-size:20px; padding-right:40px;}
	.section04 .img-box .more a:after {width:30px; height:30px; margin-top:-15px;}
	/* footer */
	.footer {padding-top:60px;}
	.footer .col .lbx {margin-bottom:40px;}
	.footer .col .lbx .ft-logo{font-size: 18px; margin-bottom: 20px; padding-top: 0;}
	.footer .col .lbx ul > li{font-size: 14px;} 
	.footer .col .lbx ul > li span{font-size: 14px;}
	.footer .col .rbx .top-box{padding-bottom:20px;}
	.footer .col .rbx .top-box ol{display: flex; align-items:center; padding-top:0;}
	.footer .col .rbx .top-box ol > li:not(:last-child):after{height: 10px; margin: 0 20px;}
	.footer .col .rbx .top-box ol > li > a{font-size: 14px;}
	.footer .col .rbx .top-box ul{top: 0;}
	.footer .col .rbx .top-box ul > li > a{padding: 5px 15px; font-size: 14px;}
	.footer .col .rbx .b-box{display:block; height:auto; padding-top: 20px; padding-bottom:60px;}
	.footer .col .rbx .b-box .box-lbx li {font-size: 14px;}
	.footer .col .rbx .b-box .box-lbx li span{ font-size: 14px;}
	.footer .col .rbx .b-box .box-rbx h2 a{font-size:40px;}
	.footer .col .rbx .b-box .box-rbx p{font-size: 14px; margin-top: 0;}
	.foot-cnt{display: block; height: auto; padding:20px 0; text-align:center;}
	.foot-cnt > p{font-size: 14px; margin-bottom:20px;}
	.foot-cnt > ol {justify-content:center;}

	
}

@media (max-width: 768px) {
	#header {height:80px;}
	#header .wrap {height:100%;}
	#header .sitelogo a {height:48px; margin-top:-24px;}
	#header .sitelogo a img {height:100%;}

	#gnb>ul>li {padding:0 10px;}
	#gnb>ul>li>a {font-size:14px;}
	
	#header .btn {margin-right:10px;}
	#header .btn a {padding:0 10px; line-height:32px; font-size:14px;}
	
	.quick {bottom:100px; width:50px; border-radius:15px 0 0 15px;}
	.quick a.more {height:100px;}
	.quick a.more span {font-size:16px; padding-right:6px;}
	.quick a.scrolltop {width:50px; height:50px;}
	.quick a.scrolltop img {width:30px;}
	
}

@media (max-width: 640px) {
	
	#gnb {display:none;}

	.main-visual .txt-box h2 {font-size:28px; margin-bottom:14px;}
	.main-visual .txt-box p {font-size:16px; margin-bottom:30px;}
	.main-visual .txt-box a {font-size:18px; padding:0 20px; line-height:50px;}
	.main-visual .txt-box a:before {height:56px;}
	.main-visual .btns {bottom:30px;}
	.main-visual .btns .progress {width:120px; margin-right:10px;}
	/* section01 */
	.section01 {padding:100px 0;}
	.section01 .title {margin-bottom:60px;}
	.section01 .title span {font-size:16px; margin-bottom:16px;}
	.section01 .title h3 {font-size:28px; margin-bottom:20px;}
	.section01 .title p {font-size:16px;}
	.section01 .title p br {display:none;}
	.section01 .tit-box {margin-bottom:30px;}
	.section01 .tit-box h4 {font-size:24px; margin-bottom:16px;}
	.section01 .tit-box p {font-size:16px;}
	.section01 .tit-box p:before {height:10px; top:7px;}
	
	.section01 .cnt01 {margin-bottom:60px;}
	.section01 .cnt01 .col .ti {padding:10px 0;}
	.section01 .cnt01 .col .ti p {font-size:14px;}
	.section01 .cnt01 .col .row {padding:15px; width:50%;}
	.section01 .cnt01 .col .row:nth-child(2) {border-bottom:1px solid #00A4E4; border-right:1px dashed #00A4E4;}
	.section01 .cnt01 .col .row:nth-child(3) {border-right:0; border-bottom:1px dashed #00A4E4;}	
	.section01 .cnt01 .col .row p {font-size:14px;}

	.section01 .cnt02 .col .row {width:50%;}
	.section01 .cnt02 .inner {border-radius:20px;}
	.section01 .cnt02 .inner .ti .num {font-size:16px;}
	.section01 .cnt02 .inner .ti .tt {font-size:18px;}
	.section01 .cnt02 .inner .ti h4 {font-size:20px;}
	.section01 .cnt02 .inner .ti h4 strong {font-size:24px;}
	.section01 .cnt02 .inner .ti p {font-size:14px;}
	.section01 .cnt02 .inner .tx {height:50px;}
	.section01 .cnt02 .inner .tx p {font-size:16px;}

	/* section02 */
	.section02 {padding:100px 0;}
	.section02 .tit-box h3 {font-size:24px; margin-bottom:16px;}
	.section02 .tit-box p {font-size:16px;}
	.section02 .tit-box p:before {height:10px; top:7px;}
	/* section03 */
	.section03 {margin-bottom:100px;}
	.section03 .cnt {padding:60px 15px 100px; border-radius:20px;}
	.section03 .cnt .tit-box {margin-bottom:30px;}
	.section03 .cnt .tit-box p {font-size:16px; margin-bottom:10px;}
	.section03 .cnt .tit-box h3 {font-size:24px;}
	.section03 .cnt .txt-box {margin-bottom:30px;}
	.section03 .cnt .txt-box dl {display:block; text-align:center;}
	.section03 .cnt .txt-box dt {max-width:none; font-size:16px; padding:10px 20px; border-right:0;}
	.section03 .cnt .txt-box dt p:before {top:6px;}
	.section03 .cnt .txt-box dd {padding:10px 20px; font-size:14px;}
	.section03 .cnt .btn ul li a {width:160px; line-height:50px; font-size:15px;}
	/* section04 */
	.section04 {padding:100px 0 60px;}
	.section04 .tit-box .box {margin-bottom:40px;}
	.section04 .tit-box .tit {margin-bottom:20px;}
	.section04 .tit-box .tit p {font-size:16px; margin-bottom:16px;}
	.section04 .tit-box .tit h3 {font-size:24px;}
	.section04 .tit-box .txt dl {display:block; text-align:center;}
	.section04 .tit-box .txt dt {max-width:none; font-size:16px;}
	.section04 .tit-box .txt dd {font-size:20px; width:100%;}
	.section04 .img-box .row {padding-bottom:30px; margin:0 -10px;}
	.section04 .img-box .inner {padding:0 10px; margin-bottom:20px;}
	.section04 .img-box .inner:hover .img {border-radius:20px;}
	.section04 .img-box .inner .txt p {font-size:16px;}
	.section04 .img-box .inner .txt h4 {font-size:20px;}
	.section04 .img-box .inner .over p {font-size:16px;}
	.section04 .img-box .inner .over h4 {font-size:20px; margin-bottom:14px;}
	.section04 .img-box .inner .over span {font-size:14px;}
	.section04 .img-box .more a {font-size:18px; padding-right:30px;}
	.section04 .img-box .more a:after {width:20px; height:20px; margin-top:-10px;}
	/* footer */
	.footer {padding-top:40px;}
	.footer .col .lbx {margin-bottom:30px; text-align:center;}
	.footer .col .lbx .ft-logo{font-size: 16px;}
	.footer .col .lbx ul > li{font-size: 12px; justify-content:center;} 
	.footer .col .lbx ul > li span{font-size: 12px;}
	.footer .col .rbx .top-box{padding-bottom:16px; display:block;}
	.footer .col .rbx .top-box ol{justify-content:center; padding-top:0; margin-bottom:20px;}
	.footer .col .rbx .top-box ol > li > a{font-size: 12px;}
	.footer .col .rbx .top-box ul{justify-content:center;}
	.footer .col .rbx .top-box ul > li > a{padding:5px 10px; font-size: 12px;}
	
	.footer .col .rbx .b-box{padding-bottom:30px;}
	.footer .col .rbx .b-box .box-lbx li {font-size: 12px;}
	.footer .col .rbx .b-box .box-lbx li span{ font-size: 12px;}
	.footer .col .rbx .b-box .box-rbx h2 a{font-size:30px;}
	
	.footer .col .rbx .b-box .box-rbx p{font-size: 14px; margin-top: 0;}
	.footer .col .rbx .b-box .box-lbx .flex {display:block;}
	.footer .col .rbx .b-box .box-lbx .flex li:first-child span a {font-size:12px;}
	.footer .col .rbx .b-box .box-lbx .flex li span a {font-size:12px;}
	.foot-cnt{display: block; height: auto; padding:20px 0; text-align:center;}
	.foot-cnt > p{font-size: 14px; margin-bottom:20px;}
}

@media (max-width: 400px) {
	
	.section03 .cnt .btn ul {display:block; margin:0 0 -20px; text-align:center;}
	.section03 .cnt .btn ul li {margin-bottom:20px;}
	.section03 .cnt .btn ul li a {display:inline-block;}
	
	.section04 .img-box .inner {width:100%;}
	
}