@charset "utf-8";

#pageCont{padding-bottom: 120px;}

.s_visual { position:relative;width:100%; margin: 0 auto; height:760px; line-height:1.4; box-sizing:border-box;overflow:hidden; background:no-repeat center center; background-size:cover;color: #fff; }
.s_visual .inner{height: 100%;}
.s_visual .s_visual_in { position:relative; display:table; width:100%; height:105%;  z-index:2; margin: 0 auto;}
.s_visual .sv_tit { display:table-cell; box-sizing:border-box; color:#fff; vertical-align:bottom; text-align: left; padding-bottom: 175px;}
.s_visual .sv_tit h3{font-size: 70px; font-weight: 300; line-height: 1.1em; font-family: 'GmarketSans';}
.s_visual .sv_tit h3 b{font-weight: 500;}
.s_visual .sv_tit .eng {margin:1.3em 0 3em; font-family: 'Marcellus', serif; letter-spacing:0.2em; font-sizE:1.6rem; text-transform:uppercase; }
.s_visual .sv_tit h4 { font-size:3.0rem; font-weight:700; }

.s_visual .btn_area{margin-top: 1%;}
.s_visual .btn_area > div{display: inline-block;}
.s_visual .btn_area > div > a{display: inline-block; margin-right: 5px; width: 130px; line-height: 40px; text-align: center;  background-color: #645894; color: #fff; font-size: 1.8rem;}

.share_area{display: none; position: fixed; left: 50%; top: 30%; transform: translateX(-50%); z-index: 999; box-shadow: 2px 10px 14px rgba(0, 0, 0, 0.12);}
.share_area.on{display: block !important;}
.share_area .in{position: relative; width:380px; height: auto; background-color: #fff;}
.share_area .in .tit{padding:5% 10%; text-align: center;}
.share_area .in .tit p{font-size: 1.8rem; font-weight: 700; color: #222;}
.share_area .in .tit button{position: absolute; right: 10px; top:10px;}
.share_area .in .tit button span{}
.share_area .in .cont {padding:2% 15% 15%; }
.share_area .in .cont .sns_btn{display: flex; justify-content: space-between;}
.share_area .in .cont img{width: 45px;}
.share_area .in .cont p{margin-top: 5px; text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 1em; color: #666;}
.share_area .in .cont .url_copy{padding: 7% 0 0; display: flex;}
.share_area .in .cont .url_copy input{padding:0 1em ; width: 80%; line-height: 40px; border:1px solid #ddd; border-radius: 5px 0 0 5px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.share_area .in .cont .url_copy button{background: #eee; padding: 0 0.5em; line-height: 40px; border-radius: 0 5px 5px 0; flex: 0 0 20%; white-space: nowrap; font-size: 1.3rem; border:1px solid #ddd; border-left: 0;}

@media all and (max-width:1280px){
	.s_visual{height: 60vw; min-height: 320px;}
	.s_visual .sv_tit{padding-bottom: 140px;}
	.s_visual .sv_tit h3{font-size: 56px; line-height: 1.4em;}
	.s_visual .sv_tit h4{font-size: 28px;}
	#pageCont{padding-bottom: 100px;}
}
@media all and (max-width:976px){
	.s_visual .sv_tit{padding-bottom: 50px;}
	.s_visual .sv_tit h3{font-size: 44px;}
	.s_visual .sv_tit h4{font-size: 24px; margin-top: 18px;}
	#pageCont{padding-bottom: 70px;}
}
@media all and (max-width:767px){
	.s_visual .sv_tit{padding-bottom: unset; text-align:center; vertical-align:middle;}
	.s_visual .sv_tit h3{font-size: 36px;}
	.s_visual .sv_tit h4{font-size: 20px;}

    .share_area{top: 10%;}
    .share_area .in{ width: 75vw; height: auto;}
    .share_area .in .tit p{font-size: 1.5rem;}
}
@media all and (max-width:480px){
	.s_visual .sv_tit h3{font-size: 32px;}
	.s_visual .sv_tit h4{font-size: 18px;}

    .s_visual .btn_area div > a{font-size: 1.4rem; width: 80px; line-height: 34px;}
}


.s_visual2 { position:relative;width:100%;  /*height:760px;*/ margin: 0 auto; line-height:1.4; box-sizing:border-box;overflow:hidden; background:no-repeat left center; background-size:cover;color: #fff; }
.s_visual2 .mo{display: none;}
.s_visual2 img{width: 100%;}
.s_visual2 .inner{height: 100%;}
.s_visual2 .s_visual2_in { position:relative; display:table; width:100%; height:105%;  z-index:2; margin: 0 auto;}
.s_visual2 .sv_tit { display:table-cell; box-sizing:border-box; color:#fff; vertical-align:bottom; text-align: left; padding-bottom: 175px;}
.s_visual2 .sv_tit h3{font-size: 70px; font-weight: 300; line-height: 1.1em; font-family: 'GmarketSans';}
.s_visual2 .sv_tit h3 b{font-weight: 500;}
.s_visual2 .sv_tit .eng {margin:1.3em 0 3em; font-family: 'Marcellus', serif; letter-spacing:0.2em; font-sizE:1.6rem; text-transform:uppercase; }
.s_visual2 .sv_tit h4 { font-size:3.0rem; font-weight:700; }

.s_visual2.lifting2{background-image: url('/petit/images/sub/s_visual_lifting2.jpg');}

@media all and (max-width:1280px){
	/* .s_visual2{height: 60vw; min-height: 320px;} */
	.s_visual2 .sv_tit{padding-bottom: 140px;}
	.s_visual2 .sv_tit h3{font-size: 56px; line-height: 1.4em;}
	.s_visual2 .sv_tit h4{font-size: 28px;}
	#pageCont{padding-bottom: 100px;}
}
@media all and (max-width:976px){
    .s_visual2 .mo{display: block;}
    .s_visual2 .pc{display: none;}


	.s_visual2 .sv_tit{padding-bottom: 50px;}
	.s_visual2 .sv_tit h3{font-size: 44px;}
	.s_visual2 .sv_tit h4{font-size: 24px; margin-top: 18px;}
	#pageCont{padding-bottom: 70px;}

    .s_visual2.lifting2{background-position:center center; background-image: url('/petit/images/sub/s_visual_mo_lifting2.jpg');}

}
@media all and (max-width:767px){
	.s_visual2 .sv_tit{padding-bottom: unset; text-align:center; vertical-align:middle;}
	.s_visual2 .sv_tit h3{font-size: 36px;}
	.s_visual2 .sv_tit h4{font-size: 20px;}

}
@media all and (max-width:480px){
	.s_visual2 .sv_tit h3{font-size: 32px;}
	.s_visual2 .sv_tit h4{font-size: 18px;}
}











/* Sub-Menu */
.sub_menu_wrap { position:relative;  width:50%; max-width: 1600px; height:80px; line-height:80px; margin-left: auto; padding:0; margin-top: -80px;
    font-weight:400; box-sizing:border-box; z-index:99; background: #fff; border: 0;}
.sub_menu_wrap .m_home{ position:static; display:block; width:80px; height:80px; float:left; background: #fff url("/petit/images/sub/ico_home.png")no-repeat center; border:0;  }
.sub_menu_wrap .m_home a{display: block; width: 100%; height: 100%;}
.sub_menu_wrap .m_dep_box{ position: relative; display:block; width:280px; float:left; text-align:left; cursor:pointer;border-right:0px solid #dedede; font-size: 1.6rem; }
.sub_menu_wrap .m_dep_tit { display:block; background:url('/petit/images/sub/arrow_down.png') no-repeat 88% center; font-weight: 600;  color:#212121; box-sizing:border-box; padding:0 1.5em; cursor:pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.sub_menu_wrap .m_dep_box .smenu { position: absolute; display:none; width:calc(100% + 2px); margin-left:-1px; background:#fffefb; box-sizing:Border-box; border:1px solid #ddd; border-top:0;}
.sub_menu_wrap .m_dep_box .smenu li {margin:0; width:100%; display:block; box-sizing:border-box;  border-top:1px dotted #ddd; padding:0;}
.sub_menu_wrap .m_dep_box .smenu li.none{display: none;}
.sub_menu_wrap .m_dep_box .smenu li:hover{background:#ccc;}
.sub_menu_wrap .m_dep_box .smenu li:hover a { border:0; font-weight:500;}
.sub_menu_wrap .m_dep_box .smenu li a.on{background:#8077b7; color:#fff; border:0; }
.sub_menu_wrap .m_dep_box .smenu li:first-child{border-top:0;}
.sub_menu_wrap .m_dep_box .smenu a { color:#333; display:block; width:100%;  padding:1em 1.5em; box-sizing:border-box; line-height:normal; font-size: 1.6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.sub_menu_wrap .m_dep_box .smenu a br { display: none; }
.sub_menu_wrap .m_2dep_box li:before {display:none;}
.sub_menu_wrap .m_3dep_box li:before {display:none;}

@media all and (max-width:1900px){
	.sub_menu_wrap{min-width: 970px;}
}
@media all and (max-width:1280px){
	.sub_menu_wrap .m_dep_tit{font-size: 17px;}
}
@media all and (max-width: 976px){
	.sub_menu_wrap { height: 70px; line-height: 70px; margin-top: 0; border-bottom: 1px solid #eee; min-width: 0; width: 100%;}
	.sub_menu_wrap .in{display: flex;}
	.sub_menu_wrap .m_home { width:70px; height:70px;   background-size: 100% auto;  border-bottom: 1px solid #eee;}
	.sub_menu_wrap .m_dep_box { width: calc((100% - 70px) / 3);  flex: auto;}
	.sub_menu_wrap .m_2dep_box { border-right:0; }
	.sub_menu_wrap .m_dep_tit{font-size: 16px;}
}

@media all and (max-width: 640px){
	.sub_menu_wrap { width: 100%; height: 60px; line-height: 60px; transform: none;}
	.sub_menu_wrap .m_home { width:60px; height:60px;}
	.sub_menu_wrap .m_dep_box { width: calc((100% - 60px) / 3); font-size: 15px;}
	.sub_menu_wrap .m_dep_tit{font-size: 15px;}
}


@media all and (max-width: 480px){
	.sub_menu_wrap { width: 100%; height: 50px; line-height: 50px;}
	.sub_menu_wrap .m_home { width:50px; height:50px; }
	.sub_menu_wrap .m_dep_box {  width: calc((100% - 50px) / 3); }
	.sub_menu_wrap .m_dep_tit { padding: 0 0.8em; font-size: 1.7rem; background-size: 12px auto; }
	.sub_menu_wrap .m_dep_box .smenu a { padding: 0.8em 1em; }
}



#subTitle{text-align: center; font-size: 40px; font-weight: 700; color: #222; padding: 100px 0 80px;}
#subTitle p{color: #666; font-weight: 400; font-size: 1.7rem; margin-top: 15px; font-weight: 300;}

@media all and (max-width:1280px){
	#subTitle{font-size: 36px; padding: 90px 0 80px;}
}
@media all and (max-width:976px){
	#subTitle{font-size: 30px; padding: 70px 0 60px;}
	#subTitle p{font-size: 16px; margin-top: 6px;}
}
@media all and (max-width:640px){
	#subTitle{font-size: 28px; padding: 60px 0 45px;}
}







/* 페이지 탭메뉴 */
.tabmenu { width: 94%; margin: 0 auto 5%; display:flex; flex-wrap:wrap; justify-content:center; gap:5px}
.tabmenu li a {padding:0.8em 2em; display:inline-block; border: 1px solid #dedede;  color:#686868; font-size:1.8rem; font-weight: 700;  }

/* 페이지 인식을 위한 부분 */
.tab01 .tabmenu  a.menu1,
.tab02 .tabmenu  a.menu2,
.tab03 .tabmenu  a.menu3,
.tab04 .tabmenu  a.menu4,
.tab05 .tabmenu  a.menu5,
.tab06 .tabmenu  a.menu6,
.tab07 .tabmenu  a.menu7,
.tab08 .tabmenu  a.menu8,
.tab09 .tabmenu  a.menu9,
.tab10 .tabmenu  a.menu10 { color:#fff; background:#645894; font-weight:500;  border: 1px solid #645894; z-index:100; }

@media all and (max-width:767px){
	.tabmenu li a {padding:0.5em 1em;  font-size:1.6rem;}
}


/* 페이지 탭메뉴 */
.tab-step2 { width: 94%; margin: 0 auto 5%; display:flex; flex-wrap:wrap; justify-content:center; gap:5px}
.tab-step2 li a {width:102px; line-height:100px; padding:0;  border-radius:100%; text-align:center;  display:inline-block;  color:#686868; font-size:1.8rem; font-weight: 700; background:#f6f2f7 }

/* 페이지 인식을 위한 부분 */
.tab01 .tab-step2  a.menu1,
.tab02 .tab-step2  a.menu2,
.tab03 .tab-step2  a.menu3,
.tab04 .tab-step2  a.menu4,
.tab05 .tab-step2  a.menu5,
.tab06 .tab-step2  a.menu6,
.tab07 .tab-step2  a.menu7,
.tab08 .tab-step2  a.menu8,
.tab09 .tab-step2  a.menu9,
.tab10 .tab-step2  a.menu10 { color:#fff; background:#8B5794; font-weight:500; z-index:100; }







#intro6-icon {margin:4em 0 5%; display:flex; flex-wrap:wrap; justify-content:center; gap: 0 40px}
#intro6-icon a span {padding-left:10px; font-size:1.6rem; font-weight:600; font-family:'Montserrat'; line-height:42px;}
#intro6-icon a:hover span {color:#645894}

@media all and (max-width:767px){
	#intro6-icon { margin:3em 0 5%; gap: 0 20px}
	#intro6-icon a img {height:36px}
	#intro6-icon a span {line-height:36px;}
}
@media all and (max-width:580px){
	#intro6-icon a span { display:none }
}












/* terms */
.terms{margin: 3rem 0; transform: skew(0.1deg); }
.terms h3 {font-size:2.3em; color:#212121;  text-align:center; padding-bottom:30px;}
.terms dl { padding-bottom:3%;}
.terms dl dt {font-size:2.4rem; color:#212121; line-height:2.3em;  color: 000; font-weight: 700;}
.terms dl dd {font-size:1.6rem; padding-left:28px; line-height: 1.8em; color: #666; font-family: 'Noto Sans KR', sans-serif;}
.terms dl dd b{color: #444;}
.terms dl h4{font-size: 1.8rem; color: #444; margin: 0.5em 0;}

@media all and (max-width:999px){
    .terms dl dd{padding-left: 0;}
}




.memberWrap{padding:50px  50px; border:1px solid #ddd}
.memberWrap .mem_tit { font-size:2.3rem; font-weight:700; margin:0 0 30px; color:#222}
.memberWrap p {padding-bottom:3%; font-size: 1.6rem; line-height: 22px;  color:#454545; line-height:1.9em} 
.memberWrap .pro_tit { font-size:1.8rem; font-weight:700; color:#222; padding-bottom:0;}

@media screen and (max-width:976px){
	.memberWrap {padding:3%}
}