@charset "UTF-8";
/* ellipsis */
/* thumbnail background */
/* break point */

/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

body {
  margin: 0; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }
  
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

a {color:#00AECD;background-color:transparent; text-decoration:none ;outline: none;}
a:active {background-color:transparent}

abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

b,
strong {
  font-weight: bolder; }

code,
kbd,
samp {
  font-family: consolas, 'Meiryo UI', '맑은 고딕', 'Malgun Gothic', 나눔고딕, NanumGothic, Gothic, 고딕, AppleGothic, Sans-serif;
  color:#A10000;
}

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

img {
  border-style: none; }

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
  outline: none; }

button,
input {
  /* 1 */
  overflow: visible; }

button,
select {
  /* 1 */
  text-transform: none; }

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

fieldset {
  padding: 0.35em 0.75em 0.625em; }

legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

progress {
  vertical-align: baseline; }

textarea {
  overflow: auto; }

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */ }

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

details {
  display: block; }

summary {
  display: list-item; }

template {
  display: none; }

[hidden] {
  display: none; }

/* common */
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section,
summary {
  display: block; }

body {
  font-family:'Meiryo UI', '맑은 고딕', 'Malgun Gothic', 나눔고딕, NanumGothic, Gothic, 고딕, AppleGothic, Sans-serif;
  color:#555;
  font-size:14px;
  line-height:2;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.blind {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  margin: -1px;
  width: 1px;
  height: 1px; }


.tistoryProfileLayerTrigger {display:none !important;}
.container_postbtn {padding: 35px 0 50px 0 !important;}
.txt_bar{display:inline-block;width:1px;height:9px;margin:0 5px;background-color:#999}
.txt_bar_white {display:inline-block;width:1px;height:9px;margin:0 5px;background-color:#fff}
.container_postbtn .link_ccl {border-bottom:none;}

/* html */
html, body {
  position: relative;
  height: 100%;
  -webkit-text-size-adjust: 100%;
  }

html {
  box-sizing: border-box; }

*,
*:before,
*:after {
  box-sizing: inherit; }

#wrap {
  position: relative;
  overflow: hidden; }

/* container */
#container {
  position: relative;
  width: 100%; 
}
  #container:after {
    content: '';
    display: block;
    clear: both; }

/* main */
#main {
  width: 100%;
  min-height: 500px;
}

figure[data-ke-type="opengraph"], #tt-body-page figure[data-ke-type="opengraph"] {
    margin-top: 10px;
}

/***************************************
    ■ 서식
    <div class="notice"></div>
 ***************************************/

/* .article_view .wrap_bookmark {
    position: relative;
    background-color: #f9f9f9;
    padding: 25px 25px 25px 65px;
    border: 1px solid #e3e3e3;
}

.article_view .wrap_bookmark .bookmark {
    position: absolute;
    top: -1px;
    left: 14px;
    width: 30px;
    height: 47px;
    background-color: #EF6C57
}

.article_view .wrap_bookmark .bookmark::before {
    content: '';
    position: absolute;
    top: 18px;
    left: 0px;
    border: 15px solid;
    border-color: transparent transparent #F9F9F9 transparent;
    width: 27px;
    height: 0;
} */

/* .article_view .bracket_saying {
    border: 10px solid #ddd;
    padding: 15px 30px;
    margin: 0;
}

.article_view .bracket_saying::before {
    content: '';
    width: 90%;
    height: 10px;
    background-color: #fff;
    display: block;
    position: relative;
    top: -25px;
    margin: 0 auto;
}

.article_view .bracket_saying::after {
    content: '';
    width: 90%;
    height: 10px;
    background-color: #fff;
    display: block;
    position: relative;
    bottom: -25px;
    margin: 0 auto;
} */

.article_view .alert:before {
    position: absolute;
    top: -11px;
    left: 15px;
    padding: 1px 6px 1px 7px;
    border-radius: 2px;
    font-family: consolas;
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    letter-spacing: 1px;
}


.article_view .alert_info:before {
    content: 'Info';    
    background-color: #71BEFF;
}

.article_view .alert_warning:before {
    content: 'Warning';
    background-color: #F67280;
}

.article_view .alert_help:before {
    content: 'Help';
    background-color: #B189D5;
}

.article_view .alert {
    position:relative;
    color:#555;
    line-height: 1.6;
    margin-top: 15px !important;
    padding:16px 20px 18px 14px !important;
}

.article_view .alert_info {
    border-top: 1px solid #71BEFF !important;
    background-color: #F0FAFF !important;
}

.article_view .alert_warning {
    border-top: 1px solid #F67280 !important;
    background-color: #FFF5F7 !important;
}

.article_view .alert_help {
    border-top: 1px solid #B189D5 !important;
    background-color: #FAF5FF !important;
}


.content, .content td {
font-family:'Meiryo UI', '맑은 고딕', 'Malgun Gothic', 나눔고딕, NanumGothic, Gothic, 고딕, AppleGothic, Sans-serif ;
font-size:14px;
}

/* adsense 
=================================================================================*/
#wrap_adsense_top {
  margin: 0 auto 40px auto;
  text-align: center;
}

.noAds_gt_exp,
.noAds_gb_exp,
.noAds_side_exp {
  text-align: center;  
  color: #aaa;
  display: none;
}

.noAds_gt_exp {
  margin-bottom: 35px;
}

.noAds_gb_exp {
  padding-top: 10px;
  font-size: 13px;
}

.noAds_side_exp {
  font-size: 13px;  
}

.adsense_top_left {
  float: left; 
  width: 336px;
  height: auto;
  /* height: 280px; */
  margin:0;
  padding:0;
}
.adsense_top_right {
  float: right; 
  width: 336px;
  height: auto;
  margin:0;
  padding:0;
}
#wrap_adsense_top:after {content:""; clear:both; display:block;}


#wrap_adsense_bottom {
  width: 100%;
  margin: 0 auto 10px auto;
  max-width: 820px;
}

/* mobile top backgound */
.mobile_bag {display:none;}

/* blog_log */
.blog_logo {
  position: fixed;
  z-index: 16;
  bottom: 25px;
  right: 196px;
  background-color: #000;
  width: 74px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  font-weight: bold;
  letter-spacing: 1px;
  height: 26px;
  line-height: 25px;
  font-size: 12px;
  transform: rotate(270deg);
}

#wrap .blog_logo_rightZero {
  right:-22px;
}

 
/*****************
  box_header
******************/
.box_header {
  position:fixed;
  background-color:transparent;
  height: auto;
  width:auto;
  z-index: 20;
  
/*   overflow:auto;
  -ms-overflow-style: none; 
  scrollbar-width: none;  */
 }
  
.box_header::-webkit-scrollbar {
  display:none;
} 

.box_header_bg {
    background-color: #000000;
  width:60px;
  height: 100%;
}

.box_header_inner {position:relative; margin-top: 15px;} 

/*
  sidebar on/off switch
*/
.box_header label.input-toggle {
  line-height: 0;
  font-size: 0;
  display: inline-block;
  margin: 0;
}

