.main-tit .tit {
    font-size:46px;
    color:#111;
    font-weight:700;
    line-height:1.087em;
    letter-spacing:-0.011em;
}

.section-badge {
    margin-bottom: 32px;
    font-size: 20px;
    font-weight: 500;
    font-family: var(--font-family2);
}

.section-heading {
    margin-bottom: 12px;
    line-height: 1.45;
    font-size: 48px;
    font-weight: 600;
    font-family: var(--font-family2);
}
 .section-text {
    line-height: 1.45;
    font-size: 22px;
    font-weight: 500;
}

@keyframes fade-in {
    to {
        opacity: 1;
    }
}

@media screen and (max-width: 820px) {
    .section-heading {
        font-size: 24px;
        line-height: 1.3;
    }
    .section-heading br {
        display: none;
    }
    .section-text {
        font-size: 15px;
    }
}

/* ===== MAIN - VISUAL ===== */
#main-contents {
    position: relative;
}
.main-visual {
	position:relative;
    margin:0 auto;
    height:100vh;
}
.main-visual .visual-slider {
    overflow:hidden;
	position:absolute;
	left:50%;
	top:50%;
	width:100%;
	height:100%;
	-webkit-transform:translate(-50%, -50%);
	-moz-transform:translate(-50%, -50%);
	-ms-transform:translate(-50%, -50%);
	-o-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);  
}
.main-visual .visual-slider .swiper-slide {
	overflow:hidden;
    position:relative;
    height:100%;
}
.main-visual .visual-slider .swiper-slide .vs-bg {
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
	-webkit-transform:scale(1.1);
	-moz-transform:scale(1.1);
	-ms-transform:scale(1.1);
	-o-transform:scale(1.1);
	transform:scale(1.1);   
	transition-duration:3s;
}
.main-visual .visual-slider .swiper-slide .vs-txt {
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    margin:0 auto;
    max-width:150em;
    width:90%;
    height:100%;
    z-index:1;
}
.main-visual .visual-slider .swiper-slide .vs-txt h2 {
	opacity:0;
    font-size:60px;
    line-height: 1.2;
    color:#ffffff;
    font-weight:700;
	-webkit-transform:translateY(40px);
	-moz-transform:translateY(40px);
	-ms-transform:translateY(40px);
	-o-transform:translateY(40px);
	transform:translateY(40px);      
    font-family: var(--font-family2);
}
.main-visual .visual-slider .swiper-slide .vs-txt p {
	opacity:0;
    margin-top:1.389em;
    font-size:24px;
    color:#ffffff;
    letter-spacing:-0.028em;
    line-height:1.556em;
	-webkit-transform:translateY(40px);
	-moz-transform:translateY(40px);
	-ms-transform:translateY(40px);
	-o-transform:translateY(40px);
	transform:translateY(40px);   
	font-weight:500;
}
.main-visual .visual-slider .swiper-button-prev {
    position:absolute;
    left:auto;
    right:8.5%;
    top:50%;
    z-index:10;
    margin-top:-95px;
    width:70px;
    height:70px;
    border-radius:50%;
    border:1px solid #fff;
    background:url(../../images/main/vis-arrow-prev.png) no-repeat center;
}
.main-visual .visual-slider .swiper-button-prev:after {
    display:none;
}
.main-visual .visual-slider .swiper-button-next {
    position:absolute;
    right:8.5%;
    top:50%;
    z-index:10;
    margin-top:-15px;
    width:70px;
    height:70px;
    border-radius:50%;
    border:1px solid #fff;
    background:url(../../images/main/vis-arrow-next.png) no-repeat center;
}
.main-visual .visual-slider .swiper-button-next:after {
    display:none;
}
.main-visual .visual-slider .swiper-pagination {
    position:absolute;
    right:8.5%;
    top:50%;
    left:auto;
    bottom:auto;
    z-index:10;
    margin-top:70px;
    width:60px;
    font-size:14px;
    color:#ffffff;
    letter-spacing:0.333em;
    font-style:italic;
    font-weight: bold;
}
.main-visual .visual-slider .swiper-pagination span {
    font-style:normal;
}
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-bg {
	-webkit-transform:scale(1);
	-moz-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
	transform:scale(1);
	-webkit-transition:transform 1.4s;
	-moz-transition:transform 1.4s;
	-ms-transition:transform 1.4s;
	-o-transition:transform 1.4s;
	transition:transform 1.4s;
}
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt h2 {
	opacity:1;
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
	transform:translateY(0);
	-webkit-transition:opacity 1s, transform 1.4s;
	-moz-transition:opacity 1s, transform 1.4s;
	-ms-transition:opacity 1s, transform 1.4s;
	-o-transition:opacity 1s, transform 1.4s;
	transition:opacity 1s, transform 1.4s;		
}
.main-visual .visual-slider .swiper-slide.swiper-slide-active .vs-txt p {
	opacity:1;
	-webkit-transform:translateY(0);
	-moz-transform:translateY(0);
	-ms-transform:translateY(0);
	-o-transform:translateY(0);
	transform:translateY(0);
	-webkit-transition:opacity 1s, transform 1.4s;
	-moz-transition:opacity 1s, transform 1.4s;
	-ms-transition:opacity 1s, transform 1.4s;
	-o-transition:opacity 1s, transform 1.4s;
	transition:opacity 1s, transform 1.4s;	
	-webkit-transition-delay:0.1s;
	-moz-transition-delay:0.1s;
	-ms-transition-delay:0.1s;
	-o-transition-delay:0.1s;
	transition-delay:0.1s;
}

