@charset "utf-8";


@import url(font.css);

* {font-family: 'Noto Sans KR'; font-weight:500; }
html, body {padding:0; margin:0; width:100%; height:100%; font-size:14px; /*font-weight:400;*/}
body { background:#fff; }
input, button, select { font-size:14px; font-family: 'GmarketSans';font-weight:500;}

h1, h2, h3, h4, h5, h6, div, p, dl, dt, dd, ul, ol, li, table, thead, tbody, tfoot, tr, td, caption {margin:0;padding:0; }
h1, h2, h3, h4, h5, h6{line-height:1;}
ol, ul, li { list-style:none; }
a {text-decoration:none; color:inherit; }
a:hover {text-decoration:none;}
em,address { font-style:normal;}
input[type="text"],
input[type="password"],
input[type="tel"]{ padding:0; margin:0; vertical-align:top;}
table {border-collapse: collapse; border-spacing: 0; }
table td { padding-top:3px; box-sizing:border-box;}

input[type="text"]::-webkit-input-placeholder { color:#999;}
input[type="text"]:-moz-placeholder { color:#999;}
input[type="text"]::-moz-placeholder { color:#999;}
input[type="text"]:-ms-input-placeholder { color:#999;}
input[type="text"]::placeholder { color:#999;}

caption, legend {width:0;height:0;font-size:0;color:transparent;line-height:0;}
fieldset { margin:0; padding:0; border:none;}


/* 탭메뉴 */
#wrap { position: relative; height: auto; }
.manual-wrap { width: 100%; height:100%; display: flex; /* flex-wrap: wrap; */ background: #f8f8f8;}
.tabmenu { position: fixed; height: 100%; display: flex; align-items: flex-start; justify-content: center; z-index: 1000; }
.tabs { width: 64px; height:100%; background: #0e3434;  color: #fff;  overflow: hidden; padding-top: 64px; box-sizing: border-box;}
.tabs li { text-align:center; cursor: pointer; width:64px; height:64px; background: #0e3434; overflow: hidden; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; border-bottom:1px solid #082b2b;}
.tabs li:hover { background: #144a4a;}
.tabs li.active { background: #23a5a5;}

.main-logo { position: absolute; left: 0; top: 0; width: 64px; height: 64px; text-align: center;display: flex; justify-content: center; align-items:center;}
.main-logo img { width: 60%;}

.tab_container { width:auto; height: 100%; position: relative; display: block;}
.tab_container .tab_content ul { width:100%; margin:0px; padding:0px;}
.tab_container .tab_content ul li { padding:5px; list-style:none;}

.tab_content {  padding: 5px; font-size: 12px; display: none;}

.manual-body { background: #f8f8f8; flex: 1; height: calc(100vh - 64px); display: flex; flex-direction: column; width: calc(100% - 256px); margin: 0; padding: 0;}

.side2depth-logo { position: relative; z-index: 1000; height: 64px; background: #fff; width: 190px; color: #1968b3; text-align: center; font-size: 36px; font-weight: 600; }
.side2depth-logo img { width: 100%;}
.side2depth-logo span { color: #b3192b;}
.side2depth-wrap { position: absolute; left: 0; top: 64px; width: 190px; height: calc(100% - 64px); background: #e7f5f5;}
.side2depth-menu { clear: both; display: block;}
.side2depth-menu dl { padding-bottom: 0px;}
.side2depth-menu dl dt { width: 100%; height: 36px; background: #0A8C8C;  display: flex;  align-items: center; padding-left: 20px; box-sizing: border-box; color: #fff; font-size: 16px;}
.side2depth-menu dl dd:hover { background: #c7f2f2;}
.side2depth-menu dl dd { width: 100%; height: 32px; padding-left: 20px; background: #E7F5F5; display: flex; align-items: center; cursor: pointer; transition: 0.3s; box-sizing: border-box; color: #333; font-size: 14px;}

/* 매뉴얼 컨텐츠 */
.manual-bodyconts { position: relative; padding-left:275px; padding-right: 30px; padding-bottom: 30px; flex: auto; box-sizing: border-box;}
.manual-title { height: 64px; line-height: 64px; font-size: 30px; font-weight: 600; border-bottom:1px dashed #dcdfe6;}
.manual-current { clear: both; overflow: hidden; padding: 15px 0;}
.manual-current li { float: left; color: #999; padding-right: 15px; font-size: 14px; font-weight: 300;}
.manual-current li .on { font-weight: 500; color: #222;}
.manual-current li:after { content: ''; display: inline-block; margin-left: 15px; width: 10px; height: 15px; background: url(../img/arrow.png) no-repeat; }
.manual-current li:last-child:after { content: ''; display: inline-block; margin-left: 5px; background: none; }

.manual-content { clear: both; position: relative; padding: 20px 35px; background: #fff; width: 100%; box-sizing: border-box; border:1px solid #E7F5F5; padding-bottom: 100px;}

.manual-conts-title { font-size: 24px;}
.manual-conts-title span { font-size: 20px; font-weight: 300; padding-right: 15px;}
.manual-conts-title span:after { content: ''; display: inline-block; margin-left: 15px; width: 10px; height: 15px; background: url(../img/arrow.png) no-repeat;}
.manual-img-box { clear: both; padding: 20px 0 0 0;}
.manual-img-box img { width: 100%; max-width: 1200px; border: 1px solid rgba(141,148,148,0.5); border-radius: 7px;}

.manual-img-nobox { clear: both; padding: 20px 0 0 0;}
.manual-img-nobox img { border: 1px solid rgba(141,148,148,0.5); border-radius: 7px;}

.manual-txt-box { background: #f8f8f8; border-radius: 7px; border-top:1px solid #eeecec; padding: 20px 20px 25px; color: #182a2a; font-size: 15px; font-weight: 400;}
.manual-txt-box p { font-size: 15px; font-weight: 400;}
.manual-txt-box p.manual-txt-main { font-size: 18px; padding-bottom: 5px;}


.conts-blank { height: 50px; clear: both;}
.no-menu { display: none !important;}


.manual-pageconts { max-width: 1200px;}