@charset "utf-8";

@media (max-width: 1600px) {
	.scrolltop {bottom:85px; width:72px; height:72px;}
	html.scroll-fade .scrolltop {right: 15px;}
}

@media (max-width: 1400px) {
	#gnb>ul>li {padding:0 20px;}
	#gnb .submenu {width:160px;}

	.main-banner .contact {padding-right: 40px; margin-right: 40px;}

	#footer .logo img {width: 160px;}
	#footer .text {font-size: 16px; }
	#footer .map {max-width: 400px;}
}

@media (max-width: 1200px) {
	.main-banner .wrap {padding: 27px 0;}
	.main-banner .quick-link ul li a {display: block; text-align: center;}
	.main-banner .quick-link ul li .icon {width: 70px; height: 70px; background-size: 70px auto; margin-right: 0; margin: 0 auto 8px;}

	.section02:before {background-size: 450px auto;}
	.section02 ul li .text-box {padding: 50px 40px;}

	.section04 .section-title {max-width: 280px;}
}

@media (max-width: 1024px) {
	#header {height:80px;}
	#header.hide {transform:translateY(0);}
	#header .sitelogo a {margin-top:-31px;}
	#header .sitelogo img {width: 180px;}

	#gnb {display:none;}

	.main-visual {margin-top: 80px;}
	.main-visual .origin .item {height: calc(100vh - 80px);}
	.main-visual .text-box {margin-bottom: 40px;}
	.main-visual .text-box h2 {font-size: 50px; margin-bottom: 15px;}
	.main-visual .text-box p {font-size: 18px;}

	.btn-scroll-down {bottom: 40px;}

	.main-banner .wrap {padding: 20px 0;}
	.main-banner .contact {padding-top: 6px; padding-right: 30px; margin-right: 30px;}
	.main-banner .contact h3 {font-size: 24px; padding-right: 14px; margin-bottom: 5px;}
	.main-banner .contact a {font-size: 35px;}
	.main-banner .contact p {font-size: 16px; margin-top: 5px;}
	.main-banner .contact p.text {margin-bottom: 10px;}
	.main-banner .quick-link ul li a {font-size: 18px;}
	.main-banner .quick-link ul li .icon {width: 60px; height: 60px; background-size: 60px auto; border-radius: 10px;}

	.section-title {margin-bottom: 45px;}
	.section-title h3 {font-size: 45px;}

	.section01 {padding: 100px 0 100px;}
	.section01:before {background-size: 350px auto;}
	.section01:after {background-size: 350px auto;}
	.section01 .tab-menu {margin-bottom: 50px;}
	.section01 .tab-menu ul li a {font-size: 16px; padding: 10px 34px;}

	.section01 .tab-content {height: 315px;}
	.section01 .slide-controls {top: -96px;}
	.section01 .slide-controls .slick-arrow {width: 46px; height: 46px;}
	.section01 .slide-controls .btn-more {width: 46px; height: 46px;}
	
	.section01 .items {margin: 0 -10px;}
	.section01 .item {padding: 0 10px;}
	.section01 .item .img-box {margin-bottom: 20px;}
	.section01 .item .text-box {font-size: 26px;}

	.section02 {padding: 31px 0 160px;}
	.section02:before {background-size: 350px auto;}
	.section02 ul li .text-box { padding: 35px 30px;}
	.section02 ul li .text-box h4 {font-size: 30px;}

	.section03 .wrap {padding: 100px 0;}
	.section03 .text h3 {font-size: 40px; margin-bottom: 15px;}
	.section03 .text p {font-size: 18px;}
	.section03 .btn-more {width: 180px; line-height: 60px; padding: 0 30px; font-size: 18px;}
	.section03 .btn-more:after {right: 30px;}

	.section04 {padding: 140px 0;}
	.section04:before {background-size: 580px auto;}
	.section04:after {left: 20px; background-size: 250px auto;}
	.section04 .section-title {max-width: 200px;}
	.section04 ol li:not(:last-child) {margin-bottom: 20px;}
	.section04 ol li a .inner {padding: 20px 40px 20px 20px;}
	.section04 ol li .date {max-width: 100px; padding-left: 20px;}
	.section04 ol li .date:after {height: 105%;}
	.section04 ol li .date b {font-size: 34px;}
	.section04 ol li .date p {font-size: 12px;}
	.section04 ol li .title {padding: 0 30px; font-size: 22px;}
	.section04 ol li .btn {width: 50px; height: 50px;}
	
	/* footer */
	#footer {padding: 50px 0;}
	#footer .wrap {display: block;}
	#footer .info-wrap {display: flex; margin-bottom: 20px;}
	#footer .logo {margin-right: 50px;}
	#footer .text {font-size: 16px; margin-top: -15px;}
	#footer .text ul {margin: 0 -7px;}
	#footer .text ul li {padding: 0 7px;}
	#footer .terms-wrap ul li a {position: relative; width: 180px; line-height: 40px; padding: 0 20px; border-radius: 20px; font-size: 16px; color: #fff; transition: all 0.5s;}
	#footer .terms-wrap ul li a:after {right: 15px;}

	#footer .map {display: none;}
	 
	.scrolltop {bottom:85px; width:60px; height:60px;}
}

