@charset "utf-8";

/* ---------------------------------------------------
POINTWEB.co.kr
Layout Markup ver1.0 2018-10-26
---------------------------------------------------- */

/* 서브 레이이아웃 및 공통 */
#subcontent {position:relative;width:100%}
#content {position:relative;width:100%;background-color:#fff;box-shadow:0 -5px 30px rgba(0,0,0,0.1)}
#content .section {padding:6.429rem 0}
#content .section:before, #content .section:after {display:none}
.border {border:1px solid #e0e0e0}

/* 서브 레이이아웃 및 공통 - 미디어쿼리 */
@media all and (max-width:768px) {
#content .section {padding:5rem 0}
}
@media all and (max-width:414px) {
#content .section {padding:3.5rem 0}
}

	/* 서브비쥬얼 */
.subtop {position:relative;width:100%;height:490px;text-align:center;display:table;background:no-repeat center top;background-attachment:fixed;}
.subtop .layout {display:table-cell}
.subtop .titlebox {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80%;margin-top:40px}
.subtop h2 {margin-bottom:2.143rem;font-size:2.857rem;font-weight:bold;color:#fff}
.subtop .titlebox p {color:#ffffff;padding-top:6rem}

.package .subtop {background-image:url("/_public/images/sub/package.jpg")}
.partner .subtop {background-image:url("/_public/images/sub/partner.jpg")}
.community .subtop {background-image:url("/_public/images/sub/community.jpg")}
.subpage_copy {text-align:center; margin-top:4rem}

	/* 서브비쥬얼 - 미디어쿼리 */
@media all and (max-width:1024px) {
.package .subtop {background-position:80% top}
.partner .subtop {background-position:70% top}
}

	/* 2depth 메뉴 */
.submenu {width:100%;height:40px;border-bottom:1px solid #e0e0e0}
.submenu .layout {text-align:center}
.submenu .smenu_ul {
    display: flex;
    justify-content: center;
}
.submenu .smenu_ul li {
    position: relative;
    margin: 0 30px;
    border-bottom: 0;
    z-index: 1;
    -ms-transition: all 0.3s;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.submenu .smenu_ul li.on,
.submenu .smenu_ul li:hover {
    border-bottom: 1px solid #fa376e;
}
.submenu .smenu_ul li a {
    display: block;
    line-height: 39px;
    font-size: 1.143rem;
    text-align: center;
    color: #717171;
    -ms-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.submenu .smenu_ul li a:hover,
.submenu .smenu_ul li.on a {color:#fa376e;font-weight:500}

	/* 2depth 메뉴 - 미디어쿼리 */
@media all and (max-width:640px) {
.submenu .smenu_ul {
    width: 100%;
}
.submenu .smenu_ul li {
    margin: 0 15px;
}
.submenu .smenu_ul li a {
    width: 100%;
    font-size: 1rem;
}
}

	/* tab 메뉴 */
.tabarea {width:100%;margin-bottom:4.286rem}
.tabarea li {position:relative;width:13%;float:left;margin-right:1.5%}
.tabarea li:last-of-type {margin-right:0}
.tabarea li:before {content:"";display:none;position:absolute;top:2px;left:0;width:100%;height:40px;background-color:#dadada;-ms-transition: all 0.3s;-webkit-transition: all 0.3s;transition: all 0.3s}
.tabarea li:hover:before,
.tabarea li.on:before {display:block}
.tabarea li a {position:relative;width:100%;display:block;font-size:1.143rem;text-align:center;line-height:40px;color:#707070;background-color:#fff;;-ms-transition: all 0.3s;-webkit-transition: all 0.3s;transition: all 0.3s}
.tabarea li a:hover,
.tabarea li.on a {transform:translateY(-5px);font-weight:500;color:#fff;border-color:#fa376e;background-color:#fa376e}

	/* tab 메뉴 - 미디어쿼리 */
@media all and (max-width:1200px) {
    .tabarea li {
        width: 22%;
        margin: 0 1.5% 1.5%;
    }
}
@media all and (max-width:768px) {
    .tabarea {
        margin-bottom: 30px;
    }
    .tabarea li {
        margin: 0 1% 1.5%;
    }
}
@media all and (max-width:640px) {
    .tabarea {
        margin-bottom: 20px;
    }
    .tabarea li {
        width: 31%;
        margin: 0 1% 1%;
        margin-bottom: 1%;
    }
    .tabarea li:before {
        height: 30px;
    }
    .tabarea li a {
        font-size: 1rem;
        line-height: 30px;
    }
    .tabarea li a:hover,
    .tabarea li.on a {}
}

	/* 패키지 공통 리스트 스타일 */
.listarea {
    width: 100%;
}
.listarea ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 0 1%;
}
.listarea .listbox {
    /* float: left;
    width: 24%;
    margin-right: 1%; */
    margin-bottom: 5rem;
}
/* .listarea .listbox:last-of-type,
.listarea .listbox:nth-of-type(4n) {
    margin-right: 0;
} */
.listarea .listbox .listwrap,
.listarea .listbox .listwrap img{width:100%;-ms-transition: all 0.3s;-webkit-transition: all 0.3s;transition: all 0.3s}
.listarea .listbox:hover .listwrap > img {box-shadow:0 5px 5px rgba(0,0,0,0.1)}
.listarea .listbox .textbox {padding:2.143rem 0 1.429rem}
.listarea .listbox .textbox strong {display:block;font-size:1.286rem;font-weight:500;margin-bottom:1rem}
.listarea .listbox .textbox p,
.listarea .package_btn a {
    font-weight: 300;
    color: #6f6f6f;
}
.listarea .package_btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.listarea .package_btn a {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 36px;
    -ms-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.listarea .package_btn a:nth-of-type(2) {border-left:0}
.listarea .package_btn a:hover {border:1px solid #fa376e;color:#fa376e;font-weight:500}
.listarea .package_btn a span {
    display: inline-block;
    width: 20px;
    height: 16px;
    margin-right: 10px;
    vertical-align: middle;
    background: url("/_public/images/sub/package/qna_icon.svg") no-repeat center/auto 100%;
    -ms-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}
.listarea .package_btn a span.call {
    background-image: url("/_public/images/sub/package/call_icon.svg");
}
.listarea .package_btn a span.home {
    background-image: url("/_public/images/sub/package/home_icon.svg");
}
.listarea .package_btn a:hover span {
    background-image: url("/_public/images/sub/package/qna_icon_over.svg");
}
.listarea .package_btn a:hover span.call {
    background-image: url("/_public/images/sub/package/call_icon_over.svg");
}
.listarea .package_btn a:hover span.home {
    background-image: url("/_public/images/sub/package/home_icon_over.svg");
}
	/* 패키지 공통 리스트 스타일 - 미디어쿼리 */
@media all and (max-width:768px) {
    .listarea ul {
        grid-template-columns: repeat(2, 1fr);
    }
    .listarea .listbox {
        margin: 0 0 3rem;
    }
}
@media all and (max-width:640px) {
    .listarea .listbox .textbox {
        padding: 10px 0 20px;
    }
    .listarea .package_btn a {
        line-height: 30px;
        font-size: 13px
    }
    .listarea .listbox .textbox strong {
        font-size: 15px;
        margin-bottom: 0;
    }
    .listarea .package_btn a span {
        margin-right: 3px;
        width: 13px;
        height: 10px;
        margin-top: -4px
    }
    /* .listarea ul {
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 0;
    } */
/* .listarea .listbox {width:97%;} */
}

/* 웨딩패키지 */
.package #content .section:last-of-type {padding-bottom:1.5rem}

/* 웨딩홀 */
.hall #content .section {padding:1.5rem 0 0}
.hall #content .section:first-of-type {padding-top:6.429rem}

/* 참여 및 제휴업체 */
.partner #content .section {padding:1.5rem 0 0}
.partner #content .section:first-of-type {padding-top:6.429rem}

.partner .tabarea li {width:13%;margin-right:1.5%;}
.partner .tabarea li:last-of-type {margin-right:0}

.partner .listarea .listbox {height:450px}
.partner .listarea .listbox .textbox p {line-height:1.3}

/* 참여 및 제휴업체 tab 메뉴 - 미디어쿼리 */
@media all and (max-width:1200px) {
.partner .tabarea li {width:22%;margin:0 1.5% 1.5%}
}
@media all and (max-width:768px) {
.partner .tabarea li {width:48%;margin:0 1% 1.5%}
.partner .listarea .listbox {height:500px}
}
@media all and (max-width:414px) {
    .partner .tabarea li {width:48%;margin:0 1% 1.5%}
    .partner .listarea .listbox {height:auto}
}