@charset "utf-8";

@media (max-width: 1600px) {
	/* header */
	#gnb > ul > li {width: 180px;}
	#gnb:hover > ul > li {width: 200px;}

	/* main-visual */
	.main-visual .text-box h2 {font-size: 75px;}
	.btn-scroll-down {right: 15px;}

	/* footer */
	html.scroll-fade .btn-scroll-top {right: 15px;}
}

@media (max-width: 1400px) {
	/* header */
	#gnb > ul > li {width: 170px;}
	#gnb:hover > ul > li {width: 170px;}
	#gnb > ul > li.m5 > a:before {top: 15px;}
	#gnb > ul > li.m5:hover > a:before {top: 20px;}

	.m-section03-support .wrap {gap: 80px;}
	.m-section03-support .tab-cont > ul {gap: 40px;}
	.m-section03-support .tab-cont > ul > li {width: calc(50% - 20px);}
	.m-section03-support .tab-cont a {padding: 55px 40px 64px 40px;}
}

@media (max-width: 1200px) {
	/* header */
	#gnb > ul > li {width: 130px;}
	#gnb:hover > ul > li {width: 130px;}
	#gnb > ul > li > a {font-size: 16px;}
	#gnb .submenu ul li a {font-size:16px; word-break: break-all;}

	/* main-visual */
	.main-visual .text-box h2 {font-size: 60px;}

	.section-title h3 {font-size: 60px;}

	.m-section02 ul li h4 {font-size: 40px;}

	.m-section03-support .wrap {gap: 40px;}
	.m-section03-support .text-box {max-width: 345px;}
	.m-section03-support .tab-cont a {padding: 50px 30px 54px 30px;}
	.m-section03-support .tab-cont .title {padding-bottom: 20px; margin-bottom: 20px;}
	.m-section03-support .tab-cont .title h4 {font-size: 24px;} 
	.m-section03-support .tab-cont .details {font-size: 18px;}
	.m-section03-support .tab-cont .date {font-size: 16px;}
	.m-section03-support .tab-cont .icon {bottom: 40px; right: 30px;}
}

