@charset "utf-8";

@media (max-width: 1360px) {

}
@media (max-width: 1200px) {
    /*header*/
    #header {position: relative;transition: 0.2s all ease;box-shadow: 1px 1px 8px 1px rgba(0, 0, 0, 0.2);}
    #header .header-inner {height: 80px;}
    #header .header-inner .sitelogo {width: 120px;top: 27px;}
    #header .header-inner .menu {display: none;}
    #header .header-inner .btn-m-menu {display: block;}
    #header .header-inner .btn-m-menu span {position: absolute;left: 0;top: 10px;height: 2px;width: 27px;background: #242424;}
    #header .header-inner .btn-m-menu span:after, #header .header-inner .btn-m-menu span:before {content: "";position: absolute;right: 0;width: 27px;background: #242424;height: 2px;transition-duration: 0.3s, 0.3s;transition-delay: 0.3s, 0s;bottom: -10px;transition-property: bottom, transform;}
    #header .header-inner .btn-m-menu span:before {top: -10px;transition-property: top, transform;}
    #header .header-inner .btn-m-menu span:after {bottom: -10px;transition-property: bottom, transform;}

    .intro .content .intro-box .icon-box .list, .branch .content .branch-box .icon-box .list  {width: 10vw;height: 10vw;font-size: 0.9rem;}
    .intro .content .intro-box .icon-box span, .branch .content .branch-box .icon-box span {font-size: 1rem;}
    .review .content .review-box {display: grid; grid-template-columns: 1fr 1fr;}

    .contact {padding:80px 0;}
    .contact .content {flex-direction: column;}
    .contact .content h3, .contact .content p {text-align: center;}
    .contact .content h3:after {transform: translateX(-50%); left:50%;}
    .contact .content .text-box {padding-bottom: 36px;}
    .footer {padding: 30px 0 50px;}
    .footer-inner {flex-direction: column; }
    .footer-inner .address {margin:16px 0 0 0;}


    /*둘러보기*/
    .modal_content {width:80%}

    /*마더링소개*/
    .present-content ul {gap: 2rem 1rem;}
    .present-content ul li i {margin-top: 48%;}

    /*서비스안내*/
    .service .content-group {width: 100%; margin: 0 auto; grid-template-columns: 1fr 1fr; gap: 1.2rem;}

}
@media (max-width: 1000px){
    .main-visual {height: 690px;}
    .visual-copy h3 {font-size: 3.2rem;line-height: 68px;}
    .intro .content .intro-imgBox, .branch .content .branch-imgBox {width: 50%;}
    .intro .content .intro-box p, .branch .content .branch-box p {font-size: 1rem;}
    .branch:after {font-size:9rem;}
    .branch .content .branch-box p {margin: 32px 0 40px;}
    .intro .content .intro-box .icon-box, .branch .content .branch-box .icon-box {display:block;}
    .intro .content .intro-box .icon-box .list img, .branch .content .branch-box .icon-box .list img {display:none;}
    .intro .content .intro-box .icon-box .list, .branch .content .branch-box .icon-box .list {width:49%; height:60px; margin-bottom:0.2rem;}
    .partners-group .content {overflow: hidden; box-sizing: border-box;}
    .partners-group .content .swiper-slide img {max-width: 100%;}
    .sub-visual {display: flex;align-items: center;justify-content: center;}


    /*오시는 길*/
    .location-top {flex-direction: column; gap:60px;}
    .location-top li {padding-right: 50px; padding-left: 70px;}
    .location-top li strong {font-size: 1.2rem;}
    .location-top li::before {width:50px;height: 50px;}

    /*마더링소개*/
    .cont-area {grid-template-columns: 1fr; margin:0 0 80px 0;}
    .cont-area img {width: 100%;}
    .cont-area .box {padding:30px; margin-left:0;}
    .present-content ul li h4 {font-size: 1.3rem;}
    .present-content ul li i {margin-top: 30%; font-size: 1rem; line-height: 1.4rem;}
}


