@charset "utf-8";

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css');
@import url('https://fonts.googleapis.com/css2?family=Do+Hyeon&display=swap');

::selection{background:#42B4EC;color:#000}

html, body{width: 100%; height: 100%;}

/* common */
*{margin: 0; padding: 0;font-family: 'Pretendard', sans-serif;}
html,body,div,span,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,blockquote,p,a,address,pre,cite,form,fieldset,table,th,td,legend,label,button{margin:0;padding:0;border:0;font-size:15px;font-family:'Pretendard', sans-serif; color: #000;}
input,textarea,select{margin:0;padding:0;  font-family:'Pretendard', sans-serif;}

input,textarea{-webkit-appearance: none !important;}
select::-ms-expand {display:none}

a, button {cursor:pointer;}
a, a:link{text-decoration:none;}

body{line-height:120%;color:#222;letter-spacing:0;-webkit-text-size-adjust:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
h1,h2,h3,h4,h5,h6,p{line-height:1.3em}
fieldset,img,abbr,acronym,label{border:0 none;}
ol,ul,dl{list-style:none;}
hr{display:none;}
fieldset{border:0}
label,select,input,textarea{vertical-align:middle}
img{vertical-align:top}

.notext {display: none;}
.cf::after {content: ''; clear: both; display: block;}

.txtCut{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.txt_cut1,.txt_cut2,.txt_cut3,.txt_cut4,.txt_cut5{overflow:hidden;text-overflow:ellipsis;-webkit-box-orient:vertical;word-wrap:break-word}
.txt_cut1{-webkit-line-clamp:1; white-space: nowrap;/* 라인수 */}
.txt_cut2{-webkit-line-clamp:2/* 라인수 */}
.txt_cut3{-webkit-line-clamp:3/* 라인수 */}
.txt_cut4{-webkit-line-clamp:4/* 라인수 */}
.txt_cut5{-webkit-line-clamp:5/* 라인수 */}
.txtCut2{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;/* 라인수 */-webkit-box-orient:vertical;word-wrap:break-word}


*{box-sizing: border-box;}
/*
#wrapper{position: relative; width: 100%; height: 100%; overflow: hidden; min-width: 900px;}
*/
#wrapper.my{height: auto;}

/* header */
.header{position: relative; width: 100%; height: 110px; padding: 0 30px; display: flex; align-items: center;}

.header .logo{position: relative; width: 200px;}

.header .village{position: relative; width: 30%; height: 50px;}
.header .village select{width: 100%; height: 100%; border-radius: 25px; padding: 0 30px; font-size: 18px; border:  1px solid #dedede; appearance: none; -webkit-appearance: none; outline: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 6'%3E%3Cpath style='fill:%23000' d='m6 6 6-6H0l6 6z'/%3E%3C/svg%3E") right 20px center no-repeat; background-size: 12px 6px;}

.header .explain{position: relative; margin-left: auto;}
.header .explain .care-map-info{padding-left: 30px; line-height: 1.5em; background: url("data:image/svg+xml,%3Csvg id='' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68.43 68.43'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23000;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M207.1,542.66a34.22,34.22,0,1,1,34.21-34.22A34.26,34.26,0,0,1,207.1,542.66Zm0-63.58a29.37,29.37,0,1,0,29.36,29.36A29.4,29.4,0,0,0,207.1,479.08Z' transform='translate(-172.88 -474.23)'/%3E%3Cpath class='cls-1' d='M203.43,520.59h6.87v6.49h-6.87Zm.21-28.78h6.66l-.77,23.44h-5.17Z' transform='translate(-172.88 -474.23)'/%3E%3C/svg%3E") left center no-repeat; background-size: 20px 20px;}
.header .explain .care-map-info-cont{position: absolute; z-index: 10; top: 40px; left: 50%; transform: translateX(-50%); width: 250px; padding: 20px; border-radius: 3px; background: #fff; border: 1px solid #dedede;}
.header .explain .care-map-info-cont .ico-arrow{display: block; width: 0px; height: 0px; border-bottom: 6px solid #dedede; border-left: 6px solid transparent; border-right: 6px solid transparent; transform: rotate( 0deg ); position: absolute; top: -7px; left: 50%; transform: translateX(-50%);}
.header .explain .care-map-info-cont .ico-arrow2{display: block; width: 0px; height: 0px; border-bottom: 6px solid #fff; border-left: 6px solid transparent; border-right: 6px solid transparent; transform: rotate( 0deg ); position: absolute; top: -6px; left: 50%; transform: translateX(-50%);}
.header .explain .care-map-info-cont p{font-size: 15px; color: #000; width: 100%; line-height: 1.2em;}

.header .login_info{position: relative; margin-left: 40px;}
.header .login_info ul{display: inline-block; width: 100%;}
.header .login_info ul li{position: relative; width: 100%;}
.header .login_info ul li a{display: flex; align-items: center; line-height: 1.5em;}
.header .login_info ul li .btn-logon{padding-left: 26px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75.51 97.21'%3E%3Cdefs%3E%3Cstyle%3E.ic_login%7Bfill:%23000;%7D%3C/style%3E%3C/defs%3E%3Cpath class='ic_login' d='M590.27,329.53h-6.38V315a23.08,23.08,0,0,0-46.16,0v14.54h-6.37a8.3,8.3,0,0,0-8.3,8.29v43a8.3,8.3,0,0,0,8.3,8.29h58.91a8.31,8.31,0,0,0,8.3-8.29v-43A8.31,8.31,0,0,0,590.27,329.53Zm-29.46-30.62A16.1,16.1,0,0,1,576.89,315v14.54H544.73V315A16.11,16.11,0,0,1,560.81,298.91Zm-30.75,38.91a1.3,1.3,0,0,1,1.3-1.29h58.91a1.3,1.3,0,0,1,1.3,1.29v43a1.3,1.3,0,0,1-1.3,1.29H531.36a1.3,1.3,0,0,1-1.3-1.29Z' transform='translate(-523.06 -291.91)'/%3E%3Cpath class='ic_login' d='M550.32,368.56a5.5,5.5,0,0,0,5.26,7.12h10.47a5.5,5.5,0,0,0,5.26-7.12l-1.43-4.64a12.44,12.44,0,1,0-18.13,0ZM560.81,350a5.43,5.43,0,0,1,2.09,10.45l-1.26.53,2.38,7.73h-6.41L560,361l-1.25-.53A5.43,5.43,0,0,1,560.81,350Z' transform='translate(-523.06 -291.91)'/%3E%3C/svg%3E") center left no-repeat; background-size: 16px 20px;}
.header .login_info ul li .btn-logoff{display: none;}
.header .login_info ul li .btn-logoff span{position: relative; display: inline-block; margin-right: 10px; overflow: hidden; width: 40px; height: 40px; border: 1px solid #dedede; border-radius: 50%; background: url("data:image/svg+xml,%3Csvg data-name='Layer 3' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 135.85 142.88'%3E%3Cpath d='M155 177.48c-10-3-14.39-9.7-14.39-9.7v-13.05a29.5 29.5 0 0 0 6-7 45.72 45.72 0 0 0 3.35-9.36S156 134 157.3 127s-4.69-9-4.69-9 2-5.69-2.67-20.74c-5.36-17.4-24.77-16.73-24.77-16.73s-19.4-.67-24.76 16.73c-4.63 15-2.67 20.74-2.67 20.74s-6 2-4.69 9 7.36 11.38 7.36 11.38a45.72 45.72 0 0 0 3.35 9.36 29.5 29.5 0 0 0 6 7v13.05s-4.35 6.69-14.39 9.7-38.14 16.07-38.14 45.85H193.1c0-29.79-28.1-42.84-38.1-45.86Z' transform='translate(-57.25 -80.44)' style='fill:%23d2d5d9'/%3E%3C/svg%3E") #fff 50% bottom no-repeat; background-size: 80%;}
.header .login_info ul li .btn-logoff span::before{content: ''; display: block; width: 100%; min-height: 100%; background: url(/treemap/resources/images/dollbom/test_img.jpg) 50% 50% no-repeat; background-size: cover;}
.header.login .login_info ul li .btn-logon{display: none;}
.header.login .login_info ul li .btn-logoff{display: flex;}
.header.login .login_info ul li .log-title{position: absolute; top: 50px; left: 50%; transform: translateX(-50%); width: 100px; padding: 7px 0; border: 1px solid #dedede; border-radius: 5px; box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, .12); z-index: 120; background-color: #fff;}
.header.login .login_info ul li .log-title a{display: inline-block; width:100%; text-align:center; padding: 5px 0; font-size: 13px; color:#000;}
.header.login .login_info ul li .log-title a:hover{text-decoration: underline;}
.header.login .login_info ul li .log-title .ico-arrow{display: block; width: 0px; height: 0px; border-bottom: 6px solid #dedede; border-left: 6px solid transparent; border-right: 6px solid transparent; transform: rotate( 0deg ); position: absolute; top: -7px; left: 50%; transform: translateX(-50%);}
.header.login .login_info ul li .log-title .ico-arrow2{display: block; width: 0px; height: 0px; border-bottom: 6px solid #fff; border-left: 6px solid transparent; border-right: 6px solid transparent; transform: rotate( 0deg ); position: absolute; top: -6px; left: 50%; transform: translateX(-50%);}


/* main */
/*
.main{position: relative; display: flex; width: 100%; height: calc(100% - 110px); padding: 0 30px 30px;}
*/
.main{position: relative; display: flex; width: 100%; }

.side{position: relative; width: 200px; height: 100%;}
.side ul{display: flex; flex-direction: column; width: 100%;}
.side ul li{position: relative; width: 100%; height: 60px;}
.side ul li a{width: 100%; height: 100%; display: flex; align-items: center;}
.side ul li a div{width: 100%; height: 100%; display: flex; align-items: center;}
.side ul li a div svg{display: inline-block; width: 24px; max-height: 24px; margin-right: 15px;}
.side ul li a div p{display: inline-block; color: #666; font-size: 15px;}
.side ul li a.on div p{color: #000; font-weight: 500; transition: all .2s;}
.side ul li a:hover div p{color: #000;}

.container{position: relative; width: calc(100% - 200px); height: 100%;}
.container .container_inner{width: 100%; height: 100%; border: 1px solid #dedede; border-radius: 10px; overflow: hidden;}




/*ie용 스크롤 바*/
html{
    scrollbar-arrow-color: none;
    scrollbar-Track-Color: #f0f0f0; 
    scrollbar-base-color: #ccc;
    scrollbar-Face-Color: #ccc;
    scrollbar-3dLight-Color: none;         
    scrollbar-DarkShadow-Color: none;
    scrollbar-Highlight-Color: #ccc;
    scrollbar-Shadow-Color: #ccc;
}
/* Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar{width: 6px;}
::-webkit-scrollbar-track{background: #f0f0f0; border-radius: 5px;}
::-webkit-scrollbar-thumb{background: #ccc; border-radius: 5px;}