@media (max-width: 1024px) {
	/* header */
	#header {height:80px;}
	#header.hide {transform:translateY(0);}
	#header .sitelogo a {margin-top: -24;}
	#header .sitelogo img {width: 150px;}
	#gnb {display:none;}
	.lang-selector {right: 60px;}

	/* main-visual */
	.main-visual {margin-top: 80px;}
	.main-visual .item {height: calc(100vh - 80px);}
	.main-visual .text-box h2 {font-size: 55px;}
	.main-visual .controler-wrap {bottom: 90px;}
	.main-visual .slick-dots {gap: 15px;}
	.main-visual .slick-dots button {width: 120px; font-size: 16px; padding: 15px 5px;}
	.btn-scroll-down {bottom: 30px;}

	.section-title h3 {font-size: 55px;}
	.section-title span {margin-left: 10px;}
	.section-title p {font-size: 22px;}

	.m-section01:before {display: none;}
	.m-section01 .wrap {width: 100%;}
	.m-section01 .section-title {margin-bottom: 50px; padding-left: 30px;}
	.m-section01 .text-box {padding: 100px 0 550px;}
	.m-section01 .text-box li:not(:last-child) {margin-bottom: 20px;}
	.m-section01 .text-box a {width: 100%; padding: 20px 30px;}
	.m-section01 .text-box a:before {width: 100%;}
	.m-section01 .text-box a:hover:before {opacity: 0; left: 0}
	.m-section01 .text-box .active a:before {opacity: 1; left: 0;}
	.m-section01 .text-box h4 {font-size: 32px; margin-bottom: 20px;}
	.m-section01 .text-box p {font-size: 16px;}
	.m-section01 .text-box p:after {height: 14px;}
	.m-section01 .text-box .btn {margin-right: -55px;}
	.m-section01 .text-box a:hover .btn {opacity: 0;}
	.m-section01 .text-box a:hover .btn:before {opacity: 0;}
	.m-section01 .text-box .active a:hover .btn {opacity: 1;}
	.m-section01 .text-box .active a:hover .btn:before {opacity: 1;}
	.m-section01 .img-box {top: auto; bottom: 0; width: 100%; height: 500px;}

	.m-section02 ul li a:hover .wrap {transform: translateY(-200px);}
	.m-section02 ul li .icon {margin-bottom: 20px;}
	.m-section02 ul li .icon img {width: 100px;}
	.m-section02 ul li h4 {font-size: 30px; margin-bottom: 40px;}

	.m-section03 {overflow: hidden;}
	.m-section03-tech {padding: 250px 0;}
	.m-section03-tech .section-title h3 {margin-bottom: 30px;}
	.m-section03-tech .section-title p {margin-bottom: 44px;}
	.btn-view-more {width: 170px; font-size: 16px; line-height: 52px; padding: 0 25px;}
	.btn-view-more:after {right: 22px;}

	.m-section03-support {padding-bottom: 150px;}
	.m-section03-support .wrap {display: block;}
	.m-section03-support .text-box {position: relative; top: auto; max-width: none;}
	.m-section03-support .section-title {margin-bottom: 50px;}
	.m-section03-support .tab-menu-wrap {margin-bottom: 0;}
	.m-section03-support .tab-menu-wrap li:not(:last-child) {margin-bottom: 10px;}
	.m-section03-support .tab-menu-wrap a {width: 190px; line-height: 56px; padding: 0 20px 0 30px; font-size: 18px;}
	.m-section03-support .btn-wrap {position: absolute; bottom: 10px; right: 0;}
	.m-section03-support .tab-cont-wrap {width: 100%; flex: auto; margin-top: 60px;}
	.m-section03-support .tab-cont .slick-list {overflow: visible !important;}
	.m-section03-support .tab-cont .slide-items {display: block;}
	.m-section03-support .tab-cont .slide-item {width: auto; padding: 30px 10px;}
	.m-section03-support .tab-cont > ul > li:nth-child(odd) {transform: translateY(0);}
	.m-section03-support .tab-cont a {padding: 50px 30px 50px 30px;}
	.m-section03-support .tab-cont a:hover {background: #112851; box-shadow: unset;}
	.m-section03-support .tab-cont .slick-current a {background: #36afce; box-shadow: 10px 10px 100px 40px rgba(54,174,205,0.2);}
	.m-section03-support .tab-cont .title {padding-bottom: 20px; margin-bottom: 20px;}
	.m-section03-support .tab-cont .title h4 {font-size: 22px;} 
	.m-section03-support .tab-cont .details {font-size: 18px;}
	.m-section03-support .tab-cont .date {font-size: 16px; margin-top: 40px;}
	.m-section03-support .tab-cont .icon {opacity: 1; bottom: 40px; right: 30px;}
	.m-section03-support .tab-cont .icon img {width: 50px;}
	.m-section03-support .tab-cont .slick-dots {display: flex; justify-content: center; margin-top: 10px; gap: 10px;}
	.m-section03-support .tab-cont .slick-dots li button {display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #112851; font-size: 0; border: 0; transition: all 0.5s;}
	.m-section03-support .tab-cont .slick-dots .slick-active button {background: #36afce}
	
	.m-section04 {height: 420px;}
	.m-section04 .circle-box {max-width: 200px; height: 200px; }
	.m-section04 .circle-box a:before {background-size: 200px auto;}

	/* footer */
	#footer {padding: 60px 0;}
	.btn-scroll-top {width:56px; height:56px;}
}

@media (max-width: 768px) {
	/* main-visual */
	.main-visual .text-box h2 {font-size: 40px;}
	.main-visual .slick-dots button {width: 90px;}

	.section-title h3 {font-size: 40px;}
	.section-title span {width: 8px; height: 8px; margin-left: 8px;}
	.section-title p {font-size: 20px;}

	.m-section01 .section-title {margin-bottom: 40px; padding-left: 30px;}
	.m-section01 .text-box {padding: 100px 0 450px;}
	.m-section01 .text-box a {display: block; padding: 30px 30px 0 30px;}
	.m-section01 .text-box .text {width: 100%; flex: auto;}
	.m-section01 .text-box h4 {font-size: 26px; margin-bottom: 15px;}
	.m-section01 .text-box .btn {opacity: 1; max-width: 140px; height: 143px; margin: 0 -45px -10px auto;}
	.m-section01 .text-box .btn:before {width: 140px; height: 143px; background-size: 140px auto; animation: spin 5.5s linear infinite;}
	.m-section01 .img-box {height: 400px;}

	.m-section02 {height: auto;}
	.m-section02 ul {flex-direction: column;}
	.m-section02 ul li {flex: auto; height: 280px; background-repeat: no-repeat; background-position: center center; background-size: cover;}
	.m-section02 ul li:nth-child(1) {background-image: url('../img/main/section02_bg01.jpg');}
	.m-section02 ul li:nth-child(2) {background-image: url('../img/main/section02_bg02.jpg');}
	.m-section02 ul li:nth-child(3) {background-image: url('../img/main/section02_bg03.jpg');}
	.m-section02 ul li a {padding-bottom: 0; justify-content: center;}
	.m-section02 ul li a:hover {backdrop-filter:blur(5px);}
	.m-section02 ul li a:after {display: none;}
	.m-section02 ul li a:hover .wrap {transform: translateY(0);}
	.m-section02 ul li .icon {margin-bottom: 10px;}
	.m-section02 ul li .icon img {width: 80px;}
	.m-section02 ul li h4 {font-size: 24px; margin-bottom: 20px;}
	.m-section02 ul li .btn {opacity: 1; width: 50px; height: 50px; background-size: 50px auto;}
	.m-section02 .backdrop {display: none;}

	.m-section03-tech {padding: 200px 0;}

	.m-section03-support {padding-bottom: 100px;}
	.m-section03-support .section-title {margin-bottom: 40px;}
	.m-section03-support .tab-menu-wrap {margin-bottom: 20px;}
	.m-section03-support .btn-wrap {position: relative; bottom: auto; right: 0;}
	.m-section03-support .tab-cont-wrap {margin-top: 20px;}
	.m-section03-support .tab-cont .slide-items {display: block;}
	.m-section03-support .tab-cont .slide-item {width: auto; padding: 30px 10px;}
	.m-section03-support .tab-cont a {padding: 40px 30px;}
	.m-section03-support .tab-cont .title {padding-bottom: 15px; margin-bottom: 15px;}
	.m-section03-support .tab-cont .icon {bottom: 30px;}
	.m-section03-support .tab-cont .icon img {width: 50px;}
	.m-section03-support .tab-cont .slick-dots {margin-top: 0;}

	.m-section04 {height: 360px;}
	.m-section04 .wrap {display: block; align-content: center;}
	.m-section04 .section-title {margin-bottom: 20px;}
	.m-section04 .circle-box {max-width: 120px; height: 120px;}
	.m-section04 .circle-box a:hover {animation: unset;}
	.m-section04 .circle-box a:before {background-size: 120px auto;}
	.m-section04 .circle-box img {width: 18px;}

	/* footer */
	#footer {padding:40px 0;}
	.footer-top {display: block; padding-bottom: 20px; margin-bottom: 20px; text-align: center;}
	.footer-top .logo {margin-bottom: 20px;}
	.footer-top ul {display: block;}
	.footer-top ul li:after {display: none;	}
	.footer-top ul li a {font-size: 15px;}
	.footer-bottom {font-size: 15px; text-align: center;}
	.footer-bottom .info {max-width: none; margin-bottom: 20px;}
	.footer-bottom .info ul {display: block;}
	.footer-bottom .info ul li:after {display: none;}
}

@media (max-width: 480px) {
	/* .m-section03-support .tab-cont .slick-list {overflow: hidden;}
	.m-section03-support .tab-cont .slide-item {padding: 30px 0;} */
}