@charset "utf-8";

/*반응형*/
@media(max-width: 1800px){
	.main02 .txt{margin-right: 40px;}
}

@media(max-width: 1640px){
	.main01 .bg_txt{padding: 0;}

	.main02{padding: 200px 40px;}
	.main02 .txt{margin-right: 0;}
	.main02 .txt1{font-size: 45px;}
	.main02 .txt2{font-size: 19px;padding-top: 60px;padding-bottom: 400px;}

	/*footer*/
	.footer > .inner{max-width: 100%;padding-left: 20px;padding-right: 20px;}
}

@media(max-width: 1440px){
	.inner{max-width: 100%;padding-left: 20px;padding-right: 20px;}

	.main01 .bg_txt{font-size: 420px;}
	.main01 .txt_wrap{left: 50px;padding: 28vh 0;max-width: calc(100% - 100px);}
	.main01 .txt{top: 52%;}
	.main01 .flow{padding: 15vh 100px;}
	.main01 .flow .thum{width: 40%;}
	.main01 .flow .thum:first-child{width: 65%;}

	.main02{padding: 150px 0;}
	.main02 > .main02_top_wrap{aspect-ratio: 1800 / 1440;}
	.main02 .thum1{left: 40px;}
	.main02 .txt{margin-right: 40px;}
	.main02 .txt1{font-size: 40px;padding-top: 35%;}
	.main02 .txt2{font-size: 18px;padding-bottom: 45%;}

	.main04 .paint_wrap{width: 800px;top: -190%;left: -24%;}
	.main04 .gall{right: 40px;}
	.main04 .tit_wrap{font-size: 45px;}
	.main04 .desc{font-size: 18px;margin-top: 60px;}

	/*footer*/
	.footer{padding: 60px 0;}
	.ft_cont .tit{font-size: 22px;}
	.ft_cont .btm{font-size: 16px;}

	.main09{padding: 120px 0;}
	.main09 > .inner{max-width: 963px;}
	.main09 .card{width: 320px;}
	.main09 .tit{font-size: 130px;}
	.main09 .desc{font-size: 19px;}
}

@media(max-width: 1280px){
	.main01 .bg_txt_wrap{}
	.main01 .bg_txt{font-size: 320px;}
	.main01 .txt_wrap{padding: 22vh 0;}
	.main01 .txt{font-size: 90px;}
	.main01 .flow{padding: 5vh 50px;}

	.main02 .thum1{width: 47%;}
	.main02 .txt{padding-left: 60px;margin-right: 20px;}
	.main02 .txt1{padding-top: 30%;}

	.main03 .txt{height: 110%;}
	.main03 .txt1{font-size: 100px;}
	.main03 .txt3{font-size: 24px;}

	.main04 .paint_wrap{width: 680px;left: -310px;}

	.main06 .tit{font-size: 90px;}
	.main06 .desc{font-size: 22px;margin-top: 40px;}

	.main07{padding: 100px 0;}
	.main07 > .inner{top: 50px;}
	.main07 .m7_wrap{gap: 30px;}
	.main07 .m7_left{padding: 30px;}
	.main07 .m07_box .title{font-size: 160%;}
	.main07 .m07_box .title,
	.main07 .m07_box .info{margin-top: 6px;}
	.main07 .titlle_wrap .top{padding: 5px 16px;}
	.main07 .titlle_wrap .top_title{font-size: 120%;}

	.main09 > .inner{max-width: calc(100% - 80px);width: 896px;}
	.main09 .card{width: 300px;}
	.main09 .tit{font-size: 120px;}
	.main04 .desc{font-size: 18px;}

	/*footer*/
	.ft_cont {width: calc(50% - 20px);}
}