@media (max-width: 768px) {
	#header {height:60px;}
	#header .sitelogo a {margin-top:-25px;}
	#header .sitelogo img {width: 140px;}

	#gnb {display:none;}

	.main-visual {margin-top: 60px;}
	.main-visual .origin .item {height: calc(100vh - 60px);}
	.main-visual .text-box {margin-bottom: 35px;}
	.main-visual .text-box h2 {font-size: 36px; margin-bottom: 10px;}
	.main-visual .text-box p {font-size: 16px;}

	.main-banner .wrap {display: block; padding: 15px 0;}
	.main-banner .contact {padding-top: 6px; padding-right: 0; margin-right: 0; margin-bottom: 15px;}
	.main-banner .contact:after {display: none;}
	.main-banner .contact > div {display: flex; flex-wrap: wrap; align-items: center;}
	.main-banner .contact h3 {font-size: 20px; padding-right: 14px; margin-bottom: 0; margin-right: 15px;}
	.main-banner .contact a {font-size: 30px; margin-right: 15px;} 
	.main-banner .quick-link ul li a {font-size: 16px;}
	.main-banner .quick-link ul li .icon {width: 50px; height: 50px; background-size: 50px auto; border-radius: 10px;}

	.section-title {margin-bottom: 30px;}
	.section-title h3 {font-size: 30px;}

	.section01 {padding: 80px 0;}
	.section01:before {background-size: 300px auto;}
	.section01:after {bottom: 40px; background-size: 300px auto;}
	.section01 .tab-menu {margin-bottom: 35px;}
	.section01 .tab-menu ul li a {font-size: 15px; padding: 8px 30px;}

	.section01 .tab-content {height: 380px;}
	.section01 .slide-controls {position: relative; top: -15px;}
	.section01 .slide-controls .slick-arrow {width: 40px; height: 40px;}
	.section01 .slide-controls .btn-more {width: 40px; height: 40px;}
	
	.section01 .items {margin: 0 -10px;}
	.section01 .item {padding: 0 10px;}
	.section01 .item .img-box {margin-bottom: 15px;}
	.section01 .item .text-box {font-size: 22px;}

	.section02 {padding: 10px 0 80px;}
	.section02:before {background-size: 250px auto;}
	.section02 ul {flex-wrap: wrap;}
	.section02 ul li {width: 100%; height: 200px; margin-bottom: 20px;}
	.section02 ul li a {width: 100%; height: 100%;}
	.section02 ul li .img-box img {width: 100%;}
	.section02 ul li .text-box { padding: 30px 25px;}
	.section02 ul li .text-box h4 {font-size: 24px;}

	.section03 {background-position: right 40% center;}
	.section03 .wrap {display: block; padding: 60px 0;}
	.section03 .text h3 {font-size: 28px; margin-bottom: 10px;}
	.section03 .text p {font-size: 16px; margin-bottom: 25px;}
	.section03 .btn-more {width: 160px; line-height: 50px; padding: 0 20px; font-size: 16px; background: #c60610; border: 1px solid #c60610;}
	.section03 .btn-more:after {right: 20px;}

	.section04 {padding: 100px 0;}
	.section04:before {background-size: 420px auto;}
	.section04:after {left: 20px; background-size: 200px auto;}
	.section04 .wrap {display: block;}
	.section04 .section-title {max-width: none;}
	.section04 .section-title h3 {text-align: center;}
	.section04 .section-cont {flex: auto;}
	.section04 ol li:not(:last-child) {margin-bottom: 15px;}
	.section04 ol li a .inner {padding: 10px 20px;}
	.section04 ol li .date {max-width: 55px; padding-left: 0;}
	.section04 ol li .date:after {height: 95%;}
	.section04 ol li .date b {font-size: 30px;}
	.section04 ol li .date p {font-size: 12px;}
	.section04 ol li .title {padding: 0 15px; font-size: 18px;}
	.section04 ol li .btn {width: 40px; height: 40px;}

	/* footer */
	#footer {padding: 40px 0;}
	#footer .info-wrap {display: block; margin-bottom: 20px; text-align: center;}
	#footer .logo {margin-right: 0; margin-bottom: 20px;}
	#footer .logo img {width: 100px;}
	#footer .text {font-size: 15px; line-height: 1.8em; margin-top: 0;}
	#footer .text ul {justify-content: center; margin: 0 -7px;}
	#footer .text ul li {padding: 0 7px;}
	#footer .terms-wrap ul {justify-content: center;}
	#footer .terms-wrap ul li a {width: 160px; line-height: 36px; padding: 0 15px; font-size: 15px;}

	#footer .map {display: none;}

	.scrolltop {bottom:60px; width:50px; height:50px;}
}

@media (max-width: 480px) {
	.section01 .tab-content {height: 450px;}
}