/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * Sub_visual *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.sub_visual {background: no-repeat center center / cover; color: #fff; position: relative;}
.sub_visual h2 {font-weight: 400; font-family: var(--eng-font); font-size: var(--fz-76); line-height: 1.25em; letter-spacing: 0.05em;}
.sub_visual p {font-size: var(--fz-22); line-height: 1.45em; margin-top: 20px;text-wrap: wrap;}
.sub_visual .flex_wrap {height: 650px; align-items: center;}
.sub_visual_bg {background: url(/statics/images/img/sub_visual.jpg);}

@media all and (max-width: 1024px) {
    .sub_visual .flex_wrap {height: 450px;}
    .sub_visual .flex_wrap .txt_box {width: 100%;}
}

/* 라인, 볼륨 예외 사항 */
@media all and (max-width: 767px) {
    :is(.line, .volume) .sub_visual {background-position: center right -240px;}
}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * media *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.media_con {background: url(/statics/images/img/media_con_bg.png) no-repeat center center / cover; color: #fff;}
.media_con .flex_wrap {gap: 60px; justify-content: space-between;}
.media_con .row01 ul {display: flex; gap: 55px;}
.media_con .row01 ul li {width: calc(33.3333% - 37px); cursor: pointer; transition: 0.25s;}
.media_con .row01 ul li .img_box {aspect-ratio: 16/9;}
.media_con .row01 ul li .img_box img {width: 100%; height: 100%; object-fit: cover; object-position: center; max-width: unset;}
.media_con .row01 ul li .txt_box {background-color: #fff; color: #888; padding: 25px 30px; box-sizing: border-box; transition: 0.25s;}
.media_con .row01 ul li .box_label {display: flex;  font-weight: 300; font-size: var(--fz-16); line-height: 1.625em; flex-wrap: wrap; gap: 0 25px; margin-bottom: 25px;}
.media_con .row01 ul li .box_title h5 {font-weight: 500; font-size: var(--fz-26); line-height: 1.38em; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: 0.25s;}
.media_con .row01 ul li .box_title p {font-size: var(--fz-18); line-height: 1.55em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 20px;}
.media_con .row01 ul li .box_title .dev {display: none;}

.media_con .row01 ul li:hover .txt_box{background-color: #1e2d64; color: #ced0d8;}
.media_con .row01 ul li:hover .box_title h5 {color: #fff; text-decoration: underline; text-underline-offset: 7px;}

@media all and (min-width: 1025px) {
    .media_con .row01 ul li:hover {transform: translateY(-50px);}
}

@media all and (max-width: 1200px) {
    .media_con .row01 ul {gap: 30px;}
    .media_con .row01 ul li {width: calc(33.3333% - 20px);}
}

@media all and (max-width: 1024px) {
    .media_con .row01 ul {gap: 30px; flex-wrap: wrap; justify-content: center;}
    .media_con .row01 ul li {width: calc(50% - 15px);}
}

@media all and (max-width: 767px) {
    .media_con .row01 ul li {width: 100%;}
}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * media 게시판 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.media_board_con ul li > * {flex-shrink: 1;} 
.media_board_con ul li .flex_wrap {align-items: center; gap: 20px;}
.media_board_con ul li .flex_wrap .txt_box {width: calc(100% - 270px);}
.media_board_con ul li .img_box {width: 250px; aspect-ratio: 16/9;}
.media_board_con ul li .img_box img {width: 100%; height: 100%; object-fit: cover; object-position: center;}

@media all and (max-width: 767px) {
    /* .media_board_con ul li .img_box {width: 100%; } */
    .media_board_con ul li .flex_wrap {flex-wrap: wrap;}
    .media_board_con ul li .flex_wrap .txt_box {width: 100%;}
}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * Contact *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.contact_con {background: url(/statics/images/img/contact_con_bg.jpg) no-repeat center center / cover;}
.contact_con .main_tit {text-align: right;}
.contact_con .row.flex_wrap {gap: 60px;}
.contact_con .map_box {text-align: left; width: 100%;}
.contact_con .map_box img {width: 100%;}
.contact_con .txt_box {width: 50%;}
.contact_con .txt_box h5 {font-weight: 700; font-size: var(--fz-26); line-height: 1.38em;}
.contact_con :is(.time, .addr) {gap: 60px;}
.contact_con :is(.time, .addr) .tit {width: 155px}
.contact_con :is(.time, .addr) .con {width: calc(100% - 150px);}
/* time */
.contact_con .time .con {position: relative;}
.contact_con .time .note {font-size: var(--fz-18); line-height: 1.55em; color: #1e2d64; text-align: right; position: absolute; bottom: 100%; right: 0;}
.contact_con .time table {width: 100%; border-top: 1px solid #1e2d64; border-bottom: 1px solid #1e2d64;}
.contact_con .time table .ta-center {text-align: center;}
.contact_con .time table tr {height: 55px; font-weight: 500; font-size: var(--fz-18); line-height: 1.55em;}
.contact_con .time table tr:last-child {border-top: 1px solid #bfbfbf;}
.contact_con .time table tr > * {padding: 0 30px; box-sizing: border-box;}
.contact_con .time table th {text-align: left; color: #333; width: 170px;}
.contact_con .time table td {color: #444;}
.contact_con .time table td span {font-size: var(--fz-16); color: #666;}
/* addr */
.contact_con .addr {color: #1e2d64; margin-top: 80px;}
.contact_con .addr .con {text-align: right;}
.contact_con .addr .con p a {font-weight: 500; font-size: var(--fz-20); line-height: 1.5em; text-decoration: underline; text-underline-offset: 5px;}
/* guide */
.contact_con .guide {margin-top: 80px;}
.contact_con .guide > * {width: 50%; text-align: center; background-color: rgba(255, 255, 255, 0.3); padding: 50px 25px; box-sizing: border-box; position: relative;}
.contact_con .guide > * + *::before {content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 1px; height: 100px; background-color: #bfbfbf;}
.contact_con .guide .tit {margin-bottom: 20px;}
.contact_con .guide .con p {font-weight: 500; font-size: var(--fz-16); line-height: 1.625em; color: #666;}

@media all and (max-width: 1400px) {
    .contact_con .time table tr > * {padding: 0 15px;}
}

@media all and (max-width: 1300px) {
    .contact_con :is(.time, .addr) {gap: 30px;}
    .contact_con :is(.time, .addr) .con {width: calc(100% - 120px);}
}

@media all and (max-width: 1100px) {
    .contact_con :is(.time, .addr) {gap: 20px;}
    .contact_con :is(.time, .addr) .con {width: calc(100% - 110px);}
    .contact_con .time table tr > * {padding: 0 10px;}
    .contact_con .addr .con p {font-size: var(--fz-18);}
    .contact_con .guide > * {padding: 50px 10px;}
}

@media all and (max-width: 1024px) {
    .contact_con .main_tit {text-align: left;}
    .contact_con .row.flex_wrap {flex-wrap: wrap;}   
    .contact_con .map_box {width: 100%; order: 1; text-align: center;}
    .contact_con .txt_box {width: 100%;}
}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * Notice *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.notice_con .heading {gap: 60px; justify-content: space-between;}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * about con01 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
/* layout */
.about .con01 .flex_wrap {align-items: center;}
.about .con01 .right {width: calc(50% + 150px);}
.about .con01 .left {width: calc(50% - 150px);}
/* img_box */
.about .con01 .img_box img {width: 100%;}
/* txt_box */
.about .con01 .heading {width: 100%; max-width: calc(700px - 150px); margin: auto; margin-right: 0; padding-right: 85px; box-sizing: border-box;}

@media all and (max-width: 1400px) {
    .about .con01 .right {width: calc(50% + 100px);}
    .about .con01 .left {width: calc(50% - 100px);}
}

@media all and (max-width: 1300px) {
    .about .con01 .heading {padding-right: 45px;}
}

@media all and (max-width: 1024px) {
    .about .con01 .flex_wrap {flex-wrap: wrap; gap: 60px;}
    .about .con01 .right,
    .about .con01 .left {width: 100%;}
    .about .con01 .left {order: 1;}
    .about .con01 .heading {max-width: unset;}
    .about .con01 .img_box {text-align: center;}
    .about .con01 .img_box img {max-width: fit-content;}
}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * about con02 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.about .con02 .flex_wrap {align-items: center; gap: 0 100px;}
.about .con02 .left {width: 50%;}
.about .con02 .right {width: calc(50% - 100px);}
/* img_box */
.about .con02 .img_box img {width: 100%;}
/* heading */
.about .con02 .heading {text-align: right;}
.about .con02 .heading .desc p {max-width: 25em; margin: auto; margin-right: 0;}

@media all and (max-width: 1300px) {
    .about .con02 .flex_wrap {gap: 45px;}
    .about .con02 .right {width: calc(50% - 45px);}
}

@media all and (max-width: 1024px) {
    .about .con02 .flex_wrap {flex-wrap: wrap;}
    .about .con02 .right,
    .about .con02 .left {width: 100%;}
    .about .con02 .img_box {text-align: center;}
    .about .con02 .img_box img {max-width: fit-content;}
}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * about con03 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.about .con03 {background: linear-gradient(to bottom, #f5e0d9 25%, #fff); overflow: hidden;}
.about .con03 .flex_wrap {gap: 70px; align-items: center;}
.about .con03 .left {width: 50%;}
.about .con03 .right {width: calc(50% - 70px);}
/* left */
.about .con03 .name-tag {font-family: var(--kor-eng-font); color: #1e2d64;}
.about .con03 .name-tag h3 {font-weight: 500; font-size: var(--fz-62); line-height: 1.16em;text-wrap: nowrap;}
.about .con03 .name-tag p {font-size: var(--fz-22); line-height: 1.27em; margin-bottom: 15px;}
.about .con03 .divider {width: 350px; height: 2px; background: linear-gradient(to right, #1e2d64 15%, transparent 85%); margin: 30px 0 40px;}
.about .con03 .profile {background-color: rgba(255, 255, 255, 0.5); box-sizing: border-box; column-count: 2; padding: 30px 40px; box-sizing: border-box;}
.about .con03 .profile p {display: inline-block; width: 100%; font-size: var(--fz-16); line-height: 1.625em; color: #444; padding-left: 0.5em; box-sizing: border-box; position: relative; padding: 6px 0; box-sizing: border-box;}
.about .con03 .profile p::before {content: '- '; position: absolute; top: 0; left: 0;}
.about .con03 .thesis {margin-top: 40px;}
.about .con03 .thesis h5 {font-size: var(--fz-18); line-height: 1.55em; color: #444; margin-bottom: 10px;}
.about .con03 .thesis ul {list-style: '- '; padding-left: 0.5em; box-sizing: border-box;}
.about .con03 .thesis ul li {font-size: var(--fz-16); line-height: 1.625em; color: #888;}
/* right */
.about .con03 .img_box {text-align: center;}
.about .con03 .img_box img {width: 100%; max-width: fit-content; position: relative;}
.about .con03 .img_box .img {display: inline-block; width: 100%; max-width: fit-content; position: relative;}
.about .con03 .img_box .img::before {content: ''; position: absolute; width: 105%; aspect-ratio:  1/1; border-radius: 50%; background-color: #fff; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.about .con03 .img_box .img::after {position: absolute; bottom: 0; left: 0; content: 'JOA Plastic Surgery'; font-family: var(--eng-font); font-size: var(--fz-80); line-height: 1.2em; letter-spacing: 0.01em; z-index: 1; white-space: nowrap; color: #dfe0e6;}

@media all and (max-width: 1024px) {
    .about .con03 .flex_wrap {flex-wrap: wrap;}
    .about .con03 .left,
    .about .con03 .right {width: 100%;}
    .about .con03 .left {order: 1;}
}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * about con04 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.about .con04 .heading {display: flex; align-items: center; justify-content: space-between; gap: 30px;}
.about .con04 .heading .desc {flex-shrink: 1;}
/* main_slick */
.about .con04 .main_slick {position: relative; background-color: #000;}
.about .con04 .main_slick .slick-slide {height: 600px;}
.about .con04 .main_slick .slick-slide img {width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.about .con04 .main_slick .slick-btn {display: flex; align-items: center; justify-content: center; width: 10%; height: 100%; cursor: pointer; position: absolute; top: 0; max-width: 100px;}
.about .con04 .main_slick .slick-btn::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: 0.25s;}
.about .con04 .main_slick .slick-btn:hover::before {opacity: 1;}
.about .con04 .main_slick .slick-btn i {display: block; width: 25px; height: 46px; background: no-repeat center center / contain; position: relative;}
/* prev btn */
.about .con04 .main_slick .slick-btn.prev {left: 0;}
.about .con04 .main_slick .slick-btn.prev::before {background: linear-gradient(to right, #1e2d64 10%, transparent);}
.about .con04 .main_slick .slick-btn.prev i {background-image: url(/statics/images/img/prev_25x46.png);}
/* next btn */
.about .con04 .main_slick .slick-btn.next {right: 0;}
.about .con04 .main_slick .slick-btn.next::before {background: linear-gradient(to left, #1e2d64 10%, transparent);}
.about .con04 .main_slick .slick-btn.next i {background-image: url(/statics/images/img/next_25x46.png);}
/* thumb_slick */
.about .con04 .thumb_slick {overflow: hidden; margin-top: 20px;}
.about .con04 .thumb_slick ul {margin: 0 -5px;}
.about .con04 .thumb_slick .slick-slide {aspect-ratio: 16/9; margin: 0 5px; position: relative;}
.about .con04 .thumb_slick .slick-slide::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3);}
.about .con04 .thumb_slick .slick-slide.slick-current::before {display: none;}
.about .con04 .thumb_slick .slick-slide img {width: 100%; height: 100%; object-fit: cover; object-position: center;}

@media all and (max-width: 767px) {
    .about .con04 .main_slick .slick-slide {height: 400px;}
}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * eyebrows con02 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
#eyebrows .con02 {box-sizing: border-box;}
#eyebrows .con02 .inner {justify-content: space-between; align-items: center; gap: 60px;}
#eyebrows .con02 .check_list {margin-top: 40px;}
#eyebrows .con02 .right {flex-shrink: 1;}
#eyebrows .con02 .img_box {gap: 10px; flex-wrap: wrap; justify-content: center;}
#eyebrows .con02 .img_box > * {width: calc(50% - 5px);}

@media (min-width: 768px) and (max-width: 1200px) {
    #eyebrows .con02 .img_box > * {width: 100%; max-width: fit-content;}
}

@media all and (max-width: 767px) {
    #eyebrows .con02 .inner {flex-wrap: wrap;}
    #eyebrows .con02 .left,
    #eyebrows .con02 .right {width: 100%;}
}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * undereye con01 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
#under-eye .con02 .img_list li {width: calc(50% - 35px);}

@media all and (max-width: 1300px) {
    #under-eye .con02 .img_list li {width: calc(50% - 15px);}
}

@media all and (max-width: 767px) {
    #under-eye .con02 .img_list li {width: 100%; max-width: 660px;}
}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * line con05 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.line .con05 .info_list .txt_box p {font-size: var(--fz-16);}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * baby con05 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.baby .con05 {background-color: #1e2d64; color: #fff;}
.baby .con05 .sub_main_tit h3 {color: #fff;}
.baby .con05 .inner {gap: 100px; align-items: center;}
.baby .con05 .left {width: calc(50% - 100px);}
.baby .con05 .right {width: 50%;}
/* img_box */
.baby .con05 .img_box {width: 100%; max-width: 600px; aspect-ratio: 1/1; border-radius: 50%; padding: 25px; box-sizing: border-box; background: linear-gradient(135deg, transparent 25%, rgba(255, 255, 255, 0.7));}
.baby .con05 .img_box img {width: 100%; height: 100%; border-radius: 50%; border: 2px solid #fff; box-sizing: border-box;}
/* txt_box */
.baby .con05 .txt_box p {font-size: var(--fz-24); line-height: 1.5em; color: #fff; text-align: center;}
.baby .con05 .txt_box b {font-weight: 700;}
/* box_list */
.baby .con05 .box_list {display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; margin-top: 30px;}
.baby .con05 .box_list li {width: calc(50% - 10px); background-color: rgba(255, 255, 255, 0.1); border: 1px solid #fff; box-sizing: border-box; text-align: center; padding: 30px 25px; box-sizing: border-box;}
.baby .con05 .box_list li i {display: inline-block; width: 14px; height: 11px; background: url(/statics/images/img/check_14x11.png) no-repeat center center / contain; filter: invert(1); margin-bottom: 15px;}
.baby .con05 .box_list li p {font-size: var(--fz-20); line-height: 1.5em;}
.baby .con05 .box_list li p b {font-weight: 700;}

@media all and (max-width: 1200px) {
    .baby .con05 .inner {gap: 50px;}
    .baby .con05 .left {width: calc(50% - 50px);}
}

@media all and (max-width: 1024px) {
    .baby .con05 .inner {flex-wrap: wrap;}
    .baby .con05 .left,
    .baby .con05 .right {width: 100%;}
    .baby .con05 .img_box {margin: auto;}
}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * skin common *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.skin .section.gradient {background: linear-gradient(to bottom, #f5e0d9, #fff);}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * botox con03 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
#botox .con03 {background-color: #1e2d64; color: #fff;}
#botox .con03 .sub_main_tit h3 {color: #fff;}
#botox .con03 .img_list li {width: calc(50% - 35px);}
#botox .con03 .img_list .img_box {height: auto;}
#botox .con03 .img_list .img_box img {object-fit: contain;}
#botox .con03 .img_list .txt_box {background-color: rgba(255, 255, 255, 0.1); border-top: 2px solid #fff; padding: 30px 20px; height: unset;}
#botox .con03 .img_list .txt_box h6 {font-weight: 700; font-size: var(--fz-28); line-height: 1.214em; color: #fff;}
#botox .con03 .img_list .note {margin-top: 30px;}
#botox .con03 .img_list .note p {font-size: var(--fz-20); line-height: 1.5em; text-align: center; color: #fff;}
#botox .con03 .img_list .note p::before {content: url(/statics/images/img/check_14x11.png); filter: invert(1); margin-right: 10px;}

@media all and (max-width: 1300px) {
    #botox .con03 .img_list li {width: calc(50% - 15px);}
}

@media all and (max-width: 767px) {
    #botox .con03 .img_list li {width: 100%; max-width: 660px;}
}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * lifting con03 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
#lifting .con03 .note {margin-top: 80px;}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * laser common *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
#laser .title_list ul li p {font-size: var(--fz-20); line-height: 1.5em; color: #666;}

/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * laser con03 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
#laser .con03 .arch_list {display: flex; gap: 40px; justify-content: center; margin-top: 50px;}
#laser .con03 .arch_list li {width: calc(33.3333% - 27px); background-color: #fff; padding: 0px; border-radius: 90px 90px 0 0; box-sizing: border-box; text-align: center; max-width: 180px;}
#laser .con03 .arch_list li .circle {display: flex; align-items: center; justify-content: center; aspect-ratio: 1/1; border-radius: 50%; margin-bottom: 25px; background-color: #f5e0d9; color: #1e2d64;}
#laser .con03 .arch_list li .circle p {font-weight: 500; font-size: var(--fz-18); line-height: 1.55em;}
#laser .con03 .arch_list li .circle.blue {background-color: #1e2d64; color: #fff;}
#laser .con03 .arch_list li .circle.red {background-color: #e96666; color: #fff;}
#laser .con03 .arch_list li h6 {font-weight: 700; font-size: var(--fz-24); color: #333;}
#laser .con03 .arch_list li b {font-weight: 500; font-size: var(--fz-16); line-height: 1.625em; color: #1e2d64; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 2px; display: inline-block; margin-top: 15px;}
#laser .con03 .arch_list li > p {font-size: var(--fz-16); line-height: 1.625em; color: #666; margin-top: 15px;}

@media all and (max-width: 1400px) {
    #laser .con03 .arch_list li {padding: 20px;}
}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * nose con01 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
:is(.nose, .volume) .con01 .img_list .img_box {height: 400px;}
:is(.nose, .volume) .con01 .img_list .txt_box {height: calc(100% - 410px);}
:is(.nose, .volume) .con01 .img_list .txt_box p {font-size: var(--fz-16);}
:is(.nose, .volume) .con01 .img_list.type01 li i.arrow {top: 200px;}

@media all and (max-width: 1024px) {
    :is(.nose, .volume) .con01 .img_list.type01 li {width: calc(33.333% - 20px);}
    :is(.nose, .volume) .con01 .img_list.type01 li i.arrow {width: 70px;}
    :is(.nose, .volume) .con01 .img_list .txt_box {padding: 20px;}
}

@media all and (max-width: 767px) {
    :is(.nose, .volume) .con01 .img_list.type01 li {width: 100%;}
    :is(.nose, .volume) .con01 .img_list.type01 li i.arrow {top: calc(100% + 15px); right: 50%; transform: translate(50%, -50%) rotate(90deg);}
}


/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * nose con05 *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.nose .con05 .note {margin-top: 80px;}




/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

 * youtube *
    
ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/


.youtube-container {
    display: flex;
    justify-content: center; /* 데스크탑에서 가운데 정렬 */
}

.youtube-video {
    max-width: 100%; /* 비디오 컨테이너 최대 너비 */
}

.video-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 비디오의 16:9 비율 */
    overflow: hidden;
}

.video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* 데스크탑에서 크기 및 가운데 정렬 조정 */
@media only screen and (min-width: 768px) {
    .youtube-video {
        max-width: 800px; /* 데스크탑에서 크게 보이도록 설정 */
    }
}

/* 모바일에서 크기 조정 */
@media only screen and (max-width: 767px) {
    .youtube-video {
        max-width: 100%; /* 화면 너비에 맞춤 */
    }
}