@charset "utf-8";

@media (max-width: 1400px) {
	#gnb>ul {padding-left:50px;}
	#gnb>ul>li {padding:0 40px;}
	
	.foot {display:block; text-align:center;}
	.foot-cnt {margin-top:40px;}
	.foot-cnt ul {justify-content:center;}
	
	.section01 .tab-box {padding-left:40px;}
	
	.section02 .tit-box {max-width:500px;}
	.section02 .txt-box {padding-left:40px;}
}

@media (max-width: 1024px) {
	#gnb {display:none;}
	
	/* main-visual */
	.main-visual .tit-box h2 {font-size:38px; margin-bottom:20px;}
	.main-visual .tit-box p {font-size:20px;}
	/* section01 */
	.section01 {padding:100px 0 160px;}
	.section01 .tt {width:70vw; position:absolute; right:-10px; bottom:-40px; z-index:-1;}
	.section01 .tab-cnt {display:block;}
	.section01 .tab-menu {max-width:none; margin-bottom:60px;}
	.section01 .tab-menu ul {flex-direction:row;}
	.section01 .tab-menu ul li {border-bottom:0; border-right:1px solid #ddd; width:25%;}
	.section01 .tab-menu ul li:last-child {border-right:0;}
	.section01 .tab-menu ul li a {height:80px;}
	.section01 .tab-menu ul li a .icon {width:32px; height:32px; margin-bottom:6px;}
	.section01 .tab-menu ul li p {font-size:16px;}
	.section01 .tab-box {width:100%; padding-left:0;}
	.section01 .tab-content {flex-direction:column-reverse;}
	.section01 .txt-box {max-width:none; padding-right:0;}
	.section01 .txt-box h3 {font-size:36px; margin-bottom:27px;}
	.section01 .txt-box h3 strong {font-size:38px;}
	.section01 .txt-box p {font-size:20px; margin-bottom:28px;}
	.section01 .txt-box .more a {width:160px; padding:0 22px; line-height:46px; font-size:18px;}
	.section01 .txt-box .more a:after {width:20px; height:20px; margin-top:-10px; right:22px;}
	.section01 .img-box {width:100%; margin:0 auto 60px;}
	.section01 .img-box .img {position:relative; top:0; left:0; text-align:center;}
	.section01 .img-box .img img {max-width:100%;}
	/* section02 */
	.section02 {height:100%; padding-top:100px; padding-bottom:160px; background-image:url('../img/main/sec02-01.jpg') !important;}
	.section02 .col {display:block;}
	.section02 .tit-box {max-width:none; margin-bottom:60px;}
	.section02 .tit-box h3 {font-size:60px; margin-bottom:16px;}
	.section02 .tit-box p {font-size:20px;}
	.section02 .txt-box {width:100%; padding-left:0;}
	.section02 .txt-box .inner {padding:30px; border-radius:20px; background: rgba(219, 219, 219, 0.12); backdrop-filter:blur(10px);}
	.section02 .txt-box .inner:after {margin-top:-20px; right:30px; width:40px; height:40px; opacity:1;}
	.section02 .txt-box .inner.on:after {right:40px;}
	.section02 .txt-box .inner .num p {font-size:24px; padding-bottom:26px; color:#0D8AFF;}
	.section02 .txt-box .inner .num p:after {background:#0D8AFF;}
	.section02 .txt-box .inner .box {padding-left:30px;}
	.section02 .txt-box .inner .tit h4 {font-size:26px; margin-bottom:10px; color:#fff;}
	.section02 .txt-box .inner .txt {height:100%;}
	.section02 .txt-box .inner .txt p {font-size:20px;}

	/* footer */
	#footer {padding:80px 0;}
	#sub #footer {padding:0 0 80px;}
	.foot {padding-top:30px;}
	.foot .foot-info .logo {margin-bottom:30px;}
	.foot .foot-info p {font-size:16px;}
	.foot .foot-info p.copy {margin-top:20px;}
	.foot ul li a {padding:0 24px; line-height:40px; font-size:16px;}

	/* quick */
	.quick {right:15px; bottom:60px;}
	.quick a {width:50px; height:50px; border-radius:25px;}
	.quick a.link {margin-bottom:15px;}
	.quick a.link01:hover {width:50px;}
	.quick a.link02:hover {width:50px;}
	.quick a.link .icon {width:24px; height:24px;}
	.quick a.link:hover .icon {margin-right:0;}
	.quick a.link span {display:none;}

}

@media (max-width: 640px) {
	#header {height:80px;}
	/* main-visual */
	.main-visual .tit-box h2 {font-size:28px; margin-bottom:16px;}
	.main-visual .tit-box p {font-size:18px;}
	/* section01 */
	.section01 {padding:80px 0 120px;}
	.section01 .tt {width:60vw; bottom:-20px;}
	.section01 .tab-menu {margin-bottom:40px;}
	.section01 .tab-menu ul li a {height:60px;}
	.section01 .tab-menu ul li a .icon {width:26px; height:26px; margin-bottom:3px;}
	.section01 .tab-menu ul li p {font-size:14px;}
	.section01 .txt-box h3 {font-size:24px; margin-bottom:20px;}
	.section01 .txt-box h3 strong {font-size:28px;}
	.section01 .txt-box p {font-size:16px; margin-bottom:20px;}
	.section01 .txt-box .more a {width:120px; padding:0 16px; line-height:40px; font-size:16px;}
	.section01 .txt-box .more a:after {right:10px;}
	.section01 .img-box {width:100%; margin:0 auto 40px;}
	/* section02 */
	.section02 {padding-top:60px; padding-bottom:100px;}
	.section02 .tit-box {margin-bottom:40px;}
	.section02 .tit-box h3 {font-size:32px; margin-bottom:10px;}
	.section02 .tit-box p {font-size:16px;}
	.section02 .txt-box .inner {padding:20px;}
	.section02 .txt-box .inner:after {margin-top:-16px; right:15px; width:30px; height:30px;}
	.section02 .txt-box .inner.on:after {right:15px;}
	.section02 .txt-box .inner .num p {font-size:20px; padding-bottom:20px; padding-bottom:16px;}
	.section02 .txt-box .inner .box {padding-left:20px;}
	.section02 .txt-box .inner .tit h4 {font-size:20px;}
	.section02 .txt-box .inner .txt p {font-size:16px;}
	/* footer */
	#footer {padding:40px 0;}
	#sub #footer {padding:0 0 40px;}
	.foot {padding-top:20px;}
	.foot .foot-info .logo {margin-bottom:20px;}
	.foot .foot-info p {font-size:14px;}
	.foot .foot-info p.copy {margin-top:12px;}
	.foot ul li a {padding:0 15px; line-height:32px; font-size:14px;}	

	/* quick */
	.quick {bottom:60px;}
	.quick a {width:50px; height:50px; border-radius:25px;}
	.quick a.link {margin-bottom:15px;}
	.quick a.link01:hover {width:50px;}
	.quick a.link02:hover {width:50px;}
	.quick a.link .icon {width:24px; height:24px;}
	.quick a.link:hover .icon {margin-right:0;}
	.quick a.link span {display:none;}
}

@media (max-width: 440px) { 

	.section02 .txt-box .inner {display:block;}
	.section02 .txt-box .inner .num {margin-bottom:10px; padding-bottom:12px;}
	.section02 .txt-box .inner .box {padding-left:0; width:100%;}
	

	.foot .foot-info p br {display:block;}
	.foot .foot-info p span {display:none;}
	.foot-cnt {margin-top:20px;}
	.foot-cnt ul {display:block;}
	.foot-cnt ul li {width:100%; text-align:center; margin-bottom:10px;}
	.foot-cnt ul li a {width:130px; display:inline-block; padding:0 10px;}
}