@media screen and (max-width:1200px){
	.main-tit .tit {
		font-size:40px;
	}
    .main-visual .visual-slider .swiper-slide .vs-txt {
        margin:0 5%;
        max-width:60em;
    }
	.main-visual .visual-slider .swiper-slide .vs-txt h2 {
		font-size:48px;
	}
}

@media screen and (max-width:820px){
	body.main {
		font-size:100%;
	}
	.main-tit .tit {
		font-size:32px;
	}
	.main-visual .visual-slider .swiper-slide .vs-txt {
		height:55%;
		justify-content:flex-end; 
	}
	.main-visual .visual-slider .swiper-slide .vs-txt h2 {
	    font-size:30px;
	}
	.main-visual .visual-slider .swiper-slide .vs-txt p {
		font-size:16px;
	}
	.main-visual .visual-slider .swiper-pagination {
		margin:0 -38px 0 0;
		right:50%;
		top:auto;
		bottom:30%;
		width:70px;
		text-align:center;
	}
	.main-visual .visual-slider .swiper-button-prev {
		margin:0 15px 0 0;
		right:50%;
		top:auto;
		bottom:15%;
		width:50px;
		height:50px;
	}
	.main-visual .visual-slider .swiper-button-next {
		margin:0 -65px 0 0;
		right:50%;
		top:auto;
		bottom:15%;
		width:50px;
		height:50px;
	}
}



.mainBusiness {
    overflow: hidden;
    position: relative;
    padding-top: 80px;
    border-radius: 36px 36px 0 0;
    overflow: hidden;
    margin-top: -36px;
    background: #fff;
}

