* {font-family: 'Pretendard'; font-weight: 400; word-break: keep-all;}
i{display: inline-block;}

.section {width: 100%;}
.section.pd{padding: 130px 0;}
.pt0{padding-top: 0 !important;}

.title{margin-bottom: 80px; display: flex; justify-content: space-between;}
.title h6{font-size: 40px; font-weight: 600;}
.title h6 i{font-weight: inherit; color: #FF859E;}
.title p{font-size: 18px; color: #999;}
.title h6 + p{margin-top: 10px;}

.more_btn button{background-color: #ffffff; border: 2px solid #FF859E; border-radius: 50px; display: flex; justify-content: center; align-items: center; padding: 20px; transition: all .2s;}
.more_btn button i img{width: 16px; height: 16px;}
.more_btn button:after{content:'MORE'; color: #fff; font-weight: 500; font-size: 16px; padding-left: 10px; display: inline-block; position: relative; display: none; line-height: 1}
.more_btn button:hover:after{display: block;}
.more_btn button:hover{background-color: #FF859E; }
.more_btn button:hover img{filter : brightness(10000%);}


/* 인트로 */
/* .intro{position: relative; height: 100vh; overflow: hidden;}
.intro video{position: relative; z-index: -99; width: 100%; height: 100%;} */
.introbox{position: relative; padding-bottom: 93vh; overflow: hidden;}
.intro{text-align: center;position: absolute;top: 0;right:-200%;bottom: 0;left: -200%; filter: brightness(40%); overflow: hidden;}
.intro video{max-height: 100vw; overflow: hidden; object-fit: cover; }
.intro_text{width: 100vw; height: 100vh; position: absolute; z-index: 999; top: 0; text-align: right;}
.intro_text .main_txt {position: absolute; width: 100%; display: flex; justify-content: center; top: 50%; left: 65%; transform: translate(-50%, -50%);}
.intro_text .main_txt > div{width: 430px; height: max-content; display: flex; flex-direction: column;}
.intro_text .main_txt h1{overflow: hidden; display: inline-block; width: max-content;}
.intro_text .main_txt h1 span{color: #fff; font-size: 58px; font-weight: 700; line-height: 1.3; display: block; display: inline-block;}
.main_txt h1 span br{display: none;}
.intro_text .main_txt h1 span b { color: #FF859E; font-weight: 700;}
.intro_text .main_txt div > span {display: block; color: #fff; font-size: 20px; font-weight: 500; margin-top: 30px;}
.skipbtn{display: inline-block; width: max-content; margin-top: 1.8rem;}
.skipbtn button{color: #fff; font-size: 1.3rem; font-weight: 300; padding: .6rem 1.6rem; border: 1px solid #ffffff70; border-radius: 2rem; display: flex; align-items: center; gap: .8rem; transition: all .15s;}
/* .skipbtn button i{margin-left: .4rem;} */
.skipbtn button:hover{background-color: #ffffff10;}
.skipbtn button:active{background-color: #ffffff30;}
.logobox{position: relative; z-index: 9999;top: 0; left: 50%; transform: translateX(-50%); display: flex; justify-content: center; align-items: center; padding: 20px 0;}
.logobox i{cursor: pointer; margin-right: 10px;}
.logobox i img{width: 85%; opacity: .8;}


/* 메인섹션 */
/* .main_wrap{position: relative;} */
/* .main_sec .swiper-wrapper { position: relative;} */
/* .main_sec .swiper-slide > .main_txt {position: absolute; top: 50%; left: 0; transform: translate(50%, -60%);} */

/* .main_wrap{position: relative; padding-bottom: 100vh; overflow: hidden;}
.main_video{text-align: center;position: absolute;top: 0;right:-200%;bottom: 0;left: -200%; overflow: hidden;}
.main_video video{max-width: 100%; filter: brightness(60%);} */

.main_wrap{position: relative; height: 100vh; overflow: hidden;}
.main_video{text-align: center;}
.main_video video{width: 100%; height: 100%; filter: brightness(60%);}


.main_txt {position: absolute; width: 100%; display: flex; justify-content: center; top: 47%; left: 50%; transform: translate(-50%, -50%);}
.main_txt > div{width: 100%; height: max-content;}
.main_txt h1{overflow: hidden;}
.main_txt h1 span{color: #fff; font-size: 58px; font-weight: 700; line-height: 1.3; display: block;}
.main_txt h1 span b { color: #FF859E; font-weight: 700;}
.main_txt div > span {display: block; color: #fff; font-size: 20px; font-weight: 500; margin-top: 30px;}

.swiper-button-prev:after, .swiper-button-next:after{color: #fff; font-size: 20px !important; background-color: #00000020; height: 65px; width: 65px; border-radius: 5px; display: flex; justify-content: center; align-items: center; position: absolute;}
.swiper-button-prev{left: 124px !important;}
.swiper-button-next{right: 124px !important;}


/* sec02 */
.sec02, .sec04{border-radius:  60px 60px 0 0; margin-top: -70px; position: relative; z-index: 2; background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/main_symbol_bg.png) left top  no-repeat #fff; }
.sec02 ul + ul{margin-top: 80px;}
.sec02 .quick_box{display: flex; align-items: center; width: 100%; gap: 8px;}
.sec02 .quick_box li{padding: 48px 32px; flex: 1; border-radius: 2rem; background-color: #fff;}
/* .sec02 .quick_box li:nth-child(1){background-color: #FF859E; border-radius: 10px 0 0 10px; color: #fff; border: 1px solid #FF859E;} */
.sec02 .quick_box li:nth-child(1){background-color: #FF859E; color: #fff; border: 1px solid #FF859E;}
.sec02 .quick_box li:nth-child(2), .sec02 .quick_box li:nth-child(3){border: 1px solid #ddd; }
/* .sec02 .quick_box li:nth-child(3){border-radius: 0 10px 10px 0;} */
.sec02 .quick_box li h6{font-size: 28px; margin-bottom: 24px;}
.sec02 .quick_box li h6, .sec02 .quick_box li h6 i{ font-weight: 500;}
.sec02 .quick_box li h6 i{color: #FF859E;}
.sec02 .quick_box li p{font-size: 18px; line-height: 1.4; height: 2.8em; }
.sec02 .quick_box li.quick_inq p{color: #999;}
.sec02 .quick_box .input_wrap{margin-top: 35px;}
.sec02 .quick_box .input_wrap, .sec02 .quick_box .input_wrap{display: flex; align-items: center; gap: 8px; width: 100%;}
.sec02 .quick_box .input_wrap input, .sec02 .quick_box .input_wrap button{border-radius: 5px;}
.sec02 .quick_box .input_wrap.btn_wrap button{background-color: #fff; color: #FF859E; font-size: 15px; flex: 1; padding: 12px 0;}
.sec02 .quick_box .input_wrap.btn_wrap button i{width: 8px; display: inline-block; margin-left: 6px;}
.sec02 .quick_box .input_wrap.btn_wrap button:hover{background-color: rgb(255, 243, 246);}
.sec02 .quick_box .quick_inq .input_wrap > div{width: calc((100% - 16px) / 3);}

.sec02 .input_wrap input, .sec02 .input_wrap button{height: 45px; font-size: 15px; width: 100%;}
.sec02 .input_wrap input{background-color: #f5f5f5; border: transparent; padding: 0 14px;}
.sec02 .input_wrap button{background-color: #FF859E; color: #fff; text-align: center; width: 100%;}
.sec02 .input_wrap input::placeholder{color: #999;}
.sec02 .input_wrap input:focus{outline: 2px solid rgb(255, 195, 207);}


.shortcuts{display: flex; justify-content: space-between; align-items: center; text-align: center; }
.shortcuts li{cursor: pointer; }
.shortcuts li:hover div{border-color: #FF859E50; background-color: #FF859E08; box-shadow: 0 0 16px #FF859E30;}
.shortcuts li:hover p{color: #FF859E;}
.shortcuts li p{font-size: 18px; font-weight: 500; margin-top: 24px;}
.shortcuts li div{width:120px;/*원하는 크기*/ background-color: #f5f5f5; border-radius:50%; position: relative; border: 2px solid #f5f5f5; }
.shortcuts li div::before{content:""; display:block; padding-top:100%;}
.shortcuts li i{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
/* .shortcuts li i:before{content:""; display:block; background-color: #f5f5f5; border-radius:50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 120px; height: 120px; z-index: 120px;} */


/* sec03 */
.sec03{position: relative;}
.sec03:after{content:''; position: absolute; display: block; opacity: .1; width: 360px; height: 360px; border: 75px solid #FF859E; border-radius: 50%; right: 50px; top:100px; z-index: -10;}
.sec03 ul{display: flex; gap: 24px;}
.sec03 ul li{border-radius: 10px; height: 513px; width: 100%; background-size: cover; background-color: #fff; background-repeat: no-repeat; background-position: center; color: #fff; position: relative; cursor: pointer; overflow: hidden; transition: all .2s;}
.sec03 ul li:nth-child(2n){margin-top: 60px; }
.sec03 ul li:nth-child(1){background-image: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/mp_01.jpg);}
.sec03 ul li:nth-child(2){background-image: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/mp_02.jpg);}
.sec03 ul li:nth-child(3){background-image: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/mp_03.jpg);}
.sec03 ul li:nth-child(4){background-image: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/mp_04.jpg);}
.sec03 ul li .txt{position: absolute; bottom: 0; padding: 35px; z-index: 5;}
.sec03 ul li .txt b{display: block; font-size: 22px; font-weight: 600; margin-bottom: 12px; line-height: 1.3; }
.sec03 ul li .txt p{font-size: 16px;}
.sec03 ul li:after{content:''; position: absolute; display: block; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); z-index: 1; transition: all .2s; opacity: 0;}
.sec03 ul li:hover:after{opacity: 1;}

.sec03 ul li:before{content:''; position: absolute; display: block; width: 70px; height: 70px; border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/arrow_right.svg) center center  no-repeat #FF859E; opacity: 0; transition: all .2s;}
.sec03 ul li:hover:before{opacity: 1;}
.sec03 ul li:hover{transform: translateY(-16px); box-shadow: 0 20px 20px #FF859E30;} 





/* sec04 */
.sec04{margin-top: 0; background-color: #E9A2A820;}
.sec04 .title .flex{display: flex; gap: 10px; height: max-content;}
.sec04 .title .more_btn button:after{display: none;}
.toggletab{background-color: #fff; border-radius: 55px; padding: 6px; display: flex; }
.toggletab li{padding: 12px 24px; border-radius: 50px; color: #999; line-height: 1; font-size: 18px; display: flex; justify-content: center; align-items: center; cursor: pointer;}
.toggletab li.on{background-color: #FF859E; color: #fff;}
/* 뉴스 슬라이더 (병원소식/행사소식) */
.news-slider-wrap{position: relative; overflow: hidden; padding: 20px 0 20px; cursor: grab; user-select: none;}
.news-slider-wrap:active{cursor: grabbing;}
.news-slider{display: flex; flex-wrap: nowrap; gap: 20px; transition: transform 1s cubic-bezier(0.25, 0.1, 0.25, 1); will-change: transform; align-items: center;}
.news-card{background-color: #fff; border-radius: 10px; padding: 32px 24px; cursor: pointer; flex: 0 0 calc(33.333% - 14px); box-sizing: border-box; border: 1px solid #f0f0f0; transition: transform 0.5s cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 0.5s ease, border-color 0.5s ease, background-color 0.5s ease; transform: scale(0.95); opacity: 0.85;}
.news-card:hover{box-shadow: 0 12px 24px #FF859E30; border-color: #FF859E;}
.news-card.active{background-color: #FF859E; border-color: #FF859E; transform: scale(1.03); opacity: 1; box-shadow: 0 16px 32px #FF859E40;}
.news-card.active *{color: #fff !important;}
.news-card.active .notice_cate{border-color: #fff !important; background-color: rgba(255,255,255,0.15) !important;}
.news-card.active .date{display: none;}
.news-card.active .more{display: flex;}
.news-progress{width: 100%; height: 4px; background-color: #eee; border-radius: 4px; margin-top: 20px;}
.news-progress-bar{height: 100%; background-color: #FF859E; border-radius: 4px; transition: width 0.3s ease; width: 0%;}
.n_con{display: flex; flex-direction: column; gap: 24px; margin-bottom: 40px; }
.n_con .notice_cate{display: inline-block; color: #FF859E; border: 1px solid #FF859E; background-color: #FF859E20; border-radius: 4px; padding: 8px 12px; line-height: 1; width: max-content; font-size: 14px;}
.n_con h6{font-size: 22px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.n_con p, .date{font-size: 18px; color: #999;}
.n_con p{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.5em; height: 3em;}
.more{display: none; padding-top: 10px;}
.more button{display: flex; justify-content: center; align-items: center; background-color: #fff; border-radius: 50%; width: 50px; height: 50px;}










.scroll {position: absolute; bottom: 200px; left: 95%; display: flex; align-items: center; gap: 8px; transform: rotate(90deg);}
.scroll span {font-size: 14px; width: max-content;}
.scr_con {width: 40px; height: 12px; position: relative;}
.scr_con i {display: block; width: 12px; aspect-ratio: 1; border-radius: 2px; background-color: #fff; position: absolute; opacity: 0; right: calc(100% - 12px);}
.scr_con i:nth-of-type(1) {animation: scr1 1.5s .3s infinite ease-in;}
.scr_con i:nth-of-type(2) {animation: scr2 1.5s infinite ease-in;}
.scr_con i:nth-of-type(3) {right: 0; opacity: .75;}


@keyframes scr1 {
    50% {right: 60%; opacity: .2;}
    100% {right: 0; opacity: .5;}
}

@keyframes scr2 {
    50% {right: 50%; opacity: .5;}
    100% {right: 0; opacity: .75;}
}



/* ======== 바로가기 메뉴 ======== */
.quick {width: 100%; position: relative; padding: 150px 0; background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/bg_main03.jpg) no-repeat center/cover;}
.quick .bg {width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 4%;}
.quick .bg span {font-size: clamp(40px, 10vw, 200px); font-family: "Josefin Sans", sans-serif; font-weight: 800; line-height: 1; min-width: max-content;}
.quick .bg span:nth-of-type(1) {color: #fff;  -webkit-text-fill-color: #fff; text-shadow: 1px 1px 0 #E9A2A8, -1px -1px 0 #E9A2A8, 1px -1px 0 #E9A2A8, -1px 1px 0 #E9A2A8, 1px 1px 0 #E9A2A8; opacity: .5;}
.quick .bg span:nth-of-type(2) {text-align: right; background: -webkit-linear-gradient(307deg, #FFADB425 0%, #FEE8E0 100%); background-clip: clip; -webkit-text-fill-color: transparent; -webkit-box-decoration-break: clone; clip-path: inset(1px); -webkit-background-clip: text;}



.quick_menu {width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 35px;}
.quick_con {aspect-ratio: 5 / 3; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 40px; justify-content: flex-end; color: #fff; position: relative; cursor: pointer;}

/* 박스배경 */
.quick_con::before {content: ""; -webkit-mask-image: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/shape.png); background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/bg_footer.jpg) no-repeat center/cover; -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; opacity: 1}
/* .quick_con:hover::before {opacity: 0;} */
.quick_con::after {content: ""; -webkit-mask-image: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/shape.png); background: #f18f98; -webkit-mask-repeat: no-repeat; -webkit-mask-size: 100% 100%; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; opacity:0;}
.quick_con:hover::after {opacity: 1;}

.quick_con:nth-of-type(1)::before {background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/quick_service.jpg) no-repeat center/cover;}
.quick_con:nth-of-type(2)::before {background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/quick_helper.jpg) no-repeat center/cover;}
.quick_con:nth-of-type(3)::before {background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/quick_reservation.jpg) no-repeat center/cover;}

.quick_con .quick_txt {display: flex; flex-direction: column; align-items: flex-start; z-index: 1;}
.quick_con .quick_txt span {font-size: 40px; font-weight: 600; font-family: "Josefin Sans", sans-serif; position: relative; line-height: 1;}
.quick_con .quick_txt span::after {content: ""; display: block; width: 10px; aspect-ratio: 1; border-radius: 100%; background-color: #ff6875; left: 100%; bottom: 0; position: absolute;}
.quick_con .quick_txt .tit {font-size: 28px; font-weight: 500; line-height: 1; padding-top: 15px;}
.quick_con .quick_txt .text {font-size: 20px; line-height: 1.4; padding-top: 30px; display: none; transition: all .2s;}
.quick_con:hover {justify-content: flex-start;}
.quick_con:hover .quick_txt .text {display: block;}
.quick_con i {display: block; width: 47px; aspect-ratio: 1; border-radius: 100%; overflow: hidden; background: linear-gradient(to right bottom, #FFADB4, #FDDCDC); position: absolute; bottom: 0; right: 0;}
.quick_con i::after {content: ""; display: block; width: 20px; aspect-ratio: 1; background: url(https://d2ipzucit9ojde.cloudfront.net/homepage/img/icon_arrow.png) no-repeat center/contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.quick_con:hover i {background: #ff6875;}


.mo_more_btn {display: none;}



/* ********************************************* *
* 1600 max
* ********************************************* */
@media screen and (max-width: 1600px) {
}


/* ********************************************* *
* 1440px max
* ********************************************* */
@media screen and (max-width: 1440px) {
    /* sec01 */
    .main_txt h1 span{font-size: 52px;}
    .main_txt div > span{margin-top: 20px;}
    .main_video video{height: 100vh; width: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

    /* sec02 */
    .input_wrap input{padding: 0 12px;}
    .sec02 .quick_box li h6{margin-bottom: 16px;}
    .sec02 .quick_box .input_wrap{margin-top: 28px;}

    /* sec03 */
    .sec03 ul{gap: 16px;}
    .sec03 ul li .txt{padding: 28px;}

}



/* ********************************************* *
* 1280px max
* ********************************************* */
@media screen and (max-width: 1280px) {

    .section.pd{padding: 110px 0;}
    .title h6{font-size: 36px;}
    .title p{font-size: 17px;}
    .more_btn button{padding: 18px;}

    /* sec01 */
    .main_txt h1 span{font-size: 46px;}
    .main_txt div > span{font-size: 18px; }

    /* sec02 */
    .input_wrap input{padding: 0 10px;}
    .sec02 .quick_box li{border-radius: 1.6rem; padding: 40px 26px;}
    .sec02 .quick_box li h6{font-size: 24px; margin-bottom: 14px; line-height: 1.3;}
    .sec02 .quick_box li p{font-size: 16px;}
    .sec02 .quick_box .input_wrap{margin-top: 22px;}
    .shortcuts li p{font-size: 17px; margin-top: 18px;}

    /* sec03 */
    .sec03 ul li .txt{padding: 24px;}
    .sec03 ul li{height: 430px;}

    /* sec04 */
    .toggletab li{font-size: 16px; line-height: 1.4;}


}


/* ********************************************* *
* 1200px max
* ********************************************* */
@media screen and (max-width: 1200px) {
    
    /* sec04 */
    .news-card{flex: 0 0 calc(50% - 10px);}
    .n_con .notice_cate{font-size: 15px; padding: 7px 10px;}
    .n_con{gap: 16px; margin-bottom: 30px;}
    .n_con p, .date{font-size: 16px;}
    .n_con h6{font-size: 20px;}
    .more{padding-top: 0;}

    /* sec03*/
    .sec03:after{width: 300px; height: 300px; right: 34px; top: 40px;}
    .sec03 ul li{height: 430px;}


}




/* ********************************************* *
* 1024px max
* ********************************************* */
@media screen and (max-width: 1080px) {

    .section.pd{padding: 100px 0;}
    .title {margin-bottom: 60px;}

    /* sec02 */
    .sec02 .quick_box{align-items: flex-start;}
    .sec02 .quick_box li{padding: 28px 20px; border-radius: 1.3rem; height:100%;}
    .sec02 .quick_box li h6{font-size: 20px; margin-bottom: 8px;}
    .sec02 .quick_box li p{font-size: 14px; display: flex; align-items: center;}
    .sec02 .quick_box .input_wrap{margin-top: 16px;}
    .sec02 .quick_box li{}
    .sec02 .quick_box li:first-child{flex: .8;}
    /* .sec02 .quick_box li:first-child .input_wrap.btn_wrap{display: block;}
    .sec02 .quick_box li:first-child .input_wrap.btn_wrap button:first-child{margin-bottom: 8px;}
 */
    .sec02 ul + ul{margin-top: 60px;}
    .shortcuts{flex-wrap: wrap; justify-content: center; width: 80%; margin: 0 auto; gap: 36px 0;}
    .shortcuts li{width: 25%; display: flex; flex-direction: column; align-items: center;}

    /* sec03 */
    .sec03 ul li{height: 360px;}
    .sec03 ul li .txt{padding: 18px;}
    .sec03 ul li .txt b{font-size: 19px; margin-bottom: 8px;}
    .sec03 ul li .txt p{font-size: 15px;}
    .sec03 ul li:before{width: 50px; height: 50px; background-size: 18px;}

    /* sec04 */
    .more_btn button{padding: 16px;}

}



/* ********************************************* *
* 960px max
* ********************************************* */
@media screen and (max-width: 960px) {
    /* sec02 */
    .sec02 .quick_box li{padding: 24px 15px;}

    /* sec03*/
    .sec03:after{width: 240px; height: 240px; right: -70px; top: 0; border-width: 50px;}
    .sec03 ul{flex-wrap: wrap; gap: 12px;}
    .sec03 ul li{width: calc(50% - 6px); height: 250px;}
    .sec03 ul li:nth-child(2n){margin-top: 0;}
    .sec03 ul li:nth-child(2){background-position: center 30%;}
    .sec03 ul li:nth-child(3){background-position: center 20%;}
    .sec03 ul li .txt{padding: 22px;}
    .sec03 ul li .txt b{font-size: 21px; margin-bottom: 12px;}
}


/* ********************************************* *
* 840px max
* ********************************************* */
@media screen and (max-width: 840px) {

    /* sec01 */
    .main_wrap{height: 85vh;}
    .main_video video{height: 86vh;}
    .main_txt h1 span{font-size: 40px;}
    .main_txt div > span{font-size: 17px; margin-top: 16px;}

    /* sec02 */
    .shortcuts li div{width: 100px;}
    .shortcuts li p{margin-top: 12px; font-size: 16px;}
    .shortcuts li i{display: flex; align-items: center; justify-content: center;}
    .shortcuts li i img{max-width: 85%}
    .sec02 .quick_box li:first-child {display: none;}






}


/* ********************************************* *
* 768px max
* ********************************************* */
@media screen and (max-width: 768px) {
    .title{margin-bottom: 45px;}
    .title h6{font-size: 32px;}
    .title h6 + p{margin-top: 4px;}
    .title p{font-size: 16px;}
    .section.pd{padding: 80px 0; border-radius: 40px 40px 0 0;}

    .sec02 .quick_box li > .input_wrap > div:first-child,
    .sec02 .quick_box li > .input_wrap > div:nth-child(2){display: none;}

    .sec02 .quick_box li > .input_wrap > div:last-child { width: 100%;}
    
    .more_btn button {padding: 12px;}
    .more_btn button i img {width: 10px; height: 10px;}

    /* sec04 */
    .sec04 .title {flex-direction: column;}
    .sec04 .toggletab {width: 100%; margin-top: 16px;}
    .sec04 .toggletab li {width: 50%; padding: 10px 20px 12px;} 
    .sec04 .more_btn {display: none;}

    .sec03 .more_btn {display: none;}
    .mo_more_btn {display: block; margin-top: 16px;}
    .mo_more_btn > button {width: 100%; background-color: #fff; border: 1px solid #FF859E; padding: 14px; border-radius: .6rem; font-size: 15px; color: #ff6875; transition: all 0.3s; line-height: 1;}
    .mo_more_btn > button:hover {background-color: #FF859E; color: #fff;}

    .sec02, .sec04{background-size: 50%; }

}


/* ********************************************* *
* 640px max
* ********************************************* */
@media screen and (max-width: 640px) {

    /* sec01 */
    .main_txt h1 span{font-size: 34px;}
    .main_txt div > span{font-size: 16px; margin-top: 12px;}
    
    /* sec02 */
    .shortcuts{width: 95%;}
    .shortcuts li div{width: 90px;}
    .shortcuts li i img{width: 75%;}
    .shortcuts li p{font-size: 15px;}

    /* sec03 */
    .sec03 ul li .txt{padding: 18px;}
    .sec03 ul li .txt b{font-size: 18px; margin-bottom: 8px;}
    .sec03 ul li .txt p{font-size: 14px;}

}


/* ********************************************* *
* 560px max
* ********************************************* */
@media screen and (max-width: 560px) {
    .title h6{font-size: 28px;}
    .title p{font-size: 15px;}

    /* sec01 */
    .main_txt h1 span{font-size: 30px;}
    .main_txt div > span{font-size: 16px; margin-top: 12px;}
    
    /* sec02 */
    .shortcuts{width: 100%; gap: 30px 0;}
    .shortcuts li p{font-size: 15px;}

    /* sec03 */
    .sec03 ul li{height: 320px;}
    .sec03 ul li .txt b{font-size: 19px; margin-top: 10px;}
    .sec03 ul li .txt p{height: 4.5em;}
}


/* ********************************************* *
* 500px max
* ********************************************* */
@media screen and (max-width: 500px) {

    /* sec02 */
    .sec02 ul + ul{margin-top: 24px;}
    .sec02 .quick_box {flex-direction: column;}
    .sec02 .quick_box > li {width: 100%;}
    .sec02 .quick_box li p {height: auto;}
    .shortcuts li div{border-radius: .6rem; width: 100%; background-color: #fff; border: 1px solid #FF859E88;}
    .shortcuts li div::before{padding-top: 67px;}
    .shortcuts{gap: 4px; justify-content: flex-start;}
    .shortcuts li{width: calc((100% - 4px) / 2); position: relative;}
    .shortcuts li i{left: 30px;}
    .shortcuts li p{ position: absolute; right: 16px; top: 50%; transform: translateY(-50%); margin-top: 0; color: #463838;}
    /* .shortcuts li p:after{content:''; width: 10px; height: 10px; border-radius: 50%; background-color:#ffe4e7; position: absolute; right: -5px; top: 0px; z-index: -1;}  */
    .shortcuts li:last-child{width: 100%;}
    .shortcuts li:active div{background-color: #FF859E;}
    .shortcuts li:active p{color: #fff;}
    .shortcuts li:active i img{filter: brightness(100000%);}

}


/* ********************************************* *
* 450px max
* ********************************************* */
@media screen and (max-width: 450px) {
    
    .title h6{font-size: 26px;}
    .title h6 + p{margin-top: 0;}

    /* sec01 */
    .main_wrap{height: 690px;}
    .main_video video{height: 695px;}
    .main_txt h1 span{font-size: 27px;}
    .main_txt div > span{font-size: 15px; margin-top: 8px;}

    /* sec02 */
    .shortcuts li i {left: 24px;}
    .shortcuts li i img{width: 55%;}    
    .shortcuts li div::before{padding-top: 56px;}
    
    
    /* sec03 */
    .sec03 ul li{height: 210px; width: 100%;}
    .sec03 ul li .txt p{height: fit-content;}

    /* sec04 */
    .news-card{flex: 0 0 calc(80%);}

    .sec03 ul li:hover {transform: translateY(0);}
    .sec03 ul li:before {top: 100%; left: 100%; transform: translate(-150%, -150%);}




}

/* ********************************************* *
* 400px max
* ********************************************* */
@media screen and (max-width: 400px) {

    /* sec01 */
    .main_txt{top: 45%;}
    .main_txt h1 span{font-size: 28px;}
    /* .main_txt h1 span br{display: block;} */
    .main_txt h1 + h1{padding-top: 3px;}
    .main_txt h1:first-child span{font-size: 22px; font-weight: 600;}
    /* .main_txt h1:last-child span{font-size: 32px;} */
    .main_txt h1:nth-child(2) span, .main_txt h1:nth-child(2) span b{ font-size: 34px; font-weight: 800;}
    .main_txt div > span{margin-top: 18px;}

    /* sec03 */
    .sec03 ul li{height: 180px;}
}

/* ********************************************* *
* 370px max
* ********************************************* */
@media screen and (max-width: 370px) {
    /* .main_txt div > span{font-size: 15px; margin-top: 8px;} */


    /* sec01 */
    /* .main_txt h1 span{font-size: 24px;} */


}


/* ********************************************* *
* 360px max
* ********************************************* */
@media screen and (max-width: 360px) {

    /* sec02 */
    .shortcuts li{width: 100%;}
    .shortcuts li div::before{padding-top: 52px;}

}
