@charset "utf-8";
:root {
    --bg:#fff;
    --bg2: #dce6ff;
    --bg3:#f6f6f6;
    --bg4:#fefaec;
    --point_red:#f15946;
    --point_yellow: #ffc147;
    --black1:#333333;
    --black2:#070707;
    --black3:#555555;
    --black4:#3b3b3b;
    --black5:#838383;
    --black6:#a9a9a9;
    --line: #ebebeb;
   } 

html { background:var(--bg) } 
body { font-size:17px; margin:0; padding:0; font-family:'NanumSquareNeo', sans-serif; color:var(--black1); font-weight:300; } 
body *{box-sizing: border-box; vertical-align: middle;}
input, select, button, textarea {font-family:'NanumSquareNeo', sans-serif;font-size: 16px;font-weight:300;color:var(--black1)} 
em { font-style:normal } 
a { color:var(--color1) } 
strong{font-weight:500;}
input[type=submit] { cursor:pointer } 

#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:var(--color1); position:absolute; top:0px; left:0; z-index:5; color:var(--bg); 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 } 

 /*스크롤바*/
 *::-webkit-scrollbar { width:5px; height:5px; } 
 *::-webkit-scrollbar-track { border-radius:5px; background:var(--bg3); } 
 *::-webkit-scrollbar-thumb { background:var(--point_red); border-radius:20px } 
 

.wrap{margin: 0 20px;}

header{padding-bottom: 40px;background: var(--bg);}
header:hover, header.on{background: var(--bg);}

/* gnb */
.gnb{padding: 20px 0;}
.gnb>ul{display: flex; flex-wrap: wrap; gap: 6px 20px; justify-content: flex-end;}
.gnb ul li a{font-size: 14px;}
.gnb ul li a:hover,.gnb ul li a:focus{font-weight: 500; border-bottom: 1px var(--black1) solid;}
.gnb ul li.sns{position: relative; padding-right: 18px; background: url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 49px -61px;}
.gnb ul ul{display: none; position: absolute; transition: 0.3s; transform: translateY(-100px); background: var(--bg); border: 1px var(--line) solid; width: max-content; margin-top: 6px; border-radius: 10px; padding: 0 10px;}
.gnb ul li.sns.on ul{display: block; transform: translateY(0px);}
.gnb ul li.sns li{margin: 10px 0;}
.gnb ul li.sns li a{display: inline-block; line-height: 24px; padding-left: 24px; background: url('/images/dauri/common/sns.png') no-repeat; vertical-align: middle;}
.gnb ul li.sns li.insta a{background-position: -8px -106px;}
.gnb ul li.sns li.blog a{background-position: -7px -198px;}