.mainBusiness .section-badge {
    color: var(--clr-dark);
    font-family: var(--font-family2);
}
.mainBusiness .section-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.mainBusiness .section-link {
    display: flex;
    align-items: center;
    line-height: 1;
    color: var(--clr-dark);
    font-weight: 600;
    font-size: 1.5rem;
}
.mainBusiness .section-link .icon {
    margin-left: 6px;
}
.mainBusiness .section {
    position: relative;
    padding: 48px 0;
    opacity: 0;
}
.mainBusiness .section-2,
.mainBusiness .section-3,
.mainBusiness .section-4 {
    margin-top: -220px;
}
.mainBusiness .section .flex {
    display: flex;
    flex-direction: row-reverse;
    margin-right: auto;
    margin-left: auto;
    max-width: 1440px;
    width: 90%;
}
.mainBusiness .section .side {
    width: 41%;
}
.mainBusiness .section .contents {
    padding: 16px 100px 16px 0;
    width: 59%;
}
.mainBusiness .section .badge {
    display: inline-block;
    padding: 0 20px;
    height: 35px;
    line-height: 35px;
    font-size: 16px;
    font-weight: 600;
    background: #e6e6e6;
    border-radius: 35px;
}
.mainBusiness .section .heading {
    /* font-size: 120px; */
    /* font-size: 90px; */
    font-size: 60px;
    font-weight: 500;
    font-family: var(--font-family2);
}
.mainBusiness .section .text {
    margin-top: 18px;
    line-height: 1.65;
    font-size: 19px;
}
.mainBusiness .section .thumbnail {
    overflow: hidden;
    position: relative;
    border-radius: 12px;
}
.mainBusiness .section .thumbnail::before {
    content: "";
    display: block;
    padding-top: calc(420 / 688 * 100%);
    width: 100%;
    height: 0;
}
.mainBusiness .section .thumbnail .image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.mainBusiness .section-1 .heading,
.mainBusiness .section-2 .heading {
    color: var(--clr-dark);
}
.mainBusiness .section-2 {
    background: #f2f4fa;
}
.mainBusiness .section-3 {
    background: var(--mainColor);
    color: #fff;
}

.mainBusiness .section-4 {
    background: #f5f5f5;
    /* color: #fff; */
}

.mainBusiness .section-2 .badge {
    background: #d0d6e3;
}
.mainBusiness .section-3 .badge {
    background: rgba(255, 255, 255, 0.1);
}

@media screen and (max-width:1281px){
    .mainBusiness .section .heading {
        font-size: 40px;
    }

    .mainBusiness .section .text{
        font-size: 16px;
    }
}
@media screen and (max-width:820px) {
    .mainBusiness {
        padding-top: 40px;
        border-radius: 24px 24px 0 0;
    }
    .mainBusiness .section-flex {
        align-items: center;
    }
    .mainBusiness .section-badge {
        margin-bottom: 0;
        font-size: 15px;
    }
    .mainBusiness .section .heading {
        font-size: 26px;
    }
    
    .mainBusiness .section .text{
        font-size: 14px;
    }

    .mainBusiness .section .flex {
        flex-direction: column-reverse;
    }
    .mainBusiness .section .contents {
        width: 100%;
        padding: 0 0 30px;
    }
    .mainBusiness .section .side {
        width: 100%;
    }
    .mainBusiness .section .text {
        margin-top: 10px;
        font-size: 14px;
    }
    .mainBusiness .section .badge {
        font-size: 13px;
        height: 30px;
        line-height: 30px;
        padding: 0 14px;
    }
}


