@charset "utf-8";

:root {
    --point1:#8252b5;
    --point2:#451876;
}

/* set */
body {font-size:16px !important;margin:0;padding:0;font-family: 'Paperlogy', "페이퍼로지", Dotum, "돋움", sans-serif;color:#222;font-weight:500;}
input, select, button{font-family: 'Paperlogy', "페이퍼로지", Dotum, "돋움", sans-serif;}
body *{ box-sizing:border-box;}
a {color: #222;}
::selection {background:#382d70;color:#fff;text-shadow:none;}

#skip{top:0;right:0;position:absolute;width:100%;height:15px;text-align:center}
#skip li a{display:block;left:-10000px;position:absolute;top:0;width:100%;text-align:center;z-index:0;height:1px}
#skip li a:hover, #skip li a:focus, #skip li a:active {background:#363636;position:absolute;top:0px;left:0;z-index:5;color:#fff;width:100%;height:25px;padding:5px 0 0 0}

.blind{display:block;overflow:hidden;position:absolute;top:0;left:-5000px;font-size:1.8em}
.hide{display:none !important;margin:0;padding:0}


.wrap{margin: 0 15px;}

/* 상단 */
header .wrap{position: relative; display: flex; justify-content: space-between; align-items: center; height: 60px;}

/* 로고 */
.logo a::before{content: ''; display: inline-block; width: 37px; height: 35px; margin-right: 6px; background: url('/images/member/common/logo.png') no-repeat; background-size: cover; vertical-align: middle;}
.logo a span{display: inline-block; font-size: 18px; font-weight: 500; vertical-align: middle;}
.logo a strong{display: inline-block; font-size: 18px; font-weight: 700; vertical-align: middle;}

/* 메뉴 */
.head>button{display: block; width: 40px; height: 40px; background: url('/images/member/common/menu.png') no-repeat center; font-size: 0;}
.menu>button{display: block; position: absolute; top: -50px; right: 10px; width: 40px; height: 40px; font-size: 0; background: #fff url('/images/member/common/close.png') no-repeat center;}
.head .menu{display: none; position: absolute; top: 60px; right: -15px; width: calc(100% + 30px); border-top: 1px #f3f3f3 solid; background: #fff; z-index: 9;}
.head .menu.on{display: block;}

.menu ul li a{display: block; position: relative; padding: 20px; border-bottom: 1px #f1f1f1 solid;}
.menu ul li:has(ul)>a::before{content: ''; display: block; position: absolute; top: 19px; right: 20px; width: 20px; height: 20px; background: url('/images/member/common/btn_area.png') no-repeat; background-position: 50% -1px; filter: grayscale(100%);}
.menu ul li.on>a{border: 0; color: var(--point2);}
.menu ul li.on>a::before{filter: grayscale(0%);}
.menu ul li a:hover,.menu ul li a:active{color: var(--point2);}

.menu ul ul{display: none; margin: 0 15px; padding: 15px 30px; background: #fcf9ff; border-radius: 30px;}
.menu ul li.on ul{display: block;}
.menu ul li li a{padding: 6px 0; border:0; font-size: 14px;}

.menu ul li li a .new_win{display: inline-block; width: 12px; height: 10px; background: url('/images/member/common/new_win.png') no-repeat; font-size: 0; vertical-align: middle;}

.head_btn{display: none;}




/* 하단 */
footer{padding: 40px 0; border-top: 1px #f3f3f3 solid;}
.f_logo{margin-bottom: 20px;}
.f_logo a::before{content: ''; display: inline-block; width: 52px; height: 50px; margin-right: 10px; background: url('/images/member/common/logo.png') no-repeat; vertical-align: middle;}
.f_logo a span{display: inline-block; font-size: 24px; font-weight: 600; vertical-align: middle;}
.f_info div{margin: 0 10px 20px;}
.f_info div strong{display: block; margin: 4px 0; font-size: 14px; font-weight: 700; color: var(--point2);}
.f_info div span{display: block; font-size: 14px; word-break: keep-all;}
.f_info div .copy{margin-top: 10px; font-size: 13px; color: #999;}

.f_sitemore{position: relative; margin: 0 10px;}
.f_sitemore>button{display: block; position: relative; width: 270px; height: 50px; padding: 0 30px; margin: 5px 0; border: 1px var(--point1) solid; border-radius: 30px; color: var(--point1); font-size: 17px; text-align: left; background: #fff; font-weight: 500;}
.f_sitemore>button::before{content: ''; display: block; width: 20px; height: 20px; position: absolute; top: 14px; right: 30px; background: url('/images/member/common/btn_area.png') no-repeat; background-position: 0 -1px;}
.f_sitemore .site_box{display: none; position: absolute; left: 0; width: 270px; padding: 20px 10px; border-radius: 20px; background: #f6f6f6; text-align: center; }
.f_sitemore .site_box.on{display: block;}
.f_sitemore .site_box.site_box1{bottom: 105px;}
.f_sitemore .site_box.site_box2{bottom: 50px;}
.f_sitemore .site_box .site_list{height: 240px; overflow-y: auto;}
.f_sitemore .site_box .site_list ul{margin: 0 10px;}
.f_sitemore .site_box .site_list ul li{margin: 6px 0;}
.f_sitemore .site_box .site_list ul li a{display: block; padding: 8px 4px; font-size: 14px; background: #fff; border-radius: 10px; border: 1px #fff solid;}
.f_sitemore .site_box .site_list ul li a:hover{border: 1px var(--point2) solid;}
.f_sitemore .site_box button{display: inline-block; position: absolute; bottom: 10px; right: 10px; width: 40px; height: 40px; margin: 0 auto; font-size: 0; background: #fff url('/images/member/common/close.png') no-repeat center; background-size: 10px; border: 1px var(--point1) solid; border-radius: 50%;}

.f_sitemore .site_box .site_list::-webkit-scrollbar {width:5px;height:5px;} 
.f_sitemore .site_box .site_list::-webkit-scrollbar-track {border-radius:5px;background:#f4f4f4;} 
.f_sitemore .site_box .site_list::-webkit-scrollbar-thumb {background: var(--point1);border-radius: 10rem;} 


/* 서브페이지 */
.sub_top{position: relative; padding: 40px 0; border-top: 1px #f3f3f3 solid; border-bottom: 1px #f3f3f3 solid; overflow: hidden;}
.sub_top::before{content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 300px; background: url('/images/member/common/sub_bg.png') no-repeat left top; opacity: 0.8; z-index: -1;}
.s_location{display: flex; flex-direction: column; gap: 20px;}
.s_title h2{margin-bottom: 5px; font-size: 20px;}
.s_title h3{font-size: 34px; font-weight: 800; font-family: 'Hakgyoansim Allimjang'; color: var(--point2);}
.s_utill ul{display: inline-flex; flex-wrap: wrap; gap: 2px 10px; margin: 3px 0; padding: 10px 14px; background: #fff; border-radius: 50px;}
.s_utill ul li a{display: block; font-size: 14px;}
.s_utill ul li a::after{content: '';display: inline-block; width: 7px;height: 17px; margin-left: 10px; background: url('/images/member/common/sub_ico.png') no-repeat;background-position: 50% -50px; vertical-align: bottom;}
.s_utill ul li:last-of-type a:after{display: none;}
.s_utill button{display: inline-block; width: 40px; height: 40px; margin: 3px 0;  border-radius: 50%; border: 1px #f3f3f3 solid;  background: #fff url('/images/member/common/sub_ico.png') no-repeat; font-size: 0;}
.s_utill button.link{background-position: 50% -106px;}
.s_utill button.print{background-position: 50% -72px;}
.s_info{display: none;}

/* 서브 2차 탭메뉴 */
.s_menu{border-bottom: 1px #f3f3f3 solid;}
.s_menu ul{display: flex; gap: 0; flex-wrap: wrap;}
.s_menu ul li a{position: relative; display: block; padding: 16px 12px; font-size: 15px;}
.s_menu ul li.on a,.s_menu ul li a:hover{color: var(--point1); }
.s_menu ul li.on a::after{content: ''; display: block; position: absolute; bottom: 0; right: 0; width: 100%; height: 2px; background: var(--point1);}
.s_menu ul li a .new_win{display: inline-block; width: 12px; height: 10px; background: url('/images/member/common/new_win.png') no-repeat; font-size: 0; vertical-align: middle;}

.s_con{margin: 40px 0;}

@media all and (min-width:768px) {

.head{display: flex; flex-direction: row-reverse; gap: 0 10px;}

.head_btn{display: block;}

.allmenu{display: none;}


/* 사이트모아보기 */
.sitemore>button{display: inline-block; width: 165px; height: 40px; padding: 0 20px; border: 1px var(--point2) solid; border-radius: 10px; color: var(--point2); font-size: 15px; text-align: left; background: #fff url('/images/member/common/btn_area.png') no-repeat; background-position: 87% -22px;}
.sitemore .site_box{display: none;position: absolute;top: 50px;right: 50px;width: 100%;max-width: 680px;padding: 20px 40px;border-radius: 30px;background: #fcf9ff;text-align: center;z-index: 1;}
.sitemore .site_box.on{display:block;}
.sitemore .site_box .site_list{display:flex;gap: 10px;margin: 20px 0;padding: 0 0 20px;border-bottom: 1px dashed #ede9f1;}
.sitemore .site_box .site_list h3{flex-shrink: 0;flex-basis: 100px;font-size: 18px;margin-top: 7px;text-align: left;}
.sitemore .site_box .site_list ul{flex-grow: 1;display:flex;flex-wrap: wrap;gap: 10px;}
.sitemore .site_box .site_list ul li{}
.sitemore .site_box .site_list ul li a{display: block;padding: 8px 12px;font-size: 14px;background: #fff;border-radius: 10px;border: 1px #fff solid;}
.sitemore .site_box .site_list ul li a:hover{border: 1px var(--point2) solid;}
.sitemore .site_box button{display: inline-block; position: absolute; bottom: -20px; right: 0; left: 0; width: 40px; height: 40px; margin: 0 auto; font-size: 0; background: #fff url('/images/member/common/close.png') no-repeat center; background-size: 10px; border: 1px var(--point2) solid; border-radius: 50%;}

.sitemore .site_box .site_list::-webkit-scrollbar {width:5px;height:5px;} 
.sitemore .site_box .site_list::-webkit-scrollbar-track {border-radius:5px;background:#f4f4f4;} 
.sitemore .site_box .site_list::-webkit-scrollbar-thumb {background: var(--point2);border-radius: 10rem;} 

/* 하단 */
.f_info div strong{display: inline-block; vertical-align: middle;}
.f_info div span{display: inline-block; margin: 0 10px; vertical-align: middle;}

/* 서브페이지 */
.s_title h2{margin-bottom: 12px; font-size: 24px;}
.s_title h3{font-size: 50px;} /*원래 50*/

.s_menu ul{max-width: 820px; margin: 0 auto;}
.s_menu ul li a{padding: 30px 24px; font-size: 18px; }
.s_menu ul li.on a{font-weight: 600;}
} 

@media all and (min-width:1023px) {

.wrap{max-width: 820px; margin: 0 auto;}
}

@media all and (min-width:1440px) {

.wrap{max-width: 100%; margin: 0 5%;}
header .wrap{position: relative; height: 120px;}

.head{flex-direction: row; justify-content: space-between; align-items: center; gap: 0; width: 75%;}

.logo a::before{width: 52px; height: 50px; margin-right: 10px; background-size: auto;}
.logo a span{font-size: 24px;}
.logo a strong{font-size: 24px;}

.head .menu{display: block; position: static; border: 0; width: 70%;}
.menu>button{display: none;}
.head>button{display: none;}
.menu ul{display: flex; justify-content: space-between;}
.menu ul li{position: relative;}
.menu ul li a{border: 0; font-size: 20px;}
.menu ul li:has(ul)>a::before{display: none;}
.menu ul ul{position: absolute; left: -50%; right: -50%; width: max-content; margin: 0 auto; }
.menu ul li li a{font-size: 16px;}

.head_btn{display: flex; align-items: center; gap: 0 20px;}
.allmenu{display: block;}
.allmenu a{display: block; padding-left: 26px; background: url('/images/member/common/menu.png') no-repeat left center;}
.sitemore .site_box{top: 80px; right: 0;}

/* 하단 */
footer .wrap{display: flex; justify-content: space-between; align-items: center;}
.f_info div{margin: 0 10px;}
.f_info div strong{font-size: 16px;}
.f_info div span{font-size: 16px;}
.f_sitemore{margin: 0;}
.f_sitemore .site_box.site_box1{bottom: 110px;}
.f_sitemore .site_box.site_box2{bottom: 55px;}


/* 서브페이지 */
.sub_top{padding: 80px 0;}
.sub_top .wrap{display: flex; justify-content: space-between; align-items: flex-end;}
.s_location{flex-direction: row; align-items: flex-end;}
.s_info{display: block; text-align: right;}
.s_info .name{margin-bottom: 16px; font-size: 28px; font-family: 'Hakgyoansim Allimjang';  vertical-align: text-bottom;}
.s_info .name strong{display: inline-block; font-size: 46px; vertical-align: text-bottom;}
.s_info .comment{font-size: 16px; color: #777;}
.s_info .comment strong{font-size: 20px; color: #6d6d6d;}

.s_menu ul{width: 1520px; max-width: none;}

.s_con{margin: 50px 0;}
} 


@media all and (min-width:1600px) {

.wrap{margin: 0 auto; width: 1520px;}

.menu ul{gap: 0 1%;}
}