/* 메뉴 */
.head{display: flex;  justify-content: space-between; align-items: center;}
.head h1 a{display: block;width: 200px;height: 55px;font-size: 0;background: url('/upload_data/board_data/CONTENTS_FILE/173441939628343.png') no-repeat;background-size: cover;}
.menuopen{display: block; width: 20px; height: 14px; background: url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 50% -15px; font-size: 0;}
.menu>button{position: absolute;bottom:10px;left: 23px;padding: 10px 10px;border: 1px var(--point_red) solid;color: var(--point_red);background: var(--bg);border-radius: 10px;font-size: 14px;font-weight: 500;}
.menu>button:hover,.menu>button:focus{background: var(--point_red); color: #fff;}
.tsitemap{display: none;}
.menu{display: none;position: absolute;top: 130px;right: 0;width: 85%;max-width: 340px;min-height: 400px;padding: 10px;border-radius: 10px 10px 10px 30px;background: var(--bg);z-index: 9;transition: 0.3s ease-in;}
.menu.on{display: block}
.menu .depth_box{position: absolute;top: 0;right: 0;width: 47%;height: 100%;background: var(--bg3);overflow-y: scroll;}
.menu .new_win{display: inline-block; width: 10px; height: 10px; font-size: 0;}
/* 1차메뉴 */
.menu li a{display: block;font-size: 14px;transition: 0.3s ease-in;line-height: 1.3em;}
.menu>ul>li>a{width: 131px;padding: 14px 10px;margin: 6px 0;word-break: keep-all;}
.menu>ul>li.on>a,
.menu>ul>li>a:hover,.menu>ul>li>a:focus{background: var(--point_red); border-radius: 10px 10px 30px 10px; color: #fff; font-weight: 500;}
/* 2차메뉴 */
.menu ul ul{padding: 24px 10px;}
.menu li li{margin: 0 0 14px;}
.menu li li a{display:block; padding: 0 0 14px 5px; border-bottom: 1px var(--line) solid;}
.menu li li.on>a{padding: 0 0 0 5px; font-weight: 500; border-bottom: none;} 
.menu li li a:hover,.menu li li a:focus{color: var(--black2); font-weight: 500; transition: 0.3s ease-in;}
.menu li li.on a:hover,.menu li li.on a:focus{border-bottom: none;}
/* 3차메뉴 */
.menu ul ul ul{background: var(--bg); margin-top: 14px; padding: 6px 10px; border-radius: 10px; }
.menu li li li{margin: 4px 0;}
.menu li li li a{position: relative; padding: 0 0 0 10px; border-bottom: none; }
.menu li li li a::before{content: ''; position: absolute; left: 0; top: 5px; display: block; width: 5px; height: 5px; background: var(--black6); border-radius: 50%;}
/* 새창 */
.menu .new_win{display: inline-block; width: 10px; height: 10px; margin-left: 4px; font-size: 0; background: url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 50% -114px; vertical-align: middle;}

/* 하단 */
footer{position: relative;padding: 40px 0;background: var(--black1);}
footer *{color:#fff;}
footer .f_con{padding-bottom: 40px;margin-bottom: 40px;border-bottom: 1px var(--black3) solid;}
footer .f_logo{margin-bottom: 20px;}
footer .f_logo a{display: block;width: 240px;height: 55px;background: url('/upload_data/board_data/CONTENTS_FILE/173441939628343.png') no-repeat;background-size: cover;background-position: 0 -75px;font-size: 0;}
footer .f_con ul{display: flex; flex-wrap: wrap; gap: 20px; align-items: center;}
footer .f_con ul li{position: relative; vertical-align: middle; font-size: 15px;}
footer .f_con ul li:first-child{font-weight: 500;}
footer .f_con ul li strong{display: inline-block; padding-right: 16px; background: url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 58px -61px; vertical-align: middle; font-weight: 300;}
footer .f_con ul ul{display: none; position: absolute; right: 0; margin-top: 10px; padding: 0 10px ; border-radius: 10px; background: var(--bg); width: max-content;}
footer .f_con li li:first-child{font-weight: 300;}
footer .f_con li li{margin: 10px 0;}
footer .f_con li a:hover,footer .f_con li a:focus{font-weight: 500; border-bottom: 1px var(--black1) solid;}
footer .f_con li.on ul{display: block;}
footer .add address{display: block; margin-bottom: 14px; font-size: 15px; font-style: normal; word-break: keep-all; line-height: 20px;}
footer .add address span{display: inline-block;color:#bcbcbc}
footer .add p{margin-bottom: 20px;}
footer .add p a{display: inline-block; margin-right: 14px; font-size: 15px;}
footer .add p a:hover,footer .add p a:focus{font-weight: 500; border-bottom: 1px var(--black1) solid;}
footer .add p a:after{content: ''; display: inline-block; vertical-align: text-top; margin-left: 4px; width: 10px; height: 10px; background: url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 50% -112px;}
footer .add .copy{font-size: 14px;}
footer .f_top{position: absolute; top: -40px; right: 10px; }
footer .f_top a{display: block;width: 80px;height: 80px;border-radius: 50%;background: var(--point_red) url('/images/dauri/common/ico_sub.png') no-repeat; url('/images/dauri/common/ico_sub.png') no-repeat;background-position: 50% -133px;font-size: 0;}

/* 서브 */
.s_title{padding: 40px 0;text-align: center;background: #c5daeb;}
.s_title .s_dept_tit{margin-bottom: 10px; font-size: 18px; font-weight: 600; color: var(--black5);}
.s_title h3{margin-bottom: 20px; font-family: 'JalnanGothic'; font-size: 30px; word-break: keep-all;}
.s_menu{position: relative;}
.s_menu>ul{display: flex; flex-wrap: wrap; gap: 10px;}
.s_menu>ul>li{}
.s_menu>ul>li::after{content: '';display: inline-block; width: 1px; height: 10px; margin: 0 0 0 10px; background: var(--black6);}
.s_menu>ul>li>a{position: relative;display: inline-block; font-size: 15px;}
.s_menu>ul>li:last-of-type::after{display: none;}
.s_menu>ul>li>a:hover,.s_menu>ul>li>a:focus{font-weight: 500; border-bottom: 1px var(--black1) solid;}
.s_menu li div{display: none; position: absolute; bottom: auto; left: 0; width: 100%; margin-top: 10px; padding: 20px; background: var(--bg); z-index: 1; border-radius: 10px; box-shadow: 0 0 20px #f9f9f9;}
.s_menu li.on div{display: block;}
.s_menu li li{margin-bottom: 14px;}
.s_menu li li a{display: block; font-size: 15px; padding-bottom: 14px; border-bottom: 1px var(--line) solid;}
.s_menu li li a:hover,.s_menu li li a:focus{border-bottom: 1px var(--point_red) solid; font-weight: 500;}
.s_menu li div button{display: inline-block; position: absolute; right: -20px; width: 40px; height: 40px; border-radius: 50%; font-size: 0; background:var(--black1) url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 50% -199px;}

.s_utill{display: flex; justify-content: center; gap: 10px; margin-bottom: 30px; z-index: 2;}
.s_utill>div button{display: inline-block; width: 40px; height: 40px; font-size: 0; border-radius: 50%; background:  var(--bg) url('/images/dauri/common/ico_sub.png') no-repeat;}
.s_utill>div.sharing button{background-position: 50% -291px;}
.s_utill>div.sharing div{display: none; position: absolute; margin-top: 10px; }
.s_utill>div.sharing div.on{display: block;}
.s_utill>div.sharing div ul li a{display: block; width: 40px; height: 40px; margin-bottom: 10px; font-size: 0; border: 1px var(--line) solid; background: var(--bg) url('/images/dauri/common/sns.png') no-repeat; border-radius: 50%;}
.s_utill>div.sharing div ul li.link_copy a{background: var(--bg) url('/images/dauri/common/ico_sub.png') no-repeat; background-position:50% -344px;}
.s_utill>div.sharing div ul li.face a{background-position: 1px -7px;}
.s_utill>div.sharing div ul li.twi a{background-position: 50% -52px;}
.s_utill>div.sharing div ul li.ins a{background-position: 1px -98px;}
.s_utill>div.sharing div ul li.kakao a{background-position: 50% -143px;}
.s_utill>div.sharing div ul li.blog a{background-position: 50% -190px;}
.s_utill>div.sharing div button{background: var(--black1) url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 50% -199px;}
.s_utill>div.print button{background-position: 50% -241px;}

/* 서브메뉴 */
.s_menu{text-align: left;}
.s_con{margin: 40px 0;}

@media all and (min-width:768px) {
.gnb>ul{gap: 0 20px;}
.head h1 a{width: 310px;height: 70px;background-size: auto;}
.s_title{padding: 40px 0;}
.s_title .s_dept_tit{font-size: 24px;}
.s_title h3{/* margin-bottom: 40px; */font-size: 46px;}

.s_title .wrap{position: relative;}
.s_utill{position: absolute; right: 0; bottom: 0; margin-bottom: 0;}

.s_menu>ul{justify-content: center;}
.s_menu>ul>li{position: relative;}
.s_menu>ul>li::after{margin: 0 20px;}
.s_menu>ul>li>a::after{content: ''; display: inline-block; width: 20px; height: 20px; margin-left: 10px; background: url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 50% -58px; vertical-align: middle;}
.s_menu>ul>li:first-of-type a::after{display: none;}
.s_menu li div{width: max-content; left: 0; box-shadow: 9px 9px 20px #f1f1f1;}

}

@media all and (min-width:1023px) {
body{min-width: 1400px;}
.wrap{width: 1400px; margin: 0 auto;}

header{padding-bottom: 50px;}

.menuopen{display: none;}
.menu>button{display: none;}
.tsitemap{display: block;}
.tsitemap a{display: block; width: 20px; height: 14px; background: url('/images/dauri/common/ico_sub.png') no-repeat; background-position: 50% -15px; font-size: 0;}
.menu{display: block !important; position: static;  width: auto;  padding: 0; max-width: max-content; min-height: auto; border-radius: 0; background: none;}
/* 1차메뉴 _pc */
.menu>ul{display: flex; gap: 60px;}
.menu>ul>li>a{width: auto; padding: 0; font-size: 20px; font-weight: 500;}
.menu>ul>li.on>a,
.menu>ul>li>a:hover,.menu>ul>li>a:focus{background: none; border-radius: 0; color:var(--point_red);}
.menu ul .depth_box{top: 158px; left: 0; width: 100%;  height: auto; background: var(--bg); border-top: 1px var(--line) solid;}
.menu ul .depth_box .depth_boxcon{width: 1400px; margin: 0 auto; padding: 30px 0;}
/* 2차메뉴 _pc */
.menu ul ul{display: flex;gap: 10px 2%;padding: 0;flex-wrap: wrap; justify-content: center;}
.menu li li{width: 23%;margin: 0;}
.menu li li a{padding: 20px;background: #ededed;border-radius: 10px;font-size: 16px;border: none;color: var(--black2);}
.menu li li.on>a{padding: 20px;}
.menu li li a:hover,.menu li li a:focus{background:var(--black1); color:#fff;}
.menu li li.on a:hover,.menu li li.on a:focus{background:var(--black1); color:#fff;}
/* 3차메뉴 _pc */
.menu ul ul ul{display: block; padding: 0 20px; margin-top: 20px;}
.menu li li li{width: 100%;}
.menu li li li a{padding: 0 0 0 10px;background: none;border-radius: 0;word-break: keep-all;}
.menu li li li a:hover,.menu li li li a:focus{background: none; color:var(--black1);}
.menu li li.on li a:hover,.menu li li.on li a:focus{background: none; color:var(--black1);}

/* 하단_pc */
footer{padding: 60px 0;}
footer .f_top{right: 8%;}
footer .f_con{display: flex; justify-content: space-between; }
footer .f_logo{margin-bottom: 0;}
footer .f_logo a{width: 310px;height: 70px;background-position: 0 -74px;background-size: auto;}
footer .f_con ul li a{font-size: 16px;}
footer .add{display: flex;   flex-wrap: wrap; }
footer .add address{margin-right: 100px; font-size: 16px; font-weight: 400;}
footer .add address span{font-weight: 300;}
footer .add p a{font-size: 16px; font-weight: 400;}
footer .add .copy{width: 100%; margin-bottom: 0;}

/* 서브_pc */
.s_con{margin: 60px 0;}
.s_title{border-radius: 0 0 260px 0; padding: 40px 0 60px;}
}