/* main-section 공통 */
.main-section .inner{max-width: none; padding: 0;}
.main-section h2{font-family: 'GmarketSansMedium'; font-size: 5rem;}
.main-section h3{font-family: 'GmarketSansMedium';}
.main-section h2 span{color: #0050ff;}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .main-section h2{font-size: 28px;}
}
@media all and (max-width:768px){
    .main-section h2{font-size: 24px;}
}
/* main 메인 */
.ms-visual{background: url(../img/main/main-visual.png?ver1.1) no-repeat center / cover; height: 100vh; color: #fff; padding-top: 16rem; font-size: 2rem;}
.ms-visual ul{display:flex; flex-wrap:wrap; width:100%; height: 100%;}
.ms-visual ul li{width:25%; height:100%; border-right:1px solid #fff; transition: 0.3s;}
.ms-visual ul li:last-child{border-right:0;}
.ms-visual ul li a{color: #fff; height: 100%; padding:0 1.6vw; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center;}
.ms-visual ul li:hover{background:rgba(0, 81, 255, 0.9);}
.ms-visual ul li h3{font-size: 2.8vw; position: relative; padding-bottom: 13rem; margin-bottom: 3rem;}
.ms-visual ul li h3::after { content: ""; display: block; width: 1px; height: 9.8rem; background-color: rgb(240, 241, 242); position: absolute; bottom: 0; left: 0px;}
.ms-visual ul li p{line-height: 1.5; padding-bottom: 7rem;}
.ms-visual .btn-more{border: 1px solid #fff; border-radius: 100px; width: 11rem; height: 4.3rem; display: flex; align-items: center; justify-content: center; transition: 0.3s;}
.ms-visual .btn-more:hover{background-color: #fff; color: #0050ff; font-weight: 500;}
@media all and (max-width:1360px){
    .ms-visual ul li:last-child p br{display: none;}
}
@media all and (max-width:1024px){
    .ms-visual ul li{width: 50%; height: 50%; border-bottom: 1px solid #fff;}
    .ms-visual ul li a{padding: 0 20px;}
    .ms-visual ul li h3{font-size: 30px; padding-bottom: 50px;}
    .ms-visual ul li h3::after{height: 30px;}
    .ms-visual ul li p{padding-bottom: 30px;}
    .ms-visual ul li p br{display: none;}
}
@media all and (max-width:768px){
    .ms-visual{padding-top: 80px; }
    .ms-visual ul li a{padding: 0 10px;}
    .ms-visual ul li h3{font-size: 24px;}
}
@media all and (max-width:500px){
    .ms-visual ul li p{height: 100px;}
}


/* ms01 좋은 이비인후과를 찾는 방법~ */
.ms01{background: url(../img/main/ms01-bg.png) no-repeat center / cover;}
.ms01 .inner{height: 60rem; display: flex; align-items: center; text-align: center; justify-content: center; padding: 0 20px;}
.ms01 h3{font-size: 6rem; color: #fff;}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    
}
@media all and (max-width:768px){
    .ms01 .inner{height: 300px;}
    .ms01 h3{font-size: 26px;}
}


/* ms02 의사 */
.ms02{padding-top: 7.5rem; }
.ms02 .inner{padding: 0 20px; max-width: 1530px;}
.ms02 .top{border-bottom: 2px solid #000;}
.ms02 ul{display: flex; justify-content: center; align-items: flex-end;}
.ms02 ul li{text-align: center; flex: 1;}
.ms02 ul li .imgbox{}
.ms02 ul li .imgbox img{width: 100%;}
.ms02 ul li h2{}
.ms02 ul li h2 b{font-size: 3rem;}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    
}
@media all and (max-width:768px){
    .ms02 ul li h2{}
    .ms02 ul li h2 b{font-size: 16px;}
}


/* ms03 */
.ms03{padding: 34.5rem 0;}
.ms03 .inner{}
.ms03 .cont{display: flex; align-items: center; flex-wrap: wrap;}
.ms03 .cont:nth-child(1){flex-direction: row-reverse;}
.ms03 .cont > div{width: 50%;}
.ms03 .cont .txtbox{padding: 2rem 20px 0 4.2vw;}
.ms03 .cont:nth-child(1) .txtbox{padding: 2rem 4.2vw 0 20px;}
.ms03 .cont .txtbox h2{padding-bottom: 6rem; font-size: 2.7vw;}
.ms03 .cont:nth-child(1) h2{text-align: right;}
.ms03 .cont .txtbox h2 span{}
.ms03 .cont .txtbox ul{flex-wrap: wrap; display: flex; gap: 4rem;}
.ms03 .cont:nth-child(1) ul{justify-content: flex-end;}
.ms03 .cont .txtbox ul li{flex: 1; max-width: 23rem; padding-top: 2rem; border-top: 1px solid #000;}
.ms03 .cont .imgbox{}
.ms03 .cont .imgbox img{width: 100%;}
@media all and (max-width:1600px){
    .ms03 .cont .txtbox,
    .ms03 .cont:nth-child(1) .txtbox{padding: 20px;}
    .ms03 .cont .txtbox{padding-bottom: 0;}
    .ms03 .cont .txtbox ul{gap: 20px;}
}
@media all and (max-width:1200px){
    .ms03 .cont .txtbox h2{font-size: 28px;}
    
}
@media all and (max-width:1024px){
    .ms03{padding: 60px 0;}
    .ms03 .cont > div{width: 100%;}
    .ms03 .cont .txtbox h2{padding-bottom: 30px; font-size: 24px;}
    .ms03 .cont:nth-child(1) h2{text-align: left;}
    .ms03 .cont ul,
    .ms03 .cont:nth-child(1) ul{justify-content: space-between;}
    .ms03 .cont .txtbox ul li{max-width: none;}

}
@media all and (max-width:768px){
    .ms03 .cont .txtbox ul{gap: 20px;}
    .ms03 .cont .txtbox ul li{width: calc((100% - 20px) / 2); flex: none; font-size: 16px;}
    
}


/* ms04 */
.ms04{}
.ms04 .inner{display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.ms04 .imgbox{width: 45%;}
.ms04 .imgbox img{width: 100%;}
.ms04 h2{width: 53%; max-width: 950px;}
@media all and (max-width:1200px){
    
}
@media all and (max-width:1024px){
    .ms04 .imgbox,
    .ms04 h2{width: 100%; max-width: none;}
    .ms04 h2{padding: 20px; padding-bottom: 0;}
}
@media all and (max-width:768px){
    
}


/* ms05 둘러보기 */
.ms05{padding: 35rem 0 30rem 0; max-width: 1630px; margin-left: auto; }
.ms05 .ms05-inner{display: flex; align-items: center;}
.ms05 .txtbox{position: absolute; z-index: 2; left: 20px;}
.ms05 .txtbox h2{}
.ms05 .txtbox .ms05-paging{display: flex; align-items: center; gap: 20px; }
.ms05 .txtbox .ms05-paging > *{cursor: pointer; }
.ms05 .sw-ms05{margin-left: 23rem; overflow: hidden; }
.ms05 .sw-ms05 ul{}
.ms05 .sw-ms05 ul li{}
.ms05 .sw-ms05 ul li .imgbox{width: 100%;}
.ms05 .sw-ms05 ul li .imgbox img{width: 100%; height: 100%; object-fit: cover;}
@media all and (max-width:1600px){
    
}
@media all and (max-width:1024px){
    .ms05{padding: 60px 0;}
    .ms05 .ms05-inner{padding: 0 20px; padding-right: 0; flex-wrap:wrap;}
    .ms05 .txtbox{left: 0; position: relative; width: 100%; margin-bottom: 20px; }
    .ms05 .sw-ms05{margin: 0; width: 100%; }
    .ms05 .txtbox .ms05-paging{justify-content: flex-end; position: absolute; right: 20px; bottom: 0; z-index: 1;}
}
@media all and (max-width:768px){
    .ms05 .txtbox{}
}