.section-products {
    position: relative;
    padding: 100px 0;
    overflow: hidden;
}
.section-products .bg {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: -1;
    background: #000104;
    display: none;
}
.section-products .bg video {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    object-fit: cover;
    opacity: 0.3;
    z-index: -1;
}
.section-products .shape {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    top: 120px;
    left: 0;
    right: 0;
    margin: auto;
    max-width: 1440px;
    width: 90%;
}
.section-products .shape .item {
    width: 10px;
    height: 10px;
    background: url("../../images/main/products-shape-plus.svg") no-repeat center /
        auto 100%;
}
.section-products .section-pin {
    padding-top: 100px;
}
.section-products .main-product-slider {
    overflow: visible;
}
.section-products .main-product-slider .block {
    display: block;
    padding: 30px;
    height: 100%;
    border-radius: 16px;
    background: rgba(0, 0, 0, 0.05);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    transition-property: background;
    transition-duration: 0.5s;
    transition-timing-function: ease;
}
.section-products .main-product-slider .thumbnail {
    overflow: hidden;
    margin-bottom: 30px;
    position: relative;
    border-radius: 12px;
}
.section-products .main-product-slider .thumbnail::before {
    content: "";
    display: block;
    padding-top: calc(336 / 420 * 100%);
    width: 100%;
    height: 0;
}
.section-products .main-product-slider .thumbnail .image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all ease 0.35s;
}
.section-products .main-product-slider .thumbnail .image.front {
    z-index: 1;
}
.section-products .main-product-slider .category {
    margin-bottom: 8px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.6);
    transition: color ease 0.35s;
    font-size: 1.4rem;
}
.section-products .main-product-slider .title {
    margin: 8px 0 16px;
    font-size: 36px;
    font-weight: bold;
    transition: color ease 0.35s;
}
.section-products .main-product-slider .text {
    font-size: 17px;
    color: rgba(0, 0, 0, 0.6);
    transition: color ease 0.35s;
}
.section-products .main-product-slider .chips {
    display: flex;
    flex-wrap: wrap;
    margin: 24px -8px -8px 0;
}
.section-products .main-product-slider .chip {
    display: inline-flex;
    margin: 0 8px 8px 0;
    padding: 0 16px;
    height: 30px;
    line-height: 26px;
    font-size: 16px;
    color: #fff;
    background: var(--mainColor);
    border: 1px solid var(--mainColor);
    border-radius: 6px;
    transition: background ease 0.35s;
}
.section-products .main-product-slider .swiper-slide {
    width: 38vw;
    max-width: 480px;
    height: auto;
}
.section-products .main-product-slider .swiper-slide:last-child {
    display: flex;
    align-items: center;
    padding-left: 36px;
    width: auto;
    text-align: center;
}
.section-products .main-product-slider .more {
    display: block;
    font-size: 16px;
    font-weight: 600;
}
.section-products .main-product-slider .more .icon {
    margin-bottom: 16px;
    width: 60px;
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    filter: invert(1);
}
.section-products .main-product-slider .more .icon {
    transition: all ease 0.35s;
}
.section-products .main-product-slider .more:hover .icon {
    background: #000;
    filter: invert(0);
}
.section-products .main-product-slider .more:hover .icon:before {
    /* filter: invert(0); */
}
.section-products .main-product-slider .more:hover .text {
    color: #000;
}

@media (hover: hover) and (pointer: fine) {
    .section-cases .list .block:hover .thumbnail .image {
        transform: scale(1.2);
        opacity: 0.7;
    }

    .section-products .main-product-slider .block:hover {
        color: var(--clr-dark);
        background: #ddd;
    }
    .section-products .main-product-slider .block:hover .chip {
        background: #f0f5ff;
        color: var(--mainColor);
    }
    .section-products .main-product-slider .block:hover .category,
    .section-products .main-product-slider .block:hover .text {
        color: inherit;
    }
    .section-products
        .main-product-slider
        .block:hover
        .thumbnail
        .image.front {
        opacity: 0;
    }
}

@media screen and (max-width:820px) {
    .section-products {
        padding: 90px 0 0;
    }
    .section-products .shape {
        top: 20px;
    }
    .section-products .main-product-slider .swiper-slide {
        width: 74vw;
    }
    .section-products .section-pin {
        padding-top: 30px;
    }
    .section-products .main-product-slider .block {
        padding: 20px;
    }
    .section-products .main-product-slider .title {
        font-size: 24px;
        margin: 4px 0 10px;
    }
    .section-products .main-product-slider .text {
        font-size: 14px;
    }
    .section-products .main-product-slider .chip {
        font-size: 14px;
    }
    .section-products .main-product-slider .more .icon {
        width: 50px;
        height: 50px;
        margin-bottom: 10px;
    }

}