@media(max-width: 992px){
	.main02 .thum1{width: 56%;}
	.main02 .txt1{font-size: clamp(3.7vw,36vw,24px);padding-top: 40%;}
	.main02 .txt2{font-size: clamp(1.714vw,17px,14px);padding-top: 40px;padding-bottom: 64%;}

	.main03 .txt1{font-size: 80px;line-height: 1.025;}
	.main03 .txt2{font-size: 16px;line-height: 1.5;}
	.main03 .txt3{font-size: 22px;}

	.main04:before{display: block;content: '';width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: rgba(0, 0, 0, 0.15);z-index: 1;}
	.main04 .paint_wrap{width: 540px;top: -150%;left: -350px;}
	.main04 .tit_wrap{font-size: 40px;}
	.main04 .desc{font-size: 17px;margin-top: 50px;}
	.main04 .gall{right: 0;padding: 0 20px 70px;}

	.main05 .pin_wrap img{width: 60%;margin-right: 150px;max-height: 100%;}
	.main05 .pin_wrap img:first-child{width: 100%;}

	.main06 .tit{font-size: 80px;}
	.main06 .desc{font-size: 20px;margin-top: 30px;}

	.main07{padding: 80px 0;}
	/*.main07 > .inner{top: 30px;}*/
	.main07 .m7_left{display: none;}
	.main07 .m7_right{width: 100%;height: 100vh;font-size: 17px;}
	.main07 .titlle_wrap {gap: 0;}
	.main07 .titlle_wrap > li{height: 52px;margin-top: 10px;}
	.main07 .titlle_wrap > li:first-child{margin-top: 0;}
	.main07 .titlle_wrap .top{padding: 10px 30px;min-height: auto;border-radius: 6px 6px 0 0;}

	.main07 .titlle_wrap .btm{display: flex;width: 100%;border-radius: 0 0 6px 6px;transform: scaleY(0);transform-origin: top;transition: all .3s ease-out;flex-flow: row;align-items: center;justify-content: flex-start;padding: 0 20px;overflow: hidden;height: 35vh;opacity: 0;}
	.main07 .m07_box{font-size: 15px;}
	.main07 .titlle_wrap .m07_box .thum{width: auto;height: 100%;padding: 16px;aspect-ratio: auto;max-width: 40vh;flex: 0 0 auto;}
	.main07 .titlle_wrap .btm .txt{margin: 0;padding-left: 6px;}
	
	.main07 .titlle_wrap > li.active{height: auto;}
	.main07 .titlle_wrap > li.active .btm{transform: scaleY(1);opacity: 1;}

	.main09 .card{width: clamp(30vw,300px,200px);}
	.main09 .tit{font-size: clamp(12vw,120px,80px);}
	.main04 .desc{font-size: 17px;}
}

@media(max-width: 768px){
	.main01 .bg_txt{font-size: 240px;}
	.main01 .txt_wrap{left: 20px;padding: 16vh 0;}
	.main01 .txt{font-size: 70px;top: 51%;}
	.main01 .flow .thum{width: 50%;}
	.main01 .flow .thum:first-child{width: 75%;}

	.main02 .thum1{left: 20px;}

	.main03{margin: 0;padding: 150px 0;}
	.main03 .txt{margin-top: -1%;}
	.main03 .txt1{font-size: 70px;}
	.main03 .txt2{font-size: 15px;}
	.main03 .txt3{font-size: 20px;}
	
	.main04 .paint_wrap{width: 420px;left: -260px;}
	.main04 .tit_wrap{font-size: 32px;}
	.main04 .desc{font-size: 16px;margin-top: 40px;}
	.main04 .gall{left: 0;right: 0;margin: auto;width: fit-content;max-width: 100%;gap: 24px;padding: 20px;}

	.main05 .pin_wrap img{margin-right: 130px;}
	
	.main06 .tit{font-size: 70px;}
	.main06 .desc{font-size: 18px;margin-top: 24px;}

	.main07{padding: 60px 0;}
	/*.main07 > .inner{top: 30px;}*/
	.main07 .m7_right{font-size: 16px;}
	.main07 .titlle_wrap .top,
	.main07 .titlle_wrap .btm{padding: 10px 16px;}
	.main07 .titlle_wrap .top{font-size: 16px;}
	.main07 .titlle_wrap .btm{height: 30vh;}
	.main07 .titlle_wrap .btm .txt{padding-left: 16px;}
	.main07 .titlle_wrap .m07_box .thum{padding: 0;max-width: 30vh;}
	.main07 .titlle_wrap .m07_box .artist .eng{display: block;margin: 0 0 2px;}
	.main07 .titlle_wrap .m07_box .title{font-size: 130%;}

	.main09{padding: 80px 0;}
	.main09 > .inner{max-width: calc(100% - 60px);}
	.main09 .card{width: clamp(30vw,240px,170px);}
	.main09 .card,
	.atvImg-container,
	.atvImg-layers,
	.atvImg-rendered-layer,
	.atvImg-shine,
	.atvImg,
	.atvImg img{border-radius: 30px;}
	.main09 .tit{font-size: clamp(12vw,100px,60px);}
	.main09 .desc{position: static;text-align: right;font-size: 16px;margin-top: 24px;}

	/*footer*/
	.footer{padding: 40px 0;}
	.footer > .inner{gap: 30px 40px;}
	.ft_cont .tit{font-size: 18px;}
	.ft_cont .desc{font-size: 13px;margin: 16px 0;}
	.ft_cont .btm{font-size: 14px;}
}