@media (max-width: 768px) {
    #header .header-inner {height: 60px;}
    #header .header-inner .sitelogo {width: 100px;top: 20px;}
    .visual-copy {top:46%;}
    .visual-copy h3 {font-size: 2.8rem;line-height: 60px;}
    .intro, .branch, .review {padding: 120px 30px;}
    .intro .content {display:block;}
    .intro .content .intro-imgBox, .branch .content .branch-imgBox {width: 100%;}
    .intro .content .intro-box, .branch .content .branch-box {width: 100%; top:0;}
    .intro .content .intro-box h3, .branch .content .branch-box h3 {text-align: center; padding:30px 0; font-size: 2rem;}
    .intro .content .intro-box h3:after, .branch .content .branch-box h3:after {transform: translateX(-50%); left:50%;}
    .intro .content .intro-box h4 {text-align:center;}
    .branch:after {display:none;}
    .branch .content {flex-direction: column; gap:0;}
    .branch .content .branch-imgBox {order:1}
    .branch .content .branch-box {order:2;}
    .branch .content .branch-box p {text-align: left;}
    .review .content .review-box {grid-template-columns: 1fr;}

    .contact .content .text-box p {line-height: 1.8rem;}
    .contact .content ul li {padding:1rem; font-size: 1.3rem; line-height: 1.8rem;}
    .quick-menu {bottom:24px; right:24px;}
    .floating-btn {padding:12px;}
    .floating-btn.btn-blog {display:block; width:40px!important; height:40px!important;}
    .floating-btn.btn-blog .ic-blog {display:block; width:40px ; height:40px; background: url(../images/ic-blog.png) -10px -10px no-repeat; background-size: 60px 60px;}
    .floating-btn .ic-phone {background: url(../images/btn-phone.png) -11px -11px no-repeat; background-size: 60px 60px}
    .floating-btn .btn-text {display: none;}
    .footer {padding: 30px 0 60px;}
    .footer-inner .policy-area {position: relative; top:20px; right:0;}
    .footer-inner ul {justify-content: flex-start; gap:30px;}

    .sub-visual {height:230px;}
    .sub-visual .context h2 { font-size: 2rem;}
    .lnb {margin-top: -50px}
    .lnb .lnb-inner ul {justify-content: flex-start;}
    .lnb .lnb-inner ul li {padding: 0;}
    .lnb .lnb-inner ul li a {min-height: 50px; padding:0;}

    /*시설현황*/
    .facilities .tg th {display:none;}
    .facilities .tg td:before {content: attr(data-label);float: left;}
    .facilities .tg td {display: grid; grid-template-columns: 2fr 6fr;width: 100%; box-sizing: border-box; border-right:0; border-left:0; padding: 12px 8px;}
    .facilities .tg td {gap:20px; text-align: left;}
    .room .tg {width:100%;}
    .room .tg colgroup {width:100%;}
    .room .tg tr {border-bottom: 1px solid #333;}
    .room .tg th,.room .tg td {display: grid; grid-template-columns: 2fr 6fr; width: 100%; box-sizing: border-box; border-right:0; border-left:0; padding: 12px 8px;}
    .room .tg th {display: none;}
    .room .tg td:first-child {width: 100%}
    .room .tg td:before {content: attr(data-label);float: left;}
    .room .tg td {gap:20px; text-align: left;}

    /*공지사항*/
    .notice th {display: none;}
    .notice th:nth-child(1),.notice th:nth-child(3),
    .notice td:nth-child(1), .notice td:nth-child(3) {display: none;}
    .notice td {display:inline-block; text-align:left;}
    .notice td:nth-child(2) {width:100%; border-bottom:none; border-left:none; box-sizing: border-box; border-right:0; padding:1rem;}
    .notice td:nth-child(4) {width:100%; box-sizing: border-box; border-left:none; font-size: 1rem; padding:0  1rem 1rem 1rem; color:#7d7474;}

    /*오시는 길*/
    .location-top .right ol {gap:50px;}

    /*마더링소개*/
    .present-content ul {grid-template-columns:1fr 1fr;}

    /*입소안내*/
    .enter-list li {width:48%; margin-bottom:4%;}
    .admission .content-group .nowrap.tg th, .admission .content-group .nowrap.tg td {font-size: 1.125rem; white-space: nowrap; padding:12px 6px;}
    .admission .content-group .overflow {overflow:scroll;}
    .admission .tg tr {border-bottom: 1px solid #606060;}
    .admission .tg tr:nth-child(3),
    .admission .tg tr:nth-child(6),
    .admission .tg tr:nth-child(9){border-bottom: 3px solid #333;}
    .admission .tg th {display: none;}
    .admission .tg td {display: flex; justify-content: space-between;width: 100%; box-sizing: border-box; border-right:0; border-left:0; padding: 12px 8px;}
    .admission .tg td:before {content: attr(data-label);float: left;}
    .admission .tg tr td.display-none {display: flex;}
}

@media (max-width: 480px) {
    #header .header-inner .sitelogo {left:20px;}
    #header .header-inner .btn-m-menu {right: 20px;}
    .visual-copy h3 {width: 100%; line-height: 3.2rem; font-size: 2.2rem;}
    .visual-copy p {width: 100%;font-size:1.4rem;line-height:2rem;}
    .intro, .branch, .review {padding: 60px 30px;}
    .review .content h3, .contact .content h3 {font-size: 2rem;line-height: 3.2rem; text-align: center;}
    .contact .content .text-box {padding-bottom: 8px;}
    .contact .content ul {margin-top: 20px;}
    .contact .content ul li {gap:0; font-size: 1.2rem; display: block;}
    .contact .content p {text-align: left;}
    .contact .content ul li {padding:0;}
    .partners-group {padding:20px;}

    #contents {padding:60px 20px;}
    .footer {padding: 30px 20px;}
    .footer-inner {display:block; padding:0 0 30px 0;}
    .footer-inner .hsm-logo {width:130px;}
    .footer-inner .address {margin-left:0;}
    .footer-inner span, .footer-inner p {margin:2px 0; font-size:.9rem;}
    .footer-inner p.info {display: block; }
    .footer-inner .policy-area {position: relative;}
    .footer-inner span {margin-right:16px; line-height: 1.5rem;}
    .lnb .lnb-inner {width:110%;}
    .lnb .lnb-inner ul li a {padding:0; font-size: 1rem;}

    /*둘러보기*/
    .gallery ul,.service .content-group {grid-template-columns: 1fr;gap: 0.6rem;}
    .present-content ul li h4 {font-size: 1.1rem;}
    .present-content ul li i {margin-top: 30%;font-size: 1rem;line-height: 1.3rem;}

    /*오시는 길*/
    .location-top {gap:50px;}
    .location-top .right ol {flex-direction: column; gap:40px;}

    /*서비스 안내*/
    .service .content-group article h4 {font-size: 1.4rem;}
}