/* 레거시 intro4.php(둘러보기) 인라인 <style> 추출본 - sec3 배려 섹션 */
.sec3{width: 100%;height: 1000px;position: relative;}
.sec3 .sec3_con{display: flex;gap: 30px;align-items: center;position: absolute;right: 650px;top: 50%;transform: translateY(-50%);}
.sec3 .sec3_txt_group{position: relative; display: flex;flex-direction: column;color: #262626;width: max-content;}
.sec3 .sec3_1{font-size: 120px;font-weight: 600; line-height: 1.5;display: flex;gap: 0px; font-family: 'Noto Serif KR', serif;}
.sec3 .sec3_2{font-size: 30px;line-height: 1.5;font-weight: 500;}
.sec3 .sec3_3{font-size: 18px;font-weight: 300;line-height: 1.5;margin-top: 20px;}

.sec3 .sec3_right_group{opacity: 0;transition: 0.6s; position: relative; width: 600px;height: 600px;border-radius: 50%;overflow: hidden;}
.sec3 .sec3_right_img{position: relative;}
.sec3_right_img_filter{position: absolute;z-index: 3; top: 0;right: 0;bottom: 0;left: 0;background: linear-gradient(to bottom, transparent 50%, #772511 100% );}
.sec3 .sec3_right_img img{width: 100%;height: 100%;object-fit: cover;transition: 0.6s ease-in-out;}
.sec3 .sec3_right_group:hover .sec3_right_img img{transform: scale(1.1);}
.sec3 .s3_btn{opacity: 0;position: absolute;bottom: 52px;left: 50%;transform: translateX(-50%); color: #fff;transition: background-color 0.6s, color 0.6s, opacity 0.6s; width: 222px;height: 73px;border-radius: 50px;border: 1px solid #fff;font-size: 22px;font-weight: 500;display: flex;align-items: center;justify-content: center;cursor: pointer;z-index: 4;}
.sec3 .sec3_right_group:hover .s3_btn{color: #772511;background-color: #fff;}
.sec3 .cir_parent{ position: relative;display: inline-block;}
.sec3 .cir_parent::after{transition: 0.6s;opacity: 0; content: '';position: absolute; bottom: 100%;left: 50%;transform: translateX(-50%);width: 26px;height: 26px;background-color: #772511;border-radius: 50%;}
.sec3 .sec3_han{position: absolute;right: 15px;top: 20px;z-index: 3;}
.sec3 .sec3_han{}
.sec3 .sec3_1{z-index: 1;position: relative;gap: 25px;}
.sec3 .sec3_2,.sec3 .sec3_3{position: relative;z-index: 3;}
.sec3 .han_hov_bx{position: absolute;bottom: 0;right: 0;overflow: hidden;height: 0px;width: 318px;transition: 0.6s ease-out;}
.sec3 .han_hov_img{width: 318px;height: 180px;position: absolute;bottom: 0;right: 0;}
.sec3 .han_hov_img img{}
.sec3 .sec3_han:hover .han_hov_bx{height: 180px;}

.sec3 .sec3_ab_cir_img>div{position: absolute;transform: rotate(45deg);z-index: -2;transition: 1.2s;opacity: 0;}
.sec3 .s3_cir_img1{left: -10%;top: 34px;}
.sec3 .s3_cir_img2{bottom: -10%;left: 309px;}
.sec3 .s3_cir_img3{bottom: -10%;right: -10%;}

.sec3 .sec3_ab_cir_group>div{position: absolute;transform: rotate(45deg);z-index: -1;transition: 1.2s;opacity: 0;}
.sec3 .s3_cir1{left: 160px;top: 441px;}
.sec3 .s3_cir2{bottom: 45px;left: 673px;}
.sec3 .s3_cir3{top: -636px;right: -311px;}


.sec3 .sec3_rotate{position: absolute;z-index: 4;bottom: -107px;right: 375px;opacity: 0;transition: 1.2s;}
.sec3 .sec3_rotate .sec3_rotate1{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.sec3 .sec3_rotate .sec3_rotate2{animation: r_ani 20s linear infinite forwards;}
.sec3{overflow: hidden;}

@keyframes r_ani {
    0%{transform: rotate(0);}
    100%{transform: rotate(360deg);}
}

.sec3 {}
.sec3 .sec3_right_group{opacity: 1;transition-delay: 0.6s;}
.sec3 .s3_btn{opacity: 1;transition:background-color 0.6s, color 0.6s, opacity 0.6s 0.8s;}
.sec3 .cir_parent::after{opacity: 1;}
.sec3 .cir_parent:nth-child(1):after{transition-delay: 0.2s;}
.sec3 .cir_parent:nth-child(2):after{transition-delay: 0.4s;}
.sec3 {}
.sec3 .sec3_ab_cir_img>div{transform: rotate(0);opacity: 1;}
.sec3 .s3_cir_img1{left: 0;transition-delay: 1s;}
.sec3 .s3_cir_img2{bottom: 0;transition-delay: 1.2s;}
.sec3 .s3_cir_img3{bottom: 0;right: 0;transition-delay: 1.4s;}
.sec3 .s3_cir_img1 img{transform: scale(1.2);}
.sec3 .s3_cir_img2 img{transform: scale(1.2);}
/* .sec3 .s3_cir_img3 img{transform: scale(1.2);} */

.sec3 .sec3_ab_cir_group>div{transform: rotate(0);opacity: 1;}
.sec3 .s3_cir1{transition-delay: 1.6s;}
.sec3 .s3_cir2{transition-delay: 1.6s;}
.sec3 .s3_cir3{top: -30px;right: -111px; transition-delay: 1.6s;}

.sec3 .sec3_rotate{opacity: 1;transition-delay: 1.6s;}
.sec3 .sec3_rotate{}
.sec3 .sec3_rotate{}

@media screen and (max-width:1024px) {
    .sec3_ab_cir_img{display: none;}
    .sec3_ab_cir_group{display: none;}

    .sec3{overflow: hidden;height: 704px;}
    .sec3 .sec3_con{position: static;flex-direction: column;gap: 50px;transform: translateY(0);}
    .sec3_right_img_filter{display: none;}
    .s3_btn{display: none !important;}
    .sec3 .sec3_right_group:hover .sec3_right_img img{transform: none;}
    .sec3 .sec3_right_group{height: auto;width: 100%;border-radius: 0;max-width: 500px ;margin: 0 auto;}

    .sec3 .sec3_1{font-size: 50px;justify-content: center;gap: 5px;font-weight: 600;}
    .sec3 .sec3_txt_group{width: 90%;margin: 0 auto;padding-top: 75px;}
    .sec3 .sec3_han{width: 175px;z-index: 0;}
    .sec3 .han_hov_bx{display: none;}
    .sec3 .cir_parent::after{width: 8px;height: 8px;bottom: 90%;}
    .sec3 .sec3_han{right: auto;left: 50%;transform: translateX(-50%);top: -30px;}
    .sec3 .sec3_2{font-size: 25px;text-align: center;}
    .sec3 .sec3_3{font-size: 16px;text-align: center;}
    .sec3 .sec3_2, .sec3 .sec3_3{transform: translateY(40px);transition: 0.6s;opacity: 0;}
    .sec3 .sec3_2, .sec3 .sec3_3{opacity: 1;transform: translateY(0);}
    .sec3 .sec3_2{transition-delay: 0.6s;}
    .sec3 .sec3_3{transition-delay: 0.8s;}



}