/*=======메디람 특수 클리닉=======*/
.company {  z-index: 10; overflow: hidden; }
.company .in {padding: 0 20px; box-sizing: border-box;}
.company .main_tit_box.center { text-align: center; }
.company .cont { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 25px; align-items: flex-end; margin-top: 70px; }
.company .cont .box { display: block; }
.company .cont .box .img_wrap { position: relative; }
.company .cont .box .img_wrap:before { content: ''; position: absolute; right: 0; top: 0; width: 100%; height: 100%; background-color: #fff; z-index: 10; pointer-events: none; transition: width 1.2s; }
.company .cont .box:nth-of-type(1) .img_wrap:before { transition-delay: 0.2s; }
.company .cont .box:nth-of-type(2) .img_wrap:before { transition-delay: 0.4s; }
.company .cont .box:nth-of-type(3) .img_wrap:before { transition-delay: 0.6s; }
.company .cont .box:nth-of-type(4) .img_wrap:before { transition-delay: 0.8s; }
.company.animated .cont .box .img_wrap:before { width: 0; }

.company .cont .box .img_wrap .hover_box { position: absolute; left: 0; bottom: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 80%; background-color: rgba(0,0,0,0.5); z-index: 10; opacity: 0; transition: opacity 0.7s, height 0.7s; }
.company .cont .box .img_wrap .hover_box .ico { width: 50px; height: 50px; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 448 512"><path d="M232 72V64H216v8V248H40 32v16h8H216V440v8h16v-8V264H408h8V248h-8H232V72z"/></svg>')center/cover no-repeat; }
.company .cont .box .img_wrap .hover_box .txt { margin-top: 20px; font-size: 17px; color: #fff; }

.company .cont .box .img_wrap .img { position: relative; width: 100%; padding-top: 150%; }
.company .cont .box .img_wrap .img img { position: absolute; left: 0; bottom: 0; width: 100%; height: 80%; object-fit: cover; object-position: left bottom; transition: height 0.7s; }


.company .cont .box .txt_wrap { margin-top: 50px; min-height: 130px; opacity: 0; transform: translateX(30px); transition: opacity 0.6s, transform 0.6s; }
.company .cont .box:nth-of-type(1) .txt_wrap { transition-delay: 0.3s; }
.company .cont .box:nth-of-type(2) .txt_wrap { transition-delay: 0.5s; }
.company .cont .box:nth-of-type(3) .txt_wrap { transition-delay: 0.7s; }
.company .cont .box:nth-of-type(4) .txt_wrap { transition-delay: 0.9s; }
.company.animated .cont .box .txt_wrap { opacity: 1; transform: unset; }
.company .cont .box .txt_wrap .tit { font-size: 32px; font-weight: 800; }
.company .cont .box .txt_wrap .txt { margin-top: 10px; font-size: 14px; }

.company .main_tit_box .tit { font-family: var(--font-family2); opacity: 0; transform: translateY(30px); transition: opacity 1s, transform 1s; transition-delay: 0.2s; font-size: 48px; font-weight: bold; line-height: 1.3; margin-bottom: 20px; word-break: keep-all;}
.company .main_tit_box .desc { opacity: 0; transform: translateY(30px); transition: opacity 1s, transform 1s; transition-delay: 0.4s }

.company.animated .main_tit_box .tit { opacity: 1; transform: unset; }
.company.animated .main_tit_box .desc { opacity: 1; transform: unset; }


/*----------------호버스타일----------------*/
@media screen and (min-width: 1024px){

    .company .cont .box:hover .img_wrap .img img { height: 100%; }
    .company .cont .box:hover .img_wrap .hover_box { opacity: 1; height: 100%; }


}




@media screen and (max-width:768px) {
      /*메디람 특수 클리닉*/
      .company .cont { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: flex-start; gap: 20px 10px; }
      .company .cont::-webkit-scrollbar { display: none; }
      /*.company .cont .box { min-width: 250px }*/
      .company .cont .box .img_wrap .img { padding-top: 120%; }
      .company .cont .box .img_wrap .img img { height: 100%; }
      .company .cont .box.active .img_wrap .img img { height: 100%; }
      .company .cont .box.active .img_wrap .hover_box { height: 100%; transition: opacity 0.7s; transition-delay: 0.7s; }
  
      .company .cont .box .txt_wrap { margin-top: 12px; }
      .company .cont .box .txt_wrap .tit { font-size: 22px; }
      .company .cont .box .txt_wrap .txt { margin-top: 3px; font-size: 14px; }
  
      .company .main_tit_box .tit { opacity: 1; transform: unset; font-size: 26px; margin-bottom: 10px;}
      .company .main_tit_box .desc { opacity: 1; transform: unset; }
  
      .company .cont .box .img_wrap:before { width: 0; }
}