/* BASIC css start */
/* 240114 작업 추가 css 시작 */

body.scrollNone{
  overflow-y: hidden;
}

header + *{
  padding-top: 30px;
}

header#header{
  height: 110px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1100;
  transition: 0.7s;
}

header#header.scrollAct{
  top: -111px;
}

header#header .closeBox{
  position: fixed;
  display: none;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  cursor: url('/design/custommood/deetong/cursor-close.png') 50 50, auto;
}

body.scrollNone header#header .closeBox{
  display: block;
}

header#header .tmsub{
  pointer-events: none;
  opacity: 0;
  transition: .7s;
  transform: translateX(-50%);
}

header#header .tmsub.act{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  pointer-events: auto;
  opacity: 1;
  transform: translateX(0%);
}

/* 240114 작업 추가 css 끝 */





#tm { position:absolute; display: flex; justify-content: space-between; align-items: center; z-index:999; width:100%; height:80px; transition: .4s background-color; }
#tm ul { display: flex; align-items: center; width:600px; height: 100%; z-index: 100;}
#tm ul li { padding-right:14px; padding-top: 6px;}
#tm ul li.logo { padding-right:40px; padding-left:60px; padding-top: 0; }
#tm ul li.logo img:nth-child(2) {display: none;}
#tm ul li.logo a { margin-top:0px }
#tm ul li.logo a:hover { border-bottom:0px }
#tm ul li a { font-size:12px; color:#fff; display:block; position: relative; }
#tm ul li a img {display:block; }
#tm ul li:nth-child(n+2) a::after {content: ''; display: block; height: 1px; width: 0%; background-color: #000; transition-duration: 0.3s; 
position: absolute; bottom: 0; left: auto; right: 0;}
#tm ul li a:hover::after {width: 100%; left: 0; right: auto;}
#tm ul li.act a::after {width: 100%; left: 0; right: auto;}



#tmlm { padding: 0 0 0 60px; box-sizing: border-box; }
#tmlm a { font-size:18px; color:#000; line-height:32px; position: relative; }

/* 카카오 플러스 친구 */
.linkBox { padding: 0 0 0 60px; box-sizing: border-box; }
.linkBox ul{padding-bottom: 10px;}
.linkBox ul li a{display: flex; align-items: center; }
.linkBox ul li a:nth-child(1){margin-bottom: 10px;}
.linkBox ul li a img{margin-right: 10px;}

.linkBox > div{margin: 0 0 80px;}
.linkBox > div a{padding: 11px 37px; border-radius: 9999px; border: 1px solid black; margin: 10px 0 0; display: inline-block;}
.linkBox > div a:hover { background:#353535; color:#fff; border: 1px solid #353535 }

#tmlm > div a::after {content: ''; display: block; height: 1px; width: 0%; background-color: #000; transition-duration: 0.6s; 
	position: absolute; bottom: 0; left: auto; right: 0;}
#tmlm > div a:hover::after {width: 100%; left: 0; right: auto;}

#tm .tm_right { width: calc(100% - 775px); height: 100%; text-align:right; box-sizing:border-box; /*padding-right:30px 추후이걸로수정*/ padding-right: 35px;
  display: flex; justify-content: flex-end;align-items: center;}
#tm .tm_right a { margin:0 7px }
#tm .tm_right img { width:20px }