@media(max-width: 580px){
	.main01 .bg_txt{font-size: 180px;}
	.main01 .txt_wrap{max-width: 90%;padding: 10vh 0;}
	.main01 .flow .thum{width: 60%;}
	.main01 .flow .thum:first-child{width: 95%;}

	.main02{padding: 100px 0;}
	.main02 .txt p{display: inline;}
	.main02 .txt2{padding-bottom: 50%;}

	.main03 .txt{margin-top: -2%;}
	.main03 .txt1{font-size: 60px;}
	.main03 .txt2{font-size: 13px;}
	.main03 .txt3{font-size: 18px;}

	.main04 .paint_wrap{width: 320px;left: -180px;}
	.main04 .tit_wrap{font-size: 26px;}
	.main04 .desc{font-size: 15px;margin-top: 30px;}

	.main06 .tit{font-size: clamp(12.06vw,70px,40px);}
	.main06 .desc{font-size: clamp(3.1vw,18px,14px);}

	.main07:after{}
	.main07 .titlle_wrap .top{font-size: 15px;}
	.main07 .titlle_wrap .m07_box .thum{max-width: 23vh;}
	.main07 .titlle_wrap .btm{height: 25vh;}
	.main07 .m07_box{font-size: 14px;}
	.main07 .titlle_wrap .m07_box .title{font-size: 120%;}

	.main09 > .inner{max-width: 100%;}
	.main09 .card{margin: 0 auto;width: 180px;max-width: 60%;min-width: 120px;}
	.main09 .txt{position: static;text-align: center;}
	.main09 .txt br{}
	.main09 .tit{font-size: clamp(10vw,60px,32px);}
	.main09 .desc{text-align: center;font-size: 14px;line-height: 1.1;}

	/*footer*/
	.footer{padding: 30px 0;}
	.footer > .inner{flex-flow: column;gap: 24px 0;}
	.ft_cont{width: 100%;}
	.ft_cont .tit{font-size: 15px;}
	.ft_cont .desc{font-size: 12px;margin: 12px 0;}
	.ft_cont .btm{font-size: 13px;}
}

@media(max-width: 480px){
	.main01 .bg_txt{font-size: clamp(37.5vw,180px,120px);}
	.main01 .txt_wrap{padding: 8vh 0;}
	.main01 .txt{font-size: clamp(14.583vw,70px,40px);}
	.main01 .flow{padding: 5vh 20px;}
	.main01 .flow .thum:first-child{width: 100%;}

	.main02 .txt{margin-right: 10px;}
	.main02 .txt1{font-size: 22px;}
	.main02 .txt2{font-size: 13px;}

	.main03 .txt{margin-top: -4%;}
	.main03 .txt1{font-size: 50px;}
	.main03 .txt2{font-size: 12px;}
	.main03 .txt3{font-size: 16px;}

	.main04 .paint_wrap{width: 280px;left: -160px;}
	.main04 .tit_wrap{font-size: 20px;}
	.main04 .desc{font-size: 13px;margin-top: 24px;}

	.main07 .titlle_wrap .top,
	.main07 .titlle_wrap .btm{padding: 10px;}
	.main07 .titlle_wrap .top{font-size: 14px;}
	.main07 .m07_box{font-size: 13px;}
	.main07 .titlle_wrap .m07_box .thum{max-width: 40%;}
}

@media(max-width: 360px){
	.main02 .txt{padding-left: 40px;}

	.main03 .txt{margin-top: -4%;}
	.main03 .txt1{font-size: 40px;}
	.main03 .txt2{font-size: 11px;}
	.main03 .txt3{font-size: 15px;}

	.main04 .desc{font-size: 12px;}
	.main04 .desc br{display: none;}

	/*.main07 .titlle_wrap > li{height: 44px;}*/
	.main07 .titlle_wrap .top{font-size: 13px;}
	.main07 .titlle_wrap .btm{height: 22vh;}
	.main07 .m07_box{font-size: 12px;}

	.main09 .card{width: 140px;min-width: 100px;max-width: 55%;}
	.main09 .card, .atvImg-container, .atvImg-layers, .atvImg-rendered-layer, .atvImg-shine, .atvImg, .atvImg img{border-radius: 20px;}
	.main09 .desc{font-size: 12px;}
}

@media (orientation: portrait) {
	/* Portrait 모드일 때 적용할 CSS */
	.main07:after{padding-bottom: 700vh;}
}