.box_header label.input-toggle > span {
  display: inline-block;
  position: relative;
  background-image: -webkit-linear-gradient(left, #848484 0%, #848484 50%, #7cbcbf 50%, #7cbcbf 100%);
  /* background-image: linear-gradient(to right, #848484 0%, #848484 50%, #7cbcbf 50%, #7cbcbf 100%); */
  background-image: linear-gradient(to right, #848484 0%, #848484 50%, #2196F3 50%, #2196F3 100%);
  background-size: 64px 14px;
  background-position: 0%;
  border-radius: 32px;
  width: 32px;
  height: 14px;
  cursor: pointer;
  -webkit-transition: background-position 0.2s ease-in;
  transition: background-position 0.2s ease-in;
}

.box_header label.input-toggle > input:checked + span { background-position: -100%; }

.box_header label.input-toggle > span:after {
  content: "";
  display: block;
  position: absolute;
  width: 18px;
  height: 18px;
  background: #F1F1F1;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  -webkit-transition: left 0.2s ease-in, background-color 0.2s ease-in, -webkit-transform 0.3s ease;
  transition: left 0.2s ease-in, background-color 0.2s ease-in, -webkit-transform 0.3s ease;
  transition: left 0.2s ease-in, background-color 0.2s ease-in, transform 0.3s ease;
  transition: left 0.2s ease-in, background-color 0.2s ease-in, transform 0.3s ease, -webkit-transform 0.3s ease;
}

.box_header label.input-toggle > input:checked + span:after {
  left: calc(100% - 18px);
  background-color: #fff;
}

.box_header label.input-toggle > input:disabled + span { cursor: default; }
.box_header label.input-toggle > input:disabled + span { background: #D5D5D5; }
.box_header label.input-toggle > input:disabled + span:after { background: #BDBDBD; }
.box_header label.input-toggle > input {
  display: block;
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* 
  sidemenu button
 */
/* .box_header ul.side_menu .li_comment,
.box_header ul.side_menu .li_admin,
.box_header ul.side_menu .li_guest  */

.box_header ul.side_menu {
  display:none;
}

.box_header ul {
  list-style:none;
  margin:0;
  padding:0;
}

.box_header ul li {
  /* border-bottom: 1px solid #212F44; */
  padding:2px 0;
    text-align: center;
}

.box_header ul li.li_guest {
  border-bottom:none;
}

.box_header ul li.li_admin:last-child {
  border-bottom:none;
}

.box_header ul.side_menu_switch li {
    margin-bottom: 6px;
    border-bottom:none;
  padding-left: 15px;
  text-align: left;
}

/* .box_header ul.side_menu li.li_guest,
.box_header ul.side_menu li.li_admin_last {
  border-bottom: none;
}
 */
.box_header ul.side_scroll {
  position: fixed;
  bottom: 20px;
  width: 60px;
}

.box_header ul.side_menu li a {
  display:block;
  background-image:url('./images/ico_default.svg');
  background-repeat:no-repeat;
  background-color: #2E3130;
  border-radius: 3px;
  background-size: 41% 41%;
  width: 36px;
  height: 36px;
  margin:0 auto;
  background-position: center;
}

.box_header ul.side_menu li a:hover {
  background-color: #52B0D3;
}
.box_header ul.side_menu li .link_logo {
  background-color: none;
  background-size: 36px 36px;
  width: 100%;
  height: 100%;
  border-radius:0;
}
.box_header ul.side_menu li .link_sidebar {background-image:url('./images/ico_grid.svg'); background-size: 64% 64%;}
.box_header ul.side_menu li .link_search {background-image:url('./images/ico_search.svg');}
.box_header ul.side_menu li .link_home {background-image:url('./images/ico_home.svg');}
.box_header ul.side_menu li .link_tag {background-image:url('./images/ico_tag.svg'); background-size: 36% 37%;}
.box_header ul.side_menu li .link_guest {background-image:url('./images/ico_guest.svg'); background-size: 36.2% 36.1%;}
.box_header ul.side_menu li .link_notice {background-image:url('./images/ico_notice.svg'); background-size: 41% 42%;}
.box_header ul.side_menu li .link_comment {background-image:url('./images/ico_comment.svg'); background-size: 41% 41.7%;}
.box_header ul.side_menu li .link_write {background-image:url('./images/ico_pencil.svg'); background-size: 37% 36%;}
.box_header ul.side_menu li .link_admin {background-image:url('./images/ico_setting.svg');}
.box_header ul.side_menu li .link_login {background-image:url('./images/ico_login.svg');}
.box_header ul.side_menu li .link_logout {background-image:url('./images/ico_logout.svg'); background-size: 41% 42%;}
.box_header ul.side_scroll li .link_up {background-image:url('./images/ico_up.svg'); margin-bottom: 3px;}
.box_header ul.side_scroll li .link_down {background-image:url('./images/ico_down.svg');}
.box_header ul.side_scroll li {padding:0;border:none;}
 
.box_header ul.side_menu {display:none;} 
 
.white .box_header {
  border-bottom: none; }
 
.white .area_cover {
  margin-top: 0; }

.white .type_featured {
  margin-top: 0;
  max-width: 1100px;
  padding: 60px 50px;
  margin: 0 auto;
}

.box_header .tooltip .tooltiptxt {
    visibility:hidden;
    position: absolute;
    white-space: nowrap;
    left: 68px;
    margin-top: -33px;
    background-color: #000;
    color: #fff;
    font-size: 12px;
    padding: 0 10px;
    border-radius: 3px;
    line-height: 2.4;
}

.box_header .tooltip:hover .tooltiptxt {
    visibility:visible;
}

.box_header .tooltip .tooltiptxt::before {
    content: '';
    display: block;
    border-width: 5px;
    border-color: transparent transparent transparent #000;
    position: absolute;
    top: 10px;
    left: -8px;
    border-style: solid;
}


/***************** 
   area_sidebar 
******************/
.dimmed_back {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity:0.85;
  z-index: 17;
}

.dimmed_back:after {
  content:'';
  clear:both;
  display:block;
}
.area_sidebar .sidebar_header {height:0;}
/* .area_sidebar .btn_close {
  position: relative;
  background-image: url('./images/ico_close_circle.svg');
  background-size: 32px 32px;
  background-position: center;
  background-repeat: no-repeat;
  left: calc(50% + 300px);
  top: 98px;
  right: 2px;
  width: 32px;
  height: 32px;
  cursor: pointer;  
} */

.area_sidebar .btn_close {
  position: absolute;
  width: 46px;
  height: 46px;
  top: 91px;
  left: calc(50% + 286px);
  cursor: pointer;
  background-color: #52B0D3;
  border-radius: 50%;
  border: 10px solid #DFEDF2;
  z-index: 35;
}
  
.area_sidebar .btn_close::before, 
.area_sidebar .btn_close::after {
  content: '';
  position: absolute;
  width: 55%;
  top: 12px;
  left: 6px;
  height: 2px;
  background: #fff;
  -webkit-transform: rotate(45deg); 
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);  
}
  
.area_sidebar .btn_close::after {
  -webkit-transform: rotate(-45deg); 
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}



.area_sidebar .btn_close:hover {
  border-color: #e7ddfb;
}

.area_popup .btn_close {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 5px;
  right: 5px;
  background-color: #555;
  border-radius: 5px;
  cursor: pointer;
  z-index: 31;
}

.area_popup .btn_close::before, 
.area_popup .btn_close::after {
  content: '';
  position: absolute;
  width: 19px;
  top: 14px;
  left: 6px;;
  height: 1px;
  background: #fff;
  -webkit-transform: rotate(45deg); 
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);  
}
  
.area_popup .btn_close::after {
  -webkit-transform: rotate(-45deg); 
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.area_sidebar .btn_close:focus,
.area_popup .btn_close:focus {outline:none;}

.area_sidebar {
  position: relative;
  z-index: 31;}

.area_sidebar h3 {
  font-size:20px;
}
  .area_sidebar a {
    text-decoration: none; }
  .area_sidebar ul {
    list-style: none;
    margin: 0;
    padding: 0; }

 .area_sidebar .inner_sidebar {
  width:100%;
    height: 100%;
    position: fixed;
    top: 0;
    height: 100%;
    background: #fff;
    box-sizing: border-box;
    overflow: auto;
  z-index: 31;
}

.area_sidebar .inner_sidebar:after {
  content: '';
  display: block;
  clear: both;
}
  
.area_sidebar .tt_category:after {
  content: '';
  display: block;
  clear: both;
}

.area_sidebar .box_gnb::after {
  content:'';
  clear:both;
  display:block;
}

.area_sidebar .box_gnb li:last-child {
  margin-bottom: 0;
}

.area_sidebar .btn_search {
  margin-top: 12px;
  padding: 10px 0;
  background-color: transparent;
  font-size: 14px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.87); 
}

.area_sidebar .icon-Search {
  margin-left: 5px;
  font-size: 20px;
  color: rgba(0, 0, 0, 0.54);
  vertical-align: -2px; 
}

.area_sidebar .box_tool {
  padding: 50px 0; 
}

.area_sidebar .link_tool {
  position: relative;
  display: inline-block;
  margin: 0 10px;
  font-size: 14px;
  font-weight: bold;
  color: #333;
}

.area_sidebar .link_tool:first-child {
  margin-left: 0;
}

/* menu tab */
.sidebar_contents {
  height: 100%;
  background-color: #fff;
}
.menu_tab {
  position:relative;
  text-align:center;
  padding-bottom: 100px;
  background-color: #fff;
}
.radio_tab {
  position:fixed;
  bottom: 20px;
  left:calc(50% - 60px);
  width:20px;
  opacity: 0.7;
  z-index: 34;
}

.menu_tab input:nth-of-type(2) {
  -webkit-transform: translateX(20px); 
  -moz-transform: translateX(20px);
  -o-transform: translateX(20px);
  transform: translateX(20px);
}

.menu_tab input:nth-of-type(3) {
  -webkit-transform: translateX(40px); 
  -moz-transform: translateX(40px);
  -o-transform: translateX(40px);
  transform: translateX(40px);
}

.menu_tab input:nth-of-type(4) {
  -webkit-transform: translateX(60px); 
  -moz-transform: translateX(60px);
  -o-transform: translateX(60px);
  transform: translateX(60px);
}

.menu_tab input:nth-of-type(5) {
  -webkit-transform: translateX(80px); 
  -moz-transform: translateX(80px);
  -o-transform: translateX(80px);
  transform: translateX(80px);
}

.menu_tab input:nth-of-type(6) {
  -webkit-transform: translateX(100px); 
  -moz-transform: translateX(100px);
  -o-transform: translateX(100px);
  transform: translateX(100px);
}

.menu_tab label {
  position: relative;
  display: inline-block;
  background-color: #52B0D3;
  font-size: 13px;
  width: 90px;
  height: 90px;
  color: #555;
  border-radius: 50%;
  border: 10px solid #DFEDF2;
}
.menu_tab .tit_bg {
  padding: 70px 0 70px 0;
  max-width: 700px;
  margin: 0 auto;
}

.menu_tab label:hover {
  border-color:#e7ddfb;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;  
}

.menu_tab .link_title {
  position:relative;
  color:#fff;
  font-weight:bold;
  font-size:14px;
  line-height:4.8;
  z-index:33;
}
.menu_tab label {
  cursor:pointer
}
.menu_tab input[type="radio"]:focus {outline:none;}

.menu_tab .tab_content {
  display:none
}

.menu_tab input:nth-of-type(1):checked ~ div:nth-of-type(2),
.menu_tab input:nth-of-type(2):checked ~ div:nth-of-type(3),
.menu_tab input:nth-of-type(3):checked ~ div:nth-of-type(4),
.menu_tab input:nth-of-type(4):checked ~ div:nth-of-type(5),
.menu_tab input:nth-of-type(5):checked ~ div:nth-of-type(6),
.menu_tab input:nth-of-type(6):checked ~ div:nth-of-type(7) {
  display:block;
}

.menu_tab input:nth-of-type(1):checked ~ div > label:nth-of-type(1) {background-color:#856eb2;}
.menu_tab input:nth-of-type(1):checked ~ div > label:nth-of-type(1) {border-color:#e7ddfb;}
.menu_tab input:nth-of-type(2):checked ~ div > label:nth-of-type(2) {background-color:#856eb2;}
.menu_tab input:nth-of-type(2):checked ~ div > label:nth-of-type(2) {border-color:#e7ddfb;}
.menu_tab input:nth-of-type(3):checked ~ div > label:nth-of-type(3) {background-color:#856eb2;}
.menu_tab input:nth-of-type(3):checked ~ div > label:nth-of-type(3) {border-color:#e7ddfb;}
.menu_tab input:nth-of-type(4):checked ~ div > label:nth-of-type(4) {background-color:#856eb2;}
.menu_tab input:nth-of-type(4):checked ~ div > label:nth-of-type(4) {border-color:#e7ddfb;}
.menu_tab input:nth-of-type(5):checked ~ div > label:nth-of-type(5) {background-color:#856eb2;}
.menu_tab input:nth-of-type(5):checked ~ div > label:nth-of-type(5) {border-color:#e7ddfb;}
.menu_tab input:nth-of-type(6):checked ~ div > label:nth-of-type(6) {background-color:#856eb2;}
.menu_tab input:nth-of-type(6):checked ~ div > label:nth-of-type(6) {border-color:#e7ddfb;}


.menu_tab .tab_content {
  width:100%;
}

.menu_tab .tab_content .tab_set {
  max-width: 1000px;
  padding: 0 50px;
  margin: 0 auto;
  height: auto;
}
.menu_tab .tab_content .tab_set_reply {
  max-width: 900px;
}

/* category - areasidebar */

.box_gnb_cate {
  margin:0 auto;padding:10px;;
}
ul.tt_category {
  padding:0;
  background-color:#fff;
  list-style:none;
  display:block;
  line-height:3;
  border-radius:4px;
  max-width:300px;
  margin:0 auto;
  text-align: left;
}

ul.tt_category li {
  border:1px solid #E0E5EE;
  border-radius:5px;
}
ul.tt_category li a {
  color:#333;  
  padding:0 20px;
  display: block;
}
ul.category_list {padding:0;}
ul.category_list li {
  position:relative;
  display:block;
  cursor:pointer;
  border-top:1px dotted #b0b0b0;
  border-left:none;
  border-right:none;
  border-bottom:none;
  border-radius:0;
}
ul.category_list li .c_cnt {
  font-size:13px;
  padding-left:3px
}

ul.sub_category_list {
  padding:0;
  display:none;
}
ul.sub_category_list li {
  background-color:#f0f1f2;
  width:100%;
}
ul.sub_category_list li .c_cnt {
  font-weight:normal;
}
ul.sub_category_list li a {
  font-weight:normal;
}

ul.category_list li .ico_expand::before {
  content:"";
  border:7px solid;
  border-color:transparent transparent transparent #333;
  display:block;
  position:relative;
  top:1px;
}
ul.category_list li.cate_open .ico_expand::before {
  content:"";
  border:7px solid;
  border-color:#333 transparent transparent transparent;
  display:block;
  position:relative;
  top:4px;
  left:-4px;
}
ul.category_list li .ico_expand {
  position:absolute;
  float:right;
  right:0;
  top:0;
  padding:14px;
  font-weight:bold;
  -webkit-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
/* ul.category_list li.cate_open .ico_expand {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
} */

ul.category_list li.cate_open ul.sub_category_list li a {color:#555}
ul.category_list li.cate_open ul.sub_category_list li a::before {content:"↘";margin-right: 5px;}
/* ul.category_list li .ico_expand:hover {color:#E01B6A;} */
ul.category_list li .ico_expand::after {content:'';}


/* area_popup */
.area_popup {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100vh;
  z-index: 31;
}

.area_popup .area_search {
  position: fixed;
  background: #fff;
  width: 90%;
  max-width: 820px;
  padding: 50px 0 30px 0;
  z-index: 31;
}

.area_popup .search_header:after {
  content: '';
  display: block;
  clear: both;
}

.area_popup .search_content {
  padding: 10px 30px 20px 30px;
  font-size: 0;
}

.area_popup .search_content:after {
  content: '';
  display: block;
  clear: both; }

.area_popup .box_form {
  position: relative;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid #e9e9e9; }

.area_popup .box_form .icon-Search {
  display: inline-block;
  margin-left: 10px;
  margin-right: 24px;
  font-size: 36px;
  color:#777;
  vertical-align: -10px; }

.area_popup .box_form .inp_search {
  width: 80%;
  border: none;
  font-size: 24px;
  color: #000;
  line-height: 1.2;
  position: relative;
  top:3px;
}

.area_popup .box_form .inp_search::placeholder {
  color:#999;
}

.area_popup .box_form .btn_search_del {
  position: absolute;
  top: 0;
  right: 0;
  width: 36px;
  height: 36px;
  padding: 6px;
  border: none;
  background-color: transparent;
  cursor: pointer;
  fill-opacity: 0.3;
}

.area_popup .box_form .btn_search_del {
  position: absolute;
  width: 30px;
  height: 30px;
  top: 5px;
  right: 5px;
  cursor: pointer;
  z-index: 31;
}

.area_popup .box_form .btn_search_del::before, 
.area_popup .box_form .btn_search_del::after {
  content: '';
  position: absolute;
  width: 22px;
  top: 14px;
  left: 6px;;
  height: 1px;
  background: #555;
  -webkit-transform: rotate(45deg); 
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);  
}
  
.area_popup .box_form .btn_search_del::after {
  -webkit-transform: rotate(-45deg); 
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}





.area_popup .box_form .btn_search_del:focus {
  outline:none;
}

.area_popup .tag_zone a:before {
  content:'#';
}
.area_popup .tag_zone a {
  display: block;
  font-size: 20px;
  color: #555;
  text-decoration: none;
  border-bottom: 1px solid #e9e9e9;
  line-height: 2.5;
  padding-left: 15px;
}

.area_popup .tag_zone a:last-child {
  border-bottom:none;
}

.area_popup .tag_zone a:hover {
  color: #fff;
  background-color:#000;
}

.list_sidebar {
  margin: 0;
  padding: 0;
  list-style: none; }

aside .list_sidebar_thumb {margin-left:-1px;}
aside .list_sidebar .item_sidebar {
  float:left;
  position:relative;
  width: 20%;
  padding-left: 1px;
  margin-bottom:1px;
}

/* aside .list_sidebar .item_sidebar::after {
content: '';
clear: both;
display: block;
} */

aside .list_sidebar .item_sidebar_1col {
  display: inline-block;
  padding: 0;
  width: 100%;
}
aside .cal_click {display:block;}
aside .list_sidebar .item_sidebar_1col a {color:#555;}
aside .list_sidebar .item_sidebar_1col .cnt {font-size:13px;}
aside ul.list_sidebar li.item_sidebar_lst {
  line-height:4;
  text-align: left;
  border-top:1px solid #efefef;
}
aside ul.list_sidebar li.item_sidebar_lst:last-child {border-bottom:1px solid #efefef;}
aside ul.list_sidebar li.item_sidebar_lst:hover {
  background-color:#EBEBEB;
}
aside .list_sidebar .item_sidebar_lst a {
  color:#555;
  font-size: 13px;
  padding: 0 15px;
  display:block;
}

aside ul.list_sidebar li.item_sidebar_lst .txt_name {
  width: 125px;
  display: inline-block;
  text-overflow: ellipsis;
  line-height: 1.5;
  padding: 0px 20px 4px 0;
  vertical-align: middle;
}
aside ul.list_sidebar li.item_sidebar_lst .txt_desc {
    width: calc(100% - 179px);
    display: inline-block;
  vertical-align: middle;
  overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 20px;
}

aside ul.list_sidebar li.item_sidebar_lst .txt_desc::before {
    content: '';
    width: 7px;
    height: 7px;
    background-color: #ff9f7f;
    display: block;
    border-radius: 50%;
    position: relative;
    top: -2px;
    display: inline-block;
    margin-right: 7px;
}

aside ul.list_sidebar li.item_sidebar_lst .txt_time {
    display: inline-block;
  width:45px;
  text-align:right;
}


.list_sidebar .thumb_img {
  background-size:cover;
  background-image:url('./images/ico_no.svg');
  background-color:#e9e9e9;
  width:100%;
  padding-top:100%;
}

.list_sidebar .txt_date {
  position: absolute;
  background-color: rgba(0,0,0, 0.3);
  font-size: 12px;
  bottom: 0;
  left:1px;
  right:0;
  color: #fff;
  letter-spacing: 1px;
  padding: 3px;
  z-index: 1;
}

/* 인기 글 */
.tab_content_3 {
  counter-reset:cnt_pop;
}
  
.list_sidebar .cnt_sidebar_pop::before {
  counter-increment:cnt_pop;
  content:counter(cnt_pop);
}

.list_sidebar .cnt_sidebar_pop {
  position: absolute;
  background-color: #FF7878;
  top: 0;
  left:1px;
  color: #fff;
  font-size:13px;
  width: 28px;
  height: 26px;
  font-weight: bold;
  z-index: 1;
}

.list_sidebar .item_sidebar .cont_thumb {
  display:none;
}

.list_sidebar .item_sidebar:hover .cont_thumb {
  position:absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  bottom: 0;
  width:calc(100% - 1px);
  height: 100%;
  color:#fff;
  background-color: rgba(0,0,0,0.75);
}

.list_sidebar .cont_thumb .txt_thumb {
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  max-height: 76px;
  word-wrap: break-word; /* ie10 이하 */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;  
  line-height: 1.5;
  padding: 0 15px;
}

.list_sidebar .item_sidebar a {
  display: block;
  color: #555;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }

.area_popup .box_gnb,
.area_popup .box_sns,
.area_popup .add_link {
  display: none; }



/* calendar */
aside .box_calendar {
  max-width: 300px;
  margin: 0 auto;
  margin-bottom: 50px;
}

.box_calendar table.tt-calendar {
  border-collapse:collapse;
  
}

.box_calendar th,
.box_calendar td {
  border:1px solid #ededed;
  padding: 5px;
}

.box_calendar .cal_month a {color:#333;font-weight:bold;}
.box_calendar .cal_week2,
.box_calendar .cal_day_sunday  {color:#ff0000;}
.box_calendar .cal_day.cal_day4 {
  background-color: #f0f0f0;
}


/* profile */
aside .title_profile {
  background-color: #856eb2;
  width: 96px;
  margin: 0 auto;
  position: relative;
  padding-bottom: 3px;
  top: 15px;
  color: #fff;
  border-radius: 3px;
  font-size: 13px;
  letter-spacing: 2px;
}

aside .wrap_profile {
  border: 1px solid #856eb2;
  padding: 35px 30px 25px 30px;
  max-width: 300px;
  margin: 0 auto;
  border-radius: 3px;
  margin-bottom: 48px;
}

aside .profile_blog_img img {
  width: 100%;
}

/* footer */
#footer {
clear: both;
/* margin-top: 50px; */
padding: 30px 0;
border-top: 1px solid #ebebeb;
font-size: 14px;
line-height: 2.2;
}

#footer .inner_footer {
max-width: 1180px;
margin: 0 auto;
padding: 0 20px;
text-align: center;}

#footer .blog_title a,
#footer .copyright a {
  color:#555;
  text-transform:uppercase;
}


/* // footer */
/* area_paging */
.area_paging_wrap {margin: 50px 0;}
.area_paging_simple { display:none }
.area_paging{text-align:center}
.area_paging a {text-decoration:none;color:#1d8fd2;}

.area_paging .inner_paging span {
  display: inline-block;
  padding: 4px 12px 5px 12px;
  font-size: 14px;
  color:#555;
  border: 1px solid #ddd;
  line-height: 1.77;
}
.area_paging .inner_paging span.selected{
  color: #fff;
  background-color: #518071;
  border-color: #518071;
}
.area_paging .inner_paging span:hover:not(.selected) {
  background-color: #089d78;
  border-color: #089d78;
    color:#fff;
}

.area_paging .no-more-prev span,
.area_paging .no-more-next span {
  cursor:not-allowed;
  color:#ddd;
  border: 1px solid #eaeaea;
}


/* // area_paging */
/* area_view - 상세 페이지 */
.area_view {
  position: relative;
}

.area_view .area_article {
  padding: 60px 0; 
}

.area_view .article_header {
  position: relative;
  width: 100%;
  margin-bottom: 50px;
}


.area_view .article_header .inner_header {
  max-width: 820px;
  margin: 0 auto;
    padding:0 50px;
}
  
.area_view .article_header .info_text {
  color: #555;
  border-top: 3px solid #000;
  border-bottom: 1px solid #000;
  padding: 20px 0;
  text-align: center;
}

.article_content {
  max-width: 820px;
  margin: 0 auto;
    padding:0 50px;
}
#wrap_adsense_bottom .title_line {
  border-bottom: 1px solid #c6c6c6;
  font-size: 13px;
  margin: 30px 0 20px 0;  
}
.article_content .title_line {
  text-transform: uppercase;
  border-bottom: 1px solid #c6c6c6;
  font-size: 13px;
  margin: 30px 0 20px 0;
}

#wrap_adsense_bottom .title_line,
.article_content .title_line > span {
  /* padding: 3px 0; */
  position: relative;
  top: 0px;
  color: #000;
  font-weight: bold;
}

#wrap_adsense_bottom .title_line {
  margin: 0;
}

.area_tag .list_tag .desc_tag {font-size:0; margin:0;}    
.area_tag .list_tag .desc_tag a::before{
  background: #fff;
  border-radius: 10px;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
  content: '';
  height: 6px;
  left: 10px;
  position: absolute;
  width: 6px;
  top: 12px;
 }
.area_tag .list_tag .desc_tag a{
font-size: 13px;
background: #518071;
border-radius: 3px 0 0 3px;
color: #fff;
display: inline-block;
height: 32px;
line-height: 31px;
padding: 0 20px 0 23px;
position: relative;
margin: 0 10px 10px 0;
text-decoration: none;
}

.area_tag .list_tag .desc_tag a::after {
background: #fff;
border-bottom: 16px solid transparent;
border-left: 10px solid #518071;
border-top: 16px solid transparent;
content: '';
position: absolute;
right: 0;
top: 0;
}

.area_tag .list_tag .desc_tag a:hover {background-color:#089d78;}
.area_tag .list_tag .desc_tag a:hover::after {border-left-color:#089d78;}

/* area_related - 상세페이지 관련글 */
.area_related {
  overflow: hidden; }
.area_related a {
text-decoration: none; }
.area_related button {
border: 0;
border-radius: 0;
background-color: transparent;
cursor: pointer;
overflow: visible; }

.area_related .list_related {
list-style: none;
margin-left: -6px;
padding: 0;
border: none;
margin-bottom: 0;
box-sizing: border-box; }
.area_related .list_related:after {
  content: '';
  display: block;
  clear: both; }
.area_related .item_related {
  float: left;
  width: 25%;
  padding-left: 6px;
}
.area_related .link_related {
display: block;
}
.area_related .thumnail {
    background-image:url('./images/ico_no.svg');
    display: block;
    width: 100%;
    padding-top: 70%;
    background-size: cover;
    background-position: center;
    border-radius:3px;
}

.area_related .link_related .box_content {
  display: block;
  color: #555;
  font-size:13px;
  padding:10px 2px;
  line-height:20px;
}

.area_related .info {
  display:block;
  color: #555;
}

/* // area_related */
/* area_reply - 상세페이지 댓글*/
.area_reply {
  overflow: hidden;
}

.area_reply ul {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0; 
}

.area_reply li.item_reply::before {
  content: '';
  width: 1px;
  height: calc(100% + 29px);
  background-color: #d1d1d1;
  position: absolute;
  top: 25px;
  left: 0px;
}

.area_reply .rp_admin .user a,
.area_reply .guest_admin .user a {
    color: #856EB2 !important;
    font-weight: bold !important;
}

/* .area_reply li.item_reply:first-child::after {
  content: '';
  position: relative;
  top: 50px;
  width: 13px;
  height: 13px;
  display: block;
  background-color: #889e81;
  border-radius: 50%;
} */
.area_reply .wrap_form_dummy {height:0;}

.area_reply .wrap_form_dummy:first-child::before {
  content: '';
  display: block;
  width: 1px;
  height: 64px;
  position: relative;
  top: -20px;
  background-color: #d1d1d1;
}
.area_reply .wrap_form_dummy:first-child::after {
  content: '';
  display: block;
  width: 15px;
  height: 1px;
  position: relative;
  top: -21px;
  background-color: #d1d1d1;
}

.area_reply a {
text-decoration: none; }
.area_reply .box_reply_info {
margin: 40px 0 20px 0; }
.area_reply .reply_events {
color: #000; }
.area_reply .btn_more {
margin-top: 5px;
padding: 3px 0 0 15px;
border: 0;
background-color: transparent;
background-size: 10px 10px;
color: #07b7a2;
font-weight: bold;
cursor: pointer; }
.area_reply .item_reply {
position: relative;
}

.area_reply li:first-child {
padding-top: 0; }

/* .area_reply li:last-child {
border: none; } */

.area_reply .thumbnail_reply {
  float: left;
  width: 15px;
  height: 1px;
  position: relative;
  top: 25px;
  background-color: #d1d1d1;
  z-index: 1;
}

.area_reply .box_reply_content {
position: relative;
padding-left: 7px;
padding-bottom:20px;
font-size:13px;
overflow: hidden; }

.area_reply .item_reply .wrap_user {line-height: 1.5; margin: 6px 0 2px 0;}
.area_reply .item_reply .user {color: #555;font-size: 13px;margin-left: 3px;}
.area_reply .item_reply .user a {
display: inline-block;
font-weight: normal;
color: #555; }
.area_reply .item_reply .date {
display: inline-block;
}
.area_reply .item_reply .date a {
  padding-left: 4px;
  color:#777;
}

.area_reply .box_reply_content .txt::before {
  content: '';
  width: 0;
  height: 0;
  position: absolute;
  border: 8px solid;
  border-color: transparent #d1d1d1 transparent transparent;
  left: -8px;
  top: 17px;
}

.area_reply .box_reply_content .txt {
  margin: 0;
  color:#555;
  font-size:14px;
  background-color: #EDEDED;
  border: 1px solid #d1d1d1;
  display: inline-block;
  padding: 13px 20px;
  border-radius: 3px;
  line-height: 1.7;
}

.area_reply .box_reply_content .txt::after {
  content: '';
  width: 0;
  height: 0;
  position: absolute;
  border: 8px solid;
  border-color: transparent #EDEDED transparent transparent;
  left: -6px;
  top: 17px;
}

.area_reply .box_reply_content .txt_rp2::before {
  border-color: transparent #6b8e82 transparent transparent;
}

.area_reply .rp2 .txt {
  color:#fff;
  background-color: #6b8e82;
  border: 1px solid #6b8e82;
}

.area_reply .box_reply_content .txt_rp2::after {
  border-color: transparent #6b8e82 transparent transparent;
}

.area_reply .modify {margin-left:3px; margin-top: -5px;}

.area_reply li a {
color: #555; }
.area_reply .modify .slash {
color: #e1e1e1; }
.area_reply .list_reply_comment {
position: relative;
}

.area_reply .list_reply_comment li {
  position:relative;
}

.area_reply .item_comment::before {
  content: '';
  width: 55px;
  height: 1px;
  background: #d1d1d1;
  position: absolute;
  top: 25px;
  left: -52px;
}

.area_reply .item_comment {
  margin-left: 50px;
}

.area_reply .box_comment_list {
  position: relative;
    margin-bottom: 10px;
}

.area_reply .wrap_form {
    position: relative;
    background-color:#f7f7f7;
    border: 1px solid #c7cacb;
    padding: 10px;
    margin-left: 16px;
    border-radius:3px;
    left: 6px;
    top: 0px;
  margin-right: 7px;
}
.area_reply .wrap_form::before {
    content: '';
    width: 0;
    height: 0;
    position: absolute;
    border: 8px solid;
    border-color: transparent #c7cacb transparent transparent;
    left: -16px;
    top: 34px;
}
.area_reply .wrap_form::after {
    content: '';
    width: 0;
    height: 0;
    position: absolute;
    border: 8px solid;
    border-color: transparent #f7f7f7 transparent transparent;
    left: -14px;
    top: 34px;
}
.area_reply .reply_write {
  position:relative;
}
.area_reply .reply_write:after {
content: '';
display: block;
clear: both; }
.area_reply .form_content {
padding-bottom: 10px; }
.area_reply .form_content textarea {
width: 100%;
height: 121px;
padding: 15px 20px;
border: 1px solid #e0e0e0;
border-radius:3px;
line-height:1.6;
vertical-align: top; }
.area_reply .form_guest {
margin: 0 -4px;
float:left;
}
.area_reply .form_guest:after {
  content: '';
  display: block;
  clear: both; }
.area_reply .box_inp {
float: left;
width: 100%;
}
.area_reply .box_inp:nth-child(-n+2) {
width: 200px; }
.area_reply .inner_inp {
background-color:#fff;
margin: 0 4px;
border: 1px solid #e0e0e0;
border-radius:3px;
box-sizing: border-box;
height: 48px;
line-height: 3.4;
padding-left: 20px;
}
.area_reply .inner_inp input {
width: 150px;
border: none;
font-size: 14px;
line-height: 1.25;}
.area_reply .form_reg {
text-align: right; }
.area_reply .form_reg label {
display: inline-block;
margin-right: 20px;
padding-top: 7px;
}

.area_reply .secret_chk {
  float: left;
    margin-left: 30px;
    line-height: 3.3;
}

.area_reply .form_reg label input {
  vertical-align: -1px;
}

.area_reply .btn_register {
  width: 124px;
  height: 48px;
  color: #fff;
  font-weight: bold;
  border-radius: 3px;
  letter-spacing:1px;
  background-color:#518071;
  border: 1px solid #518071;
  cursor: pointer; 
}

.area_reply .btn_register:hover {
  background-color:#089d78;
  border: 1px solid #089d78;
}
.area_reply .reply_content_guest {margin-top:20px;}

/* // area_reply */
/* area_common - 티스토리 사이드바 공통 영역 */
.area_common {
  max-width: 1020px;
  min-height: 200px;
  margin: 0 auto;
  padding:0 50px;
  counter-reset:li_cnt;
}

.area_common_guest {max-width: 820px;padding:0 50px 60px 50px;}

.area_common .wrap_title {
  padding: 50px 0;
}

.area_common .title_common {
  font-size: 30px;
  font-weight: normal;
  color: #333;
  text-align: center;
  letter-spacing: 1px;
}
.area_common .title_desc {
  text-align: center;
  position: relative;
  top: -7px;
}
  
 /* TAG  */
.area_common .wrap_cloud {
  text-align:center;
} 

.area_common .wrap_cloud span {
  width: 60px;
  display: inline-block;
  text-align: center;
  font-size: 12px;
  color: #fff;
  line-height: 1.4;
}

.area_common ul {padding:0;}
.area_common li.li_tag {
  display:inline-block;
  max-width:300px;
  width:50%;
  line-height: 2.2;
}

.area_common li.li_tag::before {
  display: inline-block;
  counter-increment: li_cnt;
  content: counter(li_cnt);
  font-size: 15px;
  font-family: "Helvetica Neue","Apple SD Gothic Neo";
  width: 46px;
  color: #ddd;
  font-weight:bold;
  text-align: right;
  position: absolute;
  font-size: 13px;
  line-height: 40px;
  padding-right: 8px;
}
/* li_tag_cnt */
.area_common li.li_tag:hover::before {
  content:'#';
  color:#555;
  font-size:18px;
}

.area_common li.li_tag::after {
  content:'';
  clear:both;
  display:block;
}

.area_common li.li_tag a {
  display:inline-block;
  max-width:250px;
  color:#fff;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  text-decoration:none;
  margin-left: 46px;
  padding:4px 10px 5px 10px;
  border-radius:3px;
}

.cloud1 {background-color:#856eb2;} 
.cloud2 {background-color:#ca74b0;}
.cloud3 {background-color:#fe819b;}
.cloud4 {background-color:#ff9f7e;}
.cloud5 {background-color:#ffca69;}

/* 미디어 로그 티스토리 스타일 수정 */
#mediaLogNest {
  max-width: 1180px;
  height: auto !important;
  margin: 200px auto 0 auto;
  padding: 0 20px; }

.item-thumbnail {
  background: #e9e9e9 url(./images/ico_no.svg) no-repeat center;
}
.no-img {
  background: #e9e9e9 url(./images/ico_no.svg) no-repeat center !important;
  background-size: 30px 30px !important; }

.btn-for-guest {
  display: none; }

.btn-for-user {
  display: none; }

/* area_cover */
.area_cover a {
text-decoration: none; color:#555;}
.area_cover button {
border: 0;
border-radius: 0;
background-color: transparent;
cursor: pointer;
overflow: visible; }

/* // area_cover */
/* title_section */
.title_section {
  position: relative;
  width: 100%;
  margin: 0 0 20px 0;
  font-size: 22px;
  font-weight: bold;
  color: #333;
}

/* 
  cover 공통
 */
.area_cover .catedate {
  margin:12px 0 6px 0;
}
.area_cover .catedate::after {
  content: '';
  clear: both;
  display: block;
}
.area_cover .cate {
  float:left;
  font-size:12px;
  font-weight: bold;
  background-color: #889E81;
  padding: 0 6px;
  letter-spacing: -0.5px;
}
.area_cover .cate a {color:#fff;}
.area_cover .date {
  font-size:13px;
  float:right;
}
.area_cover .title {
  display: block;
  color:#000;
  font-size: 20px;
  font-weight:bold;
  line-height: 1.4;
  letter-spacing: -1px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; }
.area_cover .text {
  max-height: 70px;
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.6;
  word-break: keep-all;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

/* type_featured - 슬라이드 커버 */
.thema_apply .slick-active button {
  background: #ff567a;
}
.type_featured {
  position: relative;
}
.type_featured:after {
  content: '';
  display: block;
  clear: both; 
}
.type_featured .slide_zone {
  position: relative;
  width: 100%;
  height: auto; 
}
.type_featured .inner_main_slide {
  position: absolute;
  left: 0;
  right: 0;
  bottom:30px;
  max-width: 1000px;
  margin: 0 auto;
}
.type_featured .box_arrow {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 100%;
  margin-top: -26px;
  z-index: 10;
  box-sizing: border-box; 
}
.type_featured .btn_arrow {
  width: 52px;
  height: 52px;
  padding-top: 4px;
  background-repeat: no-repeat;
  background-position: center;
  transition: .2s ease-out; 
  border: 1px solid #b3b3b3;
}
.type_featured .btn_arrow:hover {
  background-color:#ededed;
}
.type_featured .btn_prev {
  float: left;
  position: relative;
  left: -30px;
  background-size: 14px 14px;
  background-image: url(./images/arr_left.svg); 
}
.type_featured .btn_next {
  float: right;
  position: relative;
  right: -30px;
  background-size: 14px 14px;
  background-image: url(./images/arr_right.svg); 
}
.type_featured .btn_prev:focus {outline:none;}
.type_featured .btn_next:focus {outline:none;}
.type_featured .slide_item {
  z-index: 1;
  overflow: hidden; }
.type_featured .link_slide {
  position: relative;
  display: block;
  width: 100%;
  padding-top:100%;
  background-size: cover;
  background-position: 50% 50%;
  overflow: hidden;
  z-index: 1; }


  
.type_featured .slide_page {
  position: relative;
  font-size: 0;
  text-align: center;
  padding:0;
  z-index: 10; }
.type_featured .slide_page li {
  display: inline-block; }
.type_featured .ico_circle {
  width: 10px;
  height: 10px;
  margin: 0 3px;
  padding: 0;
  border-radius: 10px;
  background: #d1d1d1;
  cursor: pointer;
  outline: none;
}

/* type_post - 갤러리 커버 */
.type_post {
  max-width: 1100px;
  margin: 0 auto;
  padding:50px 20px;
  overflow: hidden; 
}
  .type_post:after {
  content: '';
  display: block;
  clear: both;
}

.type_post .list_post,
.category_type_post .list_category {
  margin-left:-1px;
  padding: 0;
  list-style: none; 
}

.list_post .item_post,
.category_type_post .item_category {
  float: left;
  width: 25%;
  padding-left: 2px;
  margin-bottom: 2px; 
}

.list_post {/* counter-reset:pop_rank_main; */position:relative;}
/* .type_post .cnt_item_post::before {
  counter-increment:pop_rank_main;
  content:counter(pop_rank_main);
}
.type_post .cnt_item_post {
    position: absolute;
    background-color: rgba(38, 138, 225, 0.9);
    top: 0px;
    left: 0px;
    color: #fff;
    font-size: 13px;
    width: 30px;
    height: 30px;
    font-weight: bold;
    z-index: 1;
    text-align: center;
    border-right: 1px solid #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
} */

/* .type_post:nth-child(odd) .item_post .cnt_item_post {
  background-color: rgba(79, 175, 84, 0.9);
} */

.list_post .link_post,
.category_type_post .link_category {
  position: relative;
  display: block;
  /* margin: 0 10px; */
  padding-top: 100%;
  background-size: cover;
  background-position: 50% 50%; 
}


.list_post .item_post:hover .link_post:before,
.category_type_post .item_category:hover .link_category:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.90); 
}

.list_post .info .date,
.category_type_post .date {
  display: none;
  margin-top: 40px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.31; 
}

.list_post .link_post:hover .info,
.category_type_post .link_category:hover .info {
  display: flex; }

.list_post .link_post .info,
.category_type_post .link_category .info {
  position: absolute;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  top: 0;
  width: 100%;
  height: 100%;
  color: #fff;
  text-align: center;
  letter-spacing: -1px;
}

.list_post .link_post .info .name,
.category_type_post .link_category .info .name {
  display: block;
  width: 85%;
  max-height: 75px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical; 
}


/* type_card - 섬네일 커버*/
.type_card {
  max-width: 1100px;
  padding:50px;
  margin: 0 auto;
  overflow: hidden; }
.list_type_card:after {
    content: '';
    display: block;
    clear: both; }

.list_type_card {
  padding: 0;
  margin: 0 -10px;
  list-style: none;
}

.list_type_card .item_card {
  float:left;
  width: 25%;
  padding: 0 10px;
}

.list_type_card .thumnail {
  display: block;
  width: 100%;
  padding-top: 75%;
  background-size: cover;
  background-position: 50% 50%; }


/* type_banner - 와이드패널 커버 */
.type_banner {
  max-width: 1100px;
  padding:50px;
  margin: 0 auto; }

.list_type_banner {
  margin: 0;
  padding: 0;
  list-style: none; }

.list_type_banner .link_banner {
  position: relative;
  display: block;
  height: 280px;
  font-size: 24px;
  color: #333;
  background-size: cover;
  background-position: 50% 50%;
  transition: all .2s ease-out; }

.list_type_banner li:nth-child(even) .box_content {
  float: right;
  text-align: right; }

.list_type_banner .box_content {
  width: 70%;
  padding: 47px 45px 50px 48px; }
.list_type_banner .item_banner {margin-bottom:1px;}

.list_type_banner .link_banner strong {
  display: block;
  max-height: 58px;
  line-height: 1.4;
  font-size: 38px;
  font-weight: bold;
  color: #fff;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical; }

.list_type_banner .link_banner .text {
  max-height: 80px;
  margin: 12px 4px 0 2px;
  font-size: 16px;
  color: #fff;
  line-height: 1.62;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical; }

/* type_notice - 리스트 커버 */
.type_notice {
  max-width: 1100px;
  padding:50px;
  margin: 0 auto; }
.type_notice:after {
content: '';
display: block;
clear: both; }

.type_notice .thumnail,
.category_type_notice .thumnail {
  float: left;
  display: block;
  width: 100px;
  height: 100px;
  margin-right: 24px;
  background-size: cover;
  background-position: 50% 50%; }

.type_notice .info img,
.category_type_notice img {
  padding: 0 !important;
  margin-left: 10px;
}

.area_cover .type_notice .catedate {margin: 0px 0 6px 0;}
.type_notice .title {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: block;
}
.type_notice .text {margin-top: 10px;}
.type_notice .date {float: left; margin-left: 7px;line-height: 1.6;}
.type_notice .info,
.category_type_notice .info {
  overflow: hidden; }

.list_type_notice::after {
  content:'';
  clear:both;
  display:none;
}
.list_type_notice,
.category_type_notice .list_category {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: solid 2px #333; }

.list_type_notice:after,
.category_type_notice .list_category:after {
  content: '';
  display: block;
  clear: both;
}

.list_type_notice .item_notice,
.category_type_notice .item_category {
  padding: 5px 0;
}

.list_type_notice .item_notice,
.category_type_notice .item_category {
  border-bottom: 1px solid #ebebeb; 
}
  
.list_type_notice .item_notice:after,
.category_type_notice .item_category:after {
  content: '';
  display: block;
  clear: both; 
}

.list_type_notice .link_notice,
.category_type_notice {
  display: block;
  color: #555;
  max-width: 1000px;
  margin: 0 auto;
  margin-bottom: 0px;
  padding: 50px 50px 0 50px;
}

.category_type_notice strong {
  display: block;
  font-size: 18px;
  font-weight: normal;
  color: #333;
  line-height: 32px;
  letter-spacing: -1px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.category_type_notice .text {
  font-size: 14px;
  line-height: 1.8;
  margin: 6px 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  color: #555;
 }


.category_type_notice .cate {
  color: #555;
  font-size: 13px;
}

.category_type_notice .date {
  font-size: 13px;
  line-height: 20px;
}

.category_type_notice .item_category:after {
  content: '';
  display: block;
  clear: both; }

/* area_category */

.area_category a {
  text-decoration: none;
  color: #555;
}

.area_category ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border: none;
  box-sizing: border-box; }

.area_category .title_section span {
  padding-left: 8px;
  font-size: 16px;
/*  vertical-align: 2px; */ }

 .category_type_notice,
.category_type_post {
  margin-bottom: 60px; }

/* category_type_post - list_category */
.category_type_post .list_category:after {
  content: '';
  display: block;
  clear: both; }

.category_type_notice .link_category {
  background: none !important; }

.category_type_post .link_category .text {
  display: none; }

/* type_related */
.category_type_related .list_category {
  list-style: none;
  margin: 0 -8px;
  padding: 0;
  border: none;
  box-sizing: border-box;
  font-size: 0; }

.category_type_related .thumnail {
  display: block;
  width: 100%;
  padding-top: 50%;
  background-size: cover;
  background-position: 50% 50%; }

.category_type_related .item_category {
  display: inline-block;
  width: 33.3%;
  margin-bottom: 54px;
  vertical-align: top; }

.category_type_related .link_category {
  display: block;
  padding: 0 8px;
  background: none !important;
  color: #333; }

.category_type_related .box_content {
  width: 100%; }

.category_type_related .link_category strong {
  display: block;
  margin: 18px 0 6px 0;
  line-height: 28px;
  font-size: 18px;
  color: #333;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; }

.category_type_related .link_related .info {
  display: inline-block;
  margin-top: 20px;
  font-size: 14px;
  color: #888;
  line-height: 1.71; }

.category_type_related .link_category .text {
  max-height: 70px;
  margin: 0 0 13px 0;
  font-size: 14px;
  line-height: 20px;
  overflow: hidden;
  opacity: 0.7;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  width: 95%;}

.category_type_related .link_category .date {
  display: block;
  font-size: 13px;
  line-height: 20px;
  color: #888; }


/* // area_category */
/* // category_type_post - list_category */

/* area_index_category */
.area_index_category a {
  text-decoration: none; }

.area_index_category .list_category {
  list-style: none;
  border: none;
  box-sizing: border-box; }
/* // area_index_category */
.area_view .article_header .title_post {
  display: block;
  font-size: 30px;
    color: #000;
  line-height: 1.5em; 
  letter-spacing: -1px;
}
.area_view .admin {
margin: 50px 0;
text-align: center;
}

.area_view .admin a {
  border: none;
  color:#555;
}
.area_view .article_header .info {
  margin: 5px 0 0 0;
  font-size: 14px;
  color:#555;
}

.area_view a.link_cate {
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  letter-spacing: -0.5px;
  background-color: #518071;
  padding: 1px 5px;
}

.area_view a.link_cate:hover {
  background-color: #089d78;
}

.area_view .txt_post {
  height: 160px;
  margin: 40px 0 30px 0;
  }

/* area_view - area_post_btn */
.area_view .article_modify {
  padding-bottom: 13px;
  border-bottom: 1px solid #eee; }

.area_view .article_modify:after {
  content: '';
  display: block;
  clear: both; }

.area_view .list_share {
  margin: 60px 0 48px 0;
  font-size: 0;
  text-align: center; }

.area_view .list_share:after {
  content: '';
  display: block;
  clear: both; }

.area_view .list_share .item_share {
  display: inline-block;
  margin-right: 12px;
  list-style: none; }

.area_view .list_share .link_share {
  display: flex;
  -ms-display: flexbox;
  /* IE 10 */
  display: -webkit-flex;
  /* Safari */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(0, 0, 0, 0.25);
  border-radius: 48px;
  font-size: 28px;
  color: rgba(0, 0, 0, 0.54);
  text-decoration: none;
  text-align: center; }

.area_view .article_modify .box_util {
  float: left; }

.area_view .article_modify button {
  background: none;
  padding: 5px;
  border: 0;
  border-radius: 0;
  overflow: visible; }

.area_view .article_modify i {
  display: inline-block;
  width: 14px;
  height: 14px;
  background: url(http://t1.daumcdn.net/tistory_admin/static/admin/editor/ico_postbtn.png) no-repeat;
  overflow: hidden;
  vertical-align: top; }

.area_view .article_modify .btn_like {
  padding-right: 10px;
  background: url(images/ico_dot.gif) no-repeat center right;
  line-height: 14px; }

.area_view .article_modify .btn_share {
  margin-top: 15px; }

.area_view .article_modify .btn_like .icon {
  background-position: 0 0; }

.area_view .article_modify .btn_like .icon_like {
  background-position: -20px 0; }

.area_view .article_modify .btn_share .icon {
  margin-top: 1px;
  background-position: -40px 0; }

.area_view .article_modify .box_ccl {
  float: right;
  padding-top: 20px; }

/* area_view - box_ccl */
.area_view .box_ccl .link_ccl {
  display: inline-block; }

.another_category {
  display: none; }

.article_view {
  max-width: 820px;
  margin: 0 auto;
    padding: 0 50px;
}

.article_view a {
  text-decoration: none;
  color: #2d81ca;
}
.article_view a:hover {
  border-bottom: 1px solid #2d81ca;
}

/***********************
    파일 다운로드 - 구에디터 -
************************/
/* .article_view .imageblock {
    border: 1px solid #c7cacb;
    border-radius:3px;
    height: 60px !important;
    position:relative !important;
} */
.article_view .imageblock > a[href*="attachment"] > img {
    display:none;
}
.article_view .imageblock > a[href*="attachment"]::before {
    content:"";
    background-image:url('./images/ico_download.svg');
    background-repeat:no-repeat;
    background-position:center;
    background-size:24px 24px;
    display:inline-block;
    width:64px;
    height:58px;
    margin-right: 10px;
    background-color: #f7f7f7;
    border-right: 1px solid #e9e9e9;
    vertical-align:middle;
}
.article_view .imageblock > a[href*="attachment"] {
    border-bottom:none;
    padding-right: 15px;
    color: #777;
    display:block;
    height: 60px;
    border: 1px solid #e9e9e9;
}

.article_view .imageblock > a[href*="attachment"]:hover::before {
    background-color:#f0f0f0;
}

/***********************
    파일 다운로드 - 신버전 -
************************/
.article_view .fileblock {
    height: 66px !important;
    margin: 15px 0 15px 0 !important;
    width: 100% !important;
    border: 1px solid #dfdfdf !important;
  border-left: 6px solid #888  !important;
    background-color: #f9f9f9;
}
.article_view .fileblock .image {
    background-image: none !important;
}
.article_view .fileblock a{border-bottom: none;height:auto !important;}
.article_view .fileblock a::after {top: 17px !important; left:15px !important;}
.article_view .fileblock .name {height:auto !important;max-width:99% !important;}
.article_view .fileblock .size {display:none;}

.article_view h1 {font-size:30px; color:#000; margin: 10px 0;}
.article_view h2 {font-size:26px; color:#000; margin: 10px 0;}
.article_view h3 {font-size:24px; color:#000; margin: 10px 0;}
.article_view h4 {font-size:19px; color:#000; margin: 10px 0;}

.article_view h1,
.article_view h2,
.article_view h3,
.article_view h4 {
  letter-spacing: -0.7px;
}

.article_view {
  counter-reset: cnt-h3;
}


.article_view .contents_style h3::before {
  counter-increment: cnt-h3;
  content: counter(cnt-h3) ".";
  padding-right: 5px;
}

.article_view .contents_style h3 {
  counter-reset: cnt-h4;
}

.article_view .contents_style h4::before {
  counter-increment: cnt-h4;
  content: counter(cnt-h3) "." counter(cnt-h4);
  padding-right: 5px;
}

.article_view .contents_style h4 {
  counter-reset: cnt-h5;
}

.article_view .contents_style h5::before {
  counter-increment: cnt-h5;
  content: counter(cnt-h3) "." counter(cnt-h4) "." counter(cnt-h5);
  padding-right: 5px;
}

.article_view .hTagBefore h3::before,
.article_view .hTagBefore h4::before,
.article_view .hTagBefore h5::before {
  display: none;
}

/* .article_view .view_tocLevel_1::before {
  content: " ";
  display: block;
  width: 70px;
  height: 1px;
  margin-bottom: 7px;
  background-color: #999;
}
 */
/* .article_view .view_tocLevel_2::before {
    display: inline-block;
    content: '■';
    width: 9px;
    height: 18px;
    margin-right: 10px;
    font-size: 12px;
    position: relative;
    top: -4px;
} */


.article_view blockquote {
  font-size: inherit !important;
  text-align: justify !important;
  color:#555 !important;
  border: 1px solid #dfdfdf !important;
  border-left: 6px solid #dfdfdf !important;
  background: none !important;
  background-color: #F8F8F8 !important;
  padding: .75rem !important;
  margin: .75rem 0 !important;
}

blockquote, blockquote p {
  font-size: inherit !important;
  color: #555 !important;
  line-height: 1.8 !important;
  }



.article_view blockquote[data-ke-style="style3"]::before {
    content: '';
    width: 90%;
    height: 10px;
    background-color: #fff;
    display: block;
    position: relative;
    top: -25px;
    margin: 0 auto;
}

.article_view blockquote[data-ke-style="style3"] {
    position: relative;
    border: 10px solid #ddd !important;
    padding: 15px 30px !important;
    background-color: #fff !important;
    margin: 0;
    font-size: inherit;
}

.article_view blockquote[data-ke-style="style3"]::after {
    content: '';
    width: 90%;
    height: 10px;
    background-color: #fff;
    display: block;
    position: relative;
    bottom: -25px;
    margin: 0 auto;
}


.article_view blockquote ol:last-child,
.article_view blockquote ul:last-child,
.article_view blockquote p:last-child { margin-bottom:0 }


.article_view ul,
.article_view ol {
  margin: 0;
  padding: 0 0 0 19px; }

.article_view ul li {
  line-height: 1.8;
  word-break: break-all; }

.article_view ol li {
  line-height: 1.8;
  word-break: break-all; }

.article_view figure {
  margin: 0; }

.article_view figure figcaption {padding-top:0;}

.article_view table {
  border: 1px solid #dadce0;
  border-collapse: collapse; }

.article_view table thead tr {
  background: rgba(0, 0, 0, 0.05);
}
.article_view table tr th {font-weight: normal;}
.article_view table tr th,
.article_view table tr td {
  padding: 7px;
  border-left: 1px solid #dadce0; }

.article_view table tr {
  border-bottom: 1px solid #dadce0; }

.article_view pre {
  background: rgba(0, 0, 0, 0.05);
  white-space: pre-wrap; }

.article_view pre code {
  padding: 10px;
  line-height: 1.3;
  max-height:720px;
  white-space: pre;
  border-radius: 0;
}

.article_view pre code .hljs-ln, 
.article_view pre code .hljs-ln tr, 
.article_view pre code .hljs-ln td {
  border: none !important;
  padding: 0 10px 0 0 !important ;
}

.article_view .hljs-comment, .hljs-quote {
  font-style: normal;
}

.article_view .cap1 {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.54); }

.article_view hr {
  margin: 30px 0; }

.article_view .moreless_fold span,
.article_view .moreless_top span {
  line-height: 2.5; }

.article_view .moreless_top {
  border-bottom: 1px solid rgba(0, 0, 0, 0.15); }

.article_view .moreless_bottom {
  border-top: 1px solid rgba(0, 0, 0, 0.15); }

.article_view .moreless_bottom span {
  display: none; }
  
.article_view .moreless-content {
    border-top: 1px solid #78C0A8;
    padding: 10px 20px;
    background-color: #EDEDED;
}

.article_view .btn-toggle-moreless {
    background-color: #78C0A8 !important;
    color: #fff !important;
    font-size: 13px !important;
    border-bottom: none !important;
    padding: 0 10px !important;
    width: 60px !important;
    display: block;
    text-align: center;
}
  

.article_view .footnote a {
  text-decoration: none; }

.article_view .footnotes li {
  font-size: 12px;
  color: #888; }

.article_view .table-overflow {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; }

.article_view .table-overflow {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; }

.article_view img {
  max-width: 100%; }

/* 보호글 비밀번호 입력 */
.protected_form input{
  border: 1px solid #e1e1e1;
    padding: 9px 14px;
    font-size: 14px;
  width: 220px;
}
.wrap_protected {
  text-align:center;
  margin: 150px 0;
}
.wrap_protected .ico_protected {
  background-image:url("./images/ico_protected.svg");
  background-repeat:no-repeat;
  background-size:24px 24px;
  background-position:50% 45%;
  background-color:#e01b6a;
  border-radius:50%;
  width:46px;
  height:46px;
  margin:0 auto;
}
.wrap_protected .btn_confirm {
  background-color: #777;
  border: 1px solid #777;
  padding: 9px 20px;
  color: #fff;
  width: 75px;
}

/* youtube 동영상 반응형 스킨 대응 구버전 에디터 */
.embedcon { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embedcon iframe, 
.embedcon object,
.embedcon embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* 커버 미사용시 리스트 */
.list_index a {
  text-decoration: none;
}
.list_index {
  margin-bottom: 0;
  margin-top: 0;
  padding: 0 50px;
}

.list_index:first-child {
  /* margin-top: 168px; */
  margin-top: 50px;
}
.list_index:last-child {
  margin-bottom: 60px;
}

/* 커버 미사용시 리스트-블로그형 */

.list_index.category_type_related {
  display: inline-block;
  width: 33.3%;
  margin-left: -2px;
  margin-right: -2px;
}

.list_index.category_type_related:first-child{
  margin-top:200px
}

.list_index.category_type_related:last-child{
  margin-bottom:0
}


.list_index.category_type_related .item_category {
  width: 100%;
}

/* absent_post */
.area_view .absent_post{
  margin-top:240px
}




/******************
*
*   TOC (table of content)
*
*******************/

.wrapTocShow {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: 220px;
  background-color: #fbfbfb;
  border-left: 1px solid #dfdfdf;
  z-index: 10;
}

.wrapTocShow > #toc-elements {
  display: block;
  width: 220px;
  margin: 0 auto;
}

.wrapTocHide {
  position: fixed;
  right: 40px;
  top: 0;
}
/* .wrapTocHide #tocTitle {display:none;} */
.wrapTocHide > #toc-elements,
.wrapTocHide #wrapTocInnerBox {
  display:none;
}

.wrapTocHide #tocTitleToggle {
  top: 9px;
  right: -30px;
  background-color: #000;
}

#wrapTitle {
  padding: 5px 0;
  color: #868686;
  letter-spacing: 2px;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
}
.wrapTocHide #wrapTitle {color: #000;}

#tocTitleToggle {
  position: absolute;
  top: 9px;
  right: 10px;
  width: 16px;
  height: 16px;
  display: block;
  border-radius: 2px;
  background-color: #b9b9b9;
  cursor: pointer;
}
#tocTitleToggle::before {
  content: '';
  position: absolute;
  width: 80%;
  top: 8px;
  left: 2px;
  height: 1px;
  background: #fff;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#tocTitleToggle::after {
  content: '';
  position: absolute;
  width: 80%;
  top: 8px;
  left: 2px;
  height: 1px;
  background: #fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}


.toc-app-common {
  display: inline-block;
}

.wrapTocShow .items {
  overflow: auto;
  counter-reset:cnt-toc-lv1;
}

.wrapTocShow .items::-webkit-scrollbar {
    display: none !important;
}


/* .wrapTocShow .toc-app-common::before {
  display: block;
    width: 1px;
    height: calc(100% - 69px);
    background-color: #ddd;
    position: absolute;
    top: 46px;
    left: 16px;
    content: '';
} */


.toc-common {
  position: relative;
  display: block;
  cursor: pointer;
  color: #555;
  font-size: 12px;
  line-height: 1.6;
  padding: 7px 10px 7px 0;
  border-top: 1px dotted #ddd;
}

/* #toc-0 {margin-top:0;} */

.toc-level-1 {
  counter-reset:cnt-toc-lv2;
  padding-left: 36px;
}

.toc-level-1::before {
  counter-increment: cnt-toc-lv1;
  content: counter(cnt-toc-lv1, decimal-leading-zero) ".";
  text-align: right;
  display: inline-block;
  /* width: 18px; */
  font-family: "Helvetica Neue","Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",Dotum,"돋움",sans-serif;
  font-weight: bold;
  color: #729292;
  position: relative;
  margin-left: -26px;
  padding-right: 5px;
  letter-spacing: 1px;
}
.toc-level-2::before {
  counter-increment:cnt-toc-lv2;
  content:counter(cnt-toc-lv1) '.' counter(cnt-toc-lv2);
  margin-right: 6px;
  font-family: "Helvetica Neue","Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",Dotum,"돋움",sans-serif;
  font-weight: bold;
  color: #729292;
  position: relative;
  margin-left: -26px;
  letter-spacing: 1px;
}
.toc-level-2 {
    padding-left:62px;
}


.toc-level-3::before {
    content: '・';
    margin-right: 6px;
}
.toc-level-3 {font-size:13px; padding-left:59px;}
.toc-level-4 {font-size:13px; padding-left:70px;}

#wrapToc .toc-level-wrap .toc-level-1::before, 
#wrapToc .toc-level-wrap .toc-level-2::before {
  display: none;
}
#wrapToc .toc-level-wrap .toc-level-1 {
  padding-left: 15px;
}
#wrapToc .toc-level-wrap .toc-level-2 {
  padding-left: 35px;
}

.toc-active::before {
  color: #fff;
}

.toc-active {
  color: #fff;
  background-color: #856EB2;
}
.toc-common:hover,
.toc-common:hover::before {
  color: #fff;
  background-color: #856EB2;
}
/* .toc-parent-active {
    background-color: #e1e1e1;
} */

#wrapTocInnerBox {
  text-align: center;
  color: #ddd;
  margin-top: 50px;
}

#tocInnerBox1, 
#tocInnerBox2 {
  display: block;
    /* background-color: #f0f0f0; */
  margin: 10px auto;
    width: 200px;
  height: 230px;
}


/******************
*
*   media screen size
*
*******************/
/* @media screen and (max-width: 1220px) {
   .type_featured .box_arrow {
    display: none;
  } 
} */

/***************** 
    mobile 1220px 
******************/
@media screen and (max-width: 1220px) {

    .article_view h1 {font-size:32px; color:#000; margin: 10px 0}
    .article_view h2 {font-size:30px; color:#000; margin: 10px 0}
    .article_view h3 {font-size:28px; color:#000; margin: 10px 0}
    .article_view h4 {font-size:21px; color:#000; margin: 10px 0;}

  .noAds_gb_exp, 
  .noAds_side_exp {
    font-size: 15px;
  }

  /* TOC */
  .toc-level-1,
  .toc-level-2,
  .toc-level-3,
  .toc-level-4 {
    font-size:18px;
  }
  .wrapTocShow {
    top: 50px;
    bottom: auto;
    width: 100%;
    height: 100%;
    border: none;
    left: 0;
  }

  .wrapTocShow > #toc-elements {
    width: 100%;
    max-height: calc(100% - 116px);
  }

  .wrapTocShow .toc-app-common::before {
    left: 17px;
    height: calc(100% - 95px);
    top: 64px;
  }

  .wrapTocShow #wrapTocInnerBox {
    display: none;
    /* position: fixed;
    bottom: 0;
    z-index: 20;
    background-color: #fff;
    display: block;
    height: 220px;
    left: 0;
    right: 0;
    padding: 10px 0 0 0;
    margin: 0;
    border-top: 1px solid #ddd; */
  }

  #wrapTitle {
    font-size: 18px;
    margin: 10px 0;
  }

  .wrapTocHide #wrapTitle {
    width: 26px;
    height: 24px;
    border-radius: 3px;
    background-color: transparent;
    border: 2px solid #fff;
        position: fixed;
        top: 3px;
        right: 83px;
    padding: 0;
  }
  .wrapTocHide #tocTitle {
    display:none;
  }

  .wrapTocHide {
    right: 174px;
    margin-right: 0;
    top: -4px;
    bottom: auto;
    z-index: 20;
  }
  
    .wrapTocShow #tocTitleToggle {
    top: 23px;
    right: 20px;
    padding: 0 2px;
    background-color: #888;
    width: 19px;
    height: 17px;
    }

  .wrapTocHide #tocTitleToggle::before,
  .wrapTocHide #tocTitleToggle::after {
    content: none;
  }

  .wrapTocHide #tocTitleToggle {
    background-image: url("./images/ico_list.svg");
    background-repeat: no-repeat;
    background-size: 12px 12px;
    width: 20px;
    height: 20px;
    background-position: 0px 4px;
    font-size: 0;
    display: block;
        top: 0;
        right: -3px;
        background-color: transparent;
  }

  .toc-common {
    padding: 7px 20px;
  }

  .toc-level-1::before,
  .toc-level-2::before {
    top: 0;
  }

  .toc-level-1::before {
    margin-left: -36px;
    padding-right: 7px;
  }  

  .toc-level-1 {
    padding-left: 57px;
  }  

  .toc-level-2::before {
    margin-left: -32px;
  }

  .toc-level-2 {
    padding-left: 89px;
  }

  .wrapTocShow .items {
    max-height: none;
  }


  /* container padding */
  .white .area_cover {margin-top:80px;}
  .white .type_featured {padding:40px;}
  .type_post {padding:40px 40px 0 40px;}
  .type_card {padding:40px;}
  .type_banner {padding:40px;}
  .type_notice {padding:40px;}
  .list_index {padding: 0 40px;}
  .article_view {padding:0 40px; max-width: 800px; line-height:1.7;}
    .article_view ol li {line-height: 1.7;}
  .article_content {padding:40px; max-width: 800px;}
  .area_paging_wrap {padding:40px; max-width: 800px;}
  .area_view .article_header .inner_header {padding:40px 40px 0 40px;max-width: 800px;}
  .type_featured .slide_zone {height: auto;}

  /* adsense */
  /* .adsense_top_left {width: 300px; height: 250px;}
  .adsense_top_right {width: 300px; height: 250px;} */
  
  /* top design */
  .mobile_bag {
    position:fixed;
    z-index:15;
    background-color:#2d3d4d;
    box-shadow:0 10px 30px 0 rgba(18, 73, 223, 0.08);
    display:block;
    padding-bottom: 50px;
    width: 100%;
  }

  .blog_logo {
    top: 0;
    bottom: auto;
    width: 150px;
    left: 20px;
    background-color: #2d3d4d;
    line-height: 47px;
    font-size: 20px;
    letter-spacing: 3px;
    text-align: left;
    height: 50px;
    transform: none;
  }

  /* side menu */
  .box_header label.input-toggle {padding: 18px 20px;}
  .box_header {right:0;}
  .box_header_bg {width:100%;padding:50px}
  .box_header_inner {margin-top: 0px;} 
  .box_header ul.side_menu {font-size:0;margin-left: -10px;}
  .box_header ul.side_menu_switch li {margin-bottom: 0px;text-align: right;padding: 0;}
  .box_header ul.side_menu li {
    width: calc(25% - 10px);
    float:left;
    border: none;
    margin-left: 10px;
    margin-bottom: 10px;
    padding:0;
  }
  .box_header ul.side_menu li .link_sidebar {background-size: 75% 75%;}
  .box_header ul.side_menu li .link_home {background-size: 47% 47%;}
  .box_header ul.side_menu li .link_comment {background-size: 46% 45%;}
  .box_header ul.side_menu li .link_tag {background-size: 45% 45%;}
  .box_header ul.side_menu li .link_guest {background-size: 41% 41%;}
  .box_header ul.side_menu li .link_notice {background-size: 47% 47%;}
  .box_header ul.side_menu li .link_write {background-size: 41% 40%;}
  .box_header ul.side_menu li .link_admin {background-size: 43% 43%;}
  .box_header ul.side_menu li .link_login {background-size: 45% 45%;}
  .box_header ul.side_menu li .link_logout {background-size: 45% 45%;}
  .box_header ul.side_scroll li .link_up {background-size: 48% 48%;}
  .box_header ul.side_scroll li .link_down {background-size: 48% 48%;}
  .box_header ul.side_menu li a {
    margin:0; 
    border-radius:0;
    background-size: 40% 40%;
    width: 100%;
    padding-top: 100%;
    background-color:#2E3130;
  }
  .box_header ul.side_scroll {width:calc(100% + 10px); position:initial;}
  .box_header ul.side_scroll li {padding:0;}
  /* .box_header ul.side_scroll li a {padding-top:100%;} */
  .box_header ul.side_scroll li .link_up {margin-bottom:0;}
  .box_header ul.side_scroll::after {
    content:'';
    clear:both;
    display:block;    
  }
    
    .box_header .tooltip .tooltiptxt {
        display:none;
    }
  
  /* area popup */
    .area_popup .box_form .btn_search_del {
    right: 5px; 
  }

    .area_popup .box_form {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }
    .area_popup .tag_zone, .area_popup .tag_board {
    width: 100%; 
  }
  
  .area_sidebar .menu_tab .tab_content .tab_set {padding: 0 30px;}
  
  /* cover */
  .area_cover .cate {
    font-size: 14px;
    letter-spacing: 0;
    line-height: 1.6;
  }
  .area_cover .title {-webkit-line-clamp:1;}
  .area_cover .text {font-size: 17px;max-height: 60px;-webkit-line-clamp:2}

    .type_featured .inner_main_slide {bottom:0;}
  
  
  /* .type_post {margin-top: 60px;} */
  .title_section {
    margin: 0 0 20px 0;
    font-size: 22px;
    text-align: left; }
  .type_post .title_section {
    text-align: center;}
  .list_post, .category_type_post {
    margin: 0 -1px; }
  .item_post .link_post:before,
  .category_type_post .item_category .link_category:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    }

  .list_type_notice .link_notice .text,
  .category_type_notice .link_category .text {
    font-size: 17px; 
    -webkit-line-clamp: 2;
  }

  .type_card {margin: 60px auto -30px auto; padding: 40px; }
  .type_card .item_card {width: 50%; margin-bottom: 30px; }
  .type_card .link_card strong {
    font-size:19px;
    margin: 16px 8px 4px 0;
    -webkit-line-clamp: 1;
  }
  .type_card .link_card .text {
    font-size: 17px;
    -webkit-line-clamp: 2;
    line-height: 1.5;
  }
  .list_type_card .link_card .thumnail{
    padding-top: 65%;
  }

  .type_banner {margin-top: 60px; padding: 40px;}
  .list_type_banner .link_banner {
    height: 160px; }
  .list_type_banner .box_content {
    width: 80%;
    padding: 25px; }
  .list_type_banner .link_banner strong {
    display: block;
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 26px;
    overflow: hidden; 
  }
  .list_type_banner .link_banner .text {
    font-size: 17px;
    line-height: normal;
    -webkit-line-clamp: 2;
    max-height: 50px;
  } 
  .type_notice {margin-top:60px;}
  .type_notice .thumnail,
  .category_type_notice .thumnail {
    width: 130px;
    height: 130px;
    margin-right: 15px;
  }
    
  .area_cover .type_notice .catedate {
    margin: 10px 0 6px 0;
  }
  .type_notice .date {font-size: 14px;}
  .type_notice .text {font-size:17px; max-height: 50px; -webkit-line-clamp: 2;}

  .list_type_notice .link_notice strong, 
  .category_type_notice .link_category strong {
    font-size: 19px;
    font-weight: bold;
  }

  .list_type_notice .link_notice .date, 
  .category_type_notice .link_category .date {
    font-size:14px;
  }

  .category_type_notice .text {
    font-size: 17px;
    max-height: 55px;
    line-height: 1.6;
    -webkit-line-clamp:2;
  }
  .category_type_notice .cate {font-size: 14px;}
  .category_type_notice .date {font-size: 14px;}
  .area_category .title_section {
  text-align: left; } 

  .category_type_related .item_category {
  width: 100%;
  margin-bottom: 30px !important; }
  .category_type_related .link_category strong {
  display: block;
  margin: 12px 0 4px 0;
  font-size: 17px; }
  .category_type_related .link_category .text {
    margin: 0 0 10px 0;
  } 

  /* sidebar */
  .menu_tab .link_title {
    font-size: 16px;
    font-weight: normal;
      line-height: 4.3;
  }

  ul.tt_category,
  ul.category_list li .c_cnt,
  aside .list_sidebar .item_sidebar_lst a,
  caption.cal_month,
  aside .list_sidebar .item_sidebar_1col a,
  aside .list_sidebar .item_sidebar_1col .cnt,
  aside .title_profile,
  aside .wrap_profile {
    font-size: 16px;
  } 

  ul.category_list li.cate_open .ico_expand {
    top: 3px;
  }

  ul.category_list li .ico_expand {
    top: 3px;
  }

  aside ul.list_sidebar li.item_sidebar_lst .txt_desc {
    width: calc(100% - 181px);
  }

  /* area view */
  .area_view {
    font-size:17px;
    margin-top: 50px;
  }
  .area_view .link_cate {
    font-size: 14px;
    padding: 3px 6px;
  }
  .area_view .area_article {
    padding: 60px 0;
  }
  .area_view .article_header {
    text-align: left;
  }
  .type_article_header_common .inner_header {
    height: 520px; 
  }
  .area_view .article_header .info {
    margin: 5px 0 0 0;
  }
  .area_view .article_header .info_text {
    width: 100%;
    box-sizing: border-box; 
    border: none;
    padding: 0;
  }
  .area_view .article_header .title_post {
    width: 100%;
    font-size: 32px;
    line-height: 38px; 
  } 
  .area_view .article_header .info,
  .article_view .btn-toggle-moreless {
    font-size:16px;
  }
    .article_view .fileblock .name {font-size:17px;}

  .article_view blockquote p {line-height:1.7;font-size:17px;}
  .article_view figure figcaption {font-size:15px;}
  
  .list_index:first-child {
  margin-top: 100px;
  }

  .list_index.category_type_related {
    width: 100%;
    margin: 0;
  }

  .list_index.category_type_related:first-child {
    margin-top: 120px;
  }

  .list_index.category_type_related .link_category {
    padding: 0;
  }

  .area_view .absent_post{
    margin: 200px 0 90px 0;
  }

  .area_category {padding: 80px 40px 0 40px;}
  #wrap_adsense_bottom .title_line,
  .article_content .title_line {font-size:17px;}
    .area_tag {
        padding: 30px 0; }
    .area_tag .title_tag {
        font-size: 16px;
        line-height: normal;
    } 
  .area_tag .list_tag .desc_tag a {font-size:16px;}
    .area_related .title_related {
        margin: 30px 0 0 0;
        font-size: 16px;
        line-height: normal; }
    .area_related .item_related {
        width: 25%;
    margin-bottom: 20px;
  }
  .area_related .link_related .box_content {font-size:16px;line-height:24px;min-height: 112px;}
  .area_related .link_related .box_content .info_tit {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    max-height: 50px;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .area_reply .item_reply .user {font-size:15px;}
  .area_reply .box_reply_content {font-size:15px;}
  .area_reply .box_reply_content .txt {font-size:16px; line-height: 1.6;}
  .area_reply .inner_inp input {
    font-size:16px;
    position: relative;
    top: -5px;
  }
  .area_reply .form_content textarea {font-size:16px;}
  .area_reply .secret_chk {font-size:16px;line-height: 3;}
  .area_reply .btn_register {font-size:15px;}

  .area_reply li.item_reply::before {
    top: 28px;
    height: calc(100% + 26px);
  }
  .area_reply .box_reply_content .txt::before {top: 20px;}
  .area_reply .box_reply_content .txt::after {top: 20px;}
  .area_reply .thumbnail_reply {top: 28px}
  .area_reply .item_comment::before {top: 28px;}

  .area_paging_wrap {
    padding: 0 40px;
    max-width: 800px;
    margin: 0 auto;
  }
  .area_paging_list {display:none;}
  .area_paging_simple {display:block;}
  .area_paging .inner_paging {display:block;position: relative;}
  .area_paging .inner_paging::after {content:'';clear:both;display:block;}
  .area_paging .link_prev{float: left;line-height: 33px;font-size:17px;color: #555;}
  .area_paging .link_next{float:right;line-height: 33px;font-size:17px;color: #555;}
  .area_paging .link_prev span.ico_left {
    font-size: 15px;
    border: none;
    background-color: #fff;
    color: #555;
    font-weight: bold;
    padding: 9px 20px 10px 10px;
  }
  .area_paging .link_next span.ico_right {
    font-size: 15px;
    border: none;
    background-color: #fff;
    color: #555;
    font-weight: bold;
    padding: 9px 10px 10px 20px;
  }
  .area_paging .link_prev span.ico_left::before {
    content:"〈";
    padding-right:7px;
  }
  .area_paging .link_next span.ico_right::after {
    content:"〉";
    padding-left:7px;
  }
  
  .type_featured .box_arrow {
    display: none;
  } 


   /* 보호글 */
  .wrap_protected .btn_confirm {font-size: 16px; font-weight: bold;}
  .protected_form input {font-size: 16px; }
  
  #footer {
    margin-top: 60px;
    font-size:16px;
  }

  #footer .info_footer:after {
    content: '';
    display: block;
    clear: both;
  }
} 

/***************** 
    mobile 810px 
******************/
@media screen and (max-width: 810px) {
  #main {margin-top: 50px;}
  .area_sidebar .inner_sidebar {
    width: 100%;
    left: 0;
    padding: 0 24px; 
  }
  .area_sidebar .area_sidebar .btn_close {
    margin-right: -16px; 
  }
  .area_sidebar .area_sidebar .title_logo {
    margin-bottom: 30px; 
  }
  .area_sidebar .title_logo{
    font-size: 20px;
  }
  
  .area_common {
    margin-top: 36px;
  } 

  .type_featured .title {font-size:17px;margin-bottom: 12px;}
  .type_featured .text {display:none;}
  .type_featured .ico_circle{
    width: 8px;
    height: 8px;
  }

  .type_notice .info, .category_type_notice .info {
    padding-top: 0;
  }

  .list_post .item_post, .category_type_post .item_category {
    width: 33.3%;
  }
  .type_post {
    padding: 20px 40px 0 40px;
  }

  /* adsense */
  .adsense_top_left {float: none; height:280px; }
  .adsense_top_right {display: none;}
}

@media screen and (max-width: 743px) {
  .article_view iframe {
    width: 100%;
    height: 56vw;
    -ms-height: 56vmax; 
  } 
  
  /* google adsense */
  /* #wrap_adsense_bottom {width:100%;height:auto;} */
}

@media screen and (max-width: 500px) {
  .white .type_featured {padding: 20px;}
  .type_post {padding:0 20px;}
  .type_card {padding:20px;}
  .type_banner {padding:20px;}
  .type_notice {padding:20px;}
  .list_index {padding:0 20px;}
  .article_view {padding:0 20px;line-height: 1.5;}
  .area_view a.link_cate {font-size: 14px;}
    .article_view ol li {line-height: 1.5;}
  .article_content {padding:20px; margin-top: -11px;}
  .area_paging_wrap {padding:20px;}
  .area_view .article_header .inner_header {padding:20px;}
  .list_type_notice .item_notice,
  .category_type_notice .item_category {
    padding: 15px 0;
  }   
  
  /* side menu */
  .box_header_bg {padding: 0 20px;}
  .box_header ul.side_menu li {
    width: calc(50% - 8px);
    margin-left: 8px;
    margin-bottom: 8px;
  }
  .box_header ul.side_menu li a {padding-top:65%;}
  .box_header ul.side_menu li .link_comment {background-size: 40% 40%;}

  /* sidebar */
  .menu_tab .tit_bg {
    max-width:320px;
    margin:0 auto;
    padding: 40px 0 40px 0;
  }
  .menu_tab label {margin: 5px 3px;}

  .menu_tab .tab_content .tab_set.tab_set_reply {padding:0;}

  .area_sidebar .btn_close {
    position: relative;
    left: calc(50% + 130px);
    top: 193px;
  }
  .area_sidebar .menu_tab .tab_content .tab_set {padding:0;}
  
  aside .list_sidebar .item_sidebar {width:50%;}
  aside .list_sidebar_thumb {margin-top: 10px;}
  
  aside .list_sidebar .item_sidebar_lst a {padding:0;}
  aside ul.list_sidebar li.item_sidebar_lst .txt_name {width: 90px; font-size: 15px; padding: 10px 10px 10px 0;}
  aside ul.list_sidebar li.item_sidebar_lst .txt_desc {
    padding: 10px 0;
    line-height: 1.6;
    width: calc(100% - 96px);
    white-space: normal;
    font-size: 16px;
  }
  aside ul.list_sidebar li.item_sidebar_lst .txt_time {display:none;}
  aside ul.list_sidebar li.item_sidebar_lst .txt_desc::before {display:none;}

  .radio_tab {display: none;}
  
  /* search */
  .area_popup {height:auto;}
  .area_popup .area_search {padding: 35px 0 30px 0; position: relative; margin-top: 20px;}
  .area_popup .box_form {margin-bottom: 0; padding: 10px 0 25px 0;}
  .area_popup .box_form .inp_search {font-size:20px; width: 80%;top: 4px;}
  .area_popup .box_form .icon-Search {display:none;}
  .area_popup .box_form .btn_search_del {
    right: 0;
    top: 8px;
  }

  .box_tag {
    margin-top: 20px;
  }

  /* .area_popup .tag_zone a::before {margin-right: -2px;} */
  .area_popup .tag_zone a {
    display: inline-block;
    font-size: 16px;
    border-bottom: none;
    line-height: 1.6;
    padding: 5px 7px;
    margin-right: 5px;
    margin-bottom: 5px;
    border: 1px solid #d1d1d1;
    border-radius: 5px;
  }
  
  .area_popup .tag_zone a:last-child {border-bottom: 1px solid #d1d1d1;}
  
  /* cover */
  .area_cover .title {
    font-size: 17px;
    font-weight: normal;
    line-height: 1.5;
    letter-spacing:0;
    -webkit-line-clamp: 2;
    max-height: 50px;
  }
  .area_cover .type_notice .title {
    max-height: 50px;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
  }
  
  .area_cover .type_card .date {display:none;}
  
  .area_cover .text {display:none;}
  .type_featured .text {font-size: 16px;max-height: 70px;}
  .title_section {font-size: 20px; letter-spacing:-1px;}
  .list_post .item_post, .category_type_post .item_category {
    width: 50%;
  }
  
  .type_card .link_card strong {
    font-size: 16px;
    -webkit-line-clamp:2;
    font-weight:normal;
    margin:0;
    padding: 7px 3px 4px 0;
    line-height: 1.4;
  }
  .type_card .link_card .text {display:none;}
  
  .list_type_card .item_card {padding-left:10px;margin-bottom: 20px;}
  .list_type_card {margin-left: -10px;}
  
  .list_type_banner .link_banner strong {font-size: 22px;}
  
  .list_type_notice .link_notice strong,
  .category_type_notice .link_category strong {
    font-size: 17px;
    max-height: 50px;
    white-space: normal;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.5;
    font-weight: normal;
  }
  .type_notice .thumnail,
  .category_type_notice .thumnail {
    width: 85px;
    height: 85px;
    float: right;
    margin-left: 15px;
    margin-right: 0;
  }
  .category_type_notice .text {display:none;}
  .list_type_notice .link_notice .text,
  .category_type_notice .link_category .text {
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
    width:100%;
  }
  .list_type_notice .link_notice .date,
  .category_type_notice .link_category .date {
    font-size: 13px;
  }
  
  .area_category {padding:50px 20px 0 20px}
  
  .area_view .article_header .title_post {
    font-size:30px;
    line-height: 1.4;
  }
  
  .area_view .article_header .info
  .article_view .btn-toggle-moreless {
    font-size:14px;
  }
  .article_view .fileblock .name {font-size:17px;}
  .article_view .form_notice {
    background-size: 48px 48px;
    background-position: 10px center;
    padding: 25px 15px 25px 66px;
  }
  .article_view figure figcaption {font-size:14px;}
  .article_view .imageblock > a[href*="attachment"]::before {
    width: 54px;
    height: 50px;
  }
  .article_view .imageblock > a[href*="attachment"] {
    height: 52px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  
  /* article */
  .area_tag {padding: 0 0 18px 0;}
  .article_view blockquote p {line-height: 1.5; padding: 0 10px !important;}
  #wrap_adsense_bottom .title_line,
  .article_content .title_line {font-size:16px; letter-spacing:2px;}
  .area_tag .list_tag .desc_tag a {font-size:15px;}
  .area_related .item_related {width:100%;padding-left:0;}
  .area_related .thumnail {
        border:0; 
        width: 25%;
        padding-top: 25%;
        display: inline-block;
        border-radius: 4px;
    }

  .area_related .list_related {margin-left:0;}  
  .area_related .link_related .box_content .info_tit {font-size:17px;}
    .area_related .item_related:hover .box_content {background-color:transparent;}
  .area_related .link_related .box_content {
    background-color: transparent;
        padding: 0 0 0 5px;
        line-height: 1.4;
        font-size: 16px;
        min-height: auto;
        border-radius: 0;
        width: 70%;
        display: inline-block;
        vertical-align: top;
  }
    .area_related .info {
        font-size:15px;
    }

  .area_reply li.item_reply::before {
    top: 22px;
    height: calc(100% + 32px);
  }
  .area_reply .thumbnail_reply {
    top: 22px;
  }

  .area_reply .box_reply_info {margin: 10px 0 20px 0;}
  .area_reply .box_reply_content  {font-size: 15px;}
  .area_reply .box_reply_content .txt {font-size: 15px; padding: 9px 13px;}
  .area_reply .item_comment {margin-left: 30px;}
  .area_reply .item_comment::before {width: 35px; top: 22px; left: -27px;}
  .area_reply .form_guest {float:none;}
  .area_reply .box_inp:nth-child(-n+2) {
    width:100%;
    display: block;
    margin-bottom: 10px;
  }
  
  .area_reply .box_reply_content .txt::before {top: 14px; left: -8px;}
  .area_reply .box_reply_content .txt::after {top: 14px;left: -6px;}
  
  .area_reply .form_content textarea {font-size:15px;}
  .area_reply .inner_inp input {font-size:15px;}
  .area_reply .secret_chk {margin-left: 4px; font-size:15px;}
  
  .area_reply .reply_content_guest {margin-top:0;}
  
  .area_common {padding: 0 20px;}
  .area_common_guest {padding:0 20px 60px 20px;}
  .area_common .title_common {font-size: 26px;}
  .area_common .wrap_cloud span {width: 50px;line-height: 1.7;}
  .area_common li.li_tag a {margin-left: 40px;}
  .area_common li.li_tag::before {width: 40px;}
  
  .wrap_protected {margin: 100px 0 50px 0;}
  .wrap_protected .btn_confirm {font-size: 15px; }
  .protected_form input {font-size: 15px;}
  
  #footer {
    font-size:15px;
  }
    
    /* TOC */

  /* adsense */
  .adsense_top_left {height:auto;}    
    
}

@media screen and (max-width: 360px) {
  .box_header ul.side_menu li {
    width: calc(50% - 5px);
    margin-left: 5px;
    margin-bottom: 5px;
  }
  .box_header ul.side_menu li a {padding-top: 60%;}
  .wrap_protected {margin: 60px 0 10px 0;}
  .protected_form input {width: 180px;}
}