.tmsub { z-index:999; width: 775px; height: calc(100vh - 30px); padding-top: 80px; background:#fafafa; box-sizing:border-box; }
.tmsub .btn_close { display:none; /*position: absolute;right: 30px;bottom: 95.7%;font-family: 'notokr-demilight';color: #000;font-size: 12px;z-index: 9999;transform: translateY(50%); padding-top: 6px*/}
.tmsub #tm ul { width:560px; }
.tmsub #tm ul li a { color:#000; }
.tmsub #tm ul li a:hover { border-bottom:1px solid #7b7a76; }
.tmsub #tm ul li a.on { border-bottom:1px solid #7b7a76; }


/* 마우스 오버 */
#tm.act{ background:#edeae5; }
#tm.act ul li a { color:#000; }
#tm.act ul li.logo img:nth-child(2) {display: block;}
#tm.act ul li.logo img:nth-child(1) {display: none;}


/* nav 클릭 */
#tm.navAct{ background-color: rgba(0, 0, 0, 0);width: auto; display: inline-block;}
#tm.navAct ul{width: auto;}
#tm.navAct .tm_right{ display: none;}

/* sch 클릭 */
#tm.schAct{ width: 2%;left: auto;right: 0; background-color: rgba(0, 0, 0, 0); }
#tm.schAct .tm_right{ width: 0; }
#tm.schAct ul{ display: none;}



/*우측 클릭하면 나옴*/
#main-top_bank_info1 { width:435px; height: calc(100vh - 30px); padding: 80px 0 0 70px; background:#fff; 
  box-sizing:border-box; background-color: #fafafa; pointer-events: none; opacity: 0;transform: translateX(50%); transition-duration: .5s;}
#main-top_bank_info1.act {pointer-events: auto; opacity: 1;transform: translateX(0%)}
#main-top_bank_info1 .btn_close { display:none; /* position:absolute; right: 155px; top: 35px; color:#000; font-size:11px; */ }

.r_search { margin-top:20px; }
.r_search p { font-size:15px; color:#000; padding-bottom:18px }
.r_search fieldset { background-color: #fff; width:238px; height:34px; box-sizing:border-box; border:1px solid #000; border-radius:17px; position:relative; padding:2px 12px; }
.r_search fieldset input { width:180px; height:30px; line-height:28px; box-sizing:border-box; border:0px; border-radius:10px; font-family:돋움; font-size:11px; color:#000 }
.r_search fieldset .btn-sch { position:absolute; right:20px; top:6px }

.r_news { margin-top:60px; }
.r_news h2 { font-size:11px; font-family:'Roboto', sans-serif; color:#000; font-weight:500 }
.r_news .box { padding-top:10px }
.r_news .box a { display:block; color:#545454; line-height:20px; font-family:돋움; font-size:11px; padding-left:1px;  }
.r_news .box a:hover { color:#000 }

.r_cacao { margin-top:40px; }
.r_cacao h2 { font-size:11px; font-family:'Roboto', sans-serif; color:#000; font-weight:500 }
.r_cacao .rline { width:12px; height:1px; background:#000; display:block; margin:8px 0 10px 2px }
.r_cacao .box { background:url(/design/custommood/deetong/r_img1.jpg) no-repeat 1px 6px; color:#545454; line-height:17px; font-family:돋움; font-size:11px; height:50px; padding-left:35px; padding-top:14px  }
.r_cacao .box span { color:#878787 }

.r_sns { margin-top:30px; }
.r_sns h2 { font-size:11px; font-family:'Roboto', sans-serif; color:#000; font-weight:500 }
.r_sns .rline { width:12px; height:1px; background:#000; display:block; margin:8px 0 10px 2px }
.r_sns .box { padding-top:6px  }
.r_sns .box img { height:22px; margin-right:8px }

.r_call { margin-top:200px; }
.r_call h2 { font-size:11px; font-family:'Roboto', sans-serif; color:#000; font-weight:500 }
.r_call .rline { width:12px; height:1px; background:#000; display:block; margin:8px 0 12px 2px }
.r_call strong { display:block; font-size:14px; font-family:'Roboto', sans-serif; color:#000; font-weight:500; }
.r_call .tx { font-size:11px; color:#878787; font-family:'Roboto', sans-serif; line-height:16px; margin-top:2px }
.r_call .tx span { color:#525252 }

.r_help { margin-top:40px; }
.r_help h2 { font-size:11px; font-family:'Roboto', sans-serif; color:#000; font-weight:500 }
.r_help .rline { width:12px; height:1px; background:#000; display:block; margin:8px 0 15px 2px }
.r_help .tx { line-height:20px; color:#878787; font-family:돋움; font-size:11px; padding-left:2px }



/* BASIC css end */