﻿/*
 * copyright (c) 2015-2017 tokiidesu
 * design by tokiidesu
 *
 * version: 2017.r02 20170901
 * release date: September 2017
 */

/* --------------------------------------------------------------------------
스타일
*/

/* 본문 > 제목 크기 */
/* 변경하시려면 주석을 해제해주세요
.entry-article > header > h2 {
  font-size: 28px;
}
*/

/* 본문 > 글씨 색, 글씨 크기 */
/* 변경하시려면 주석을 해제해주세요 */
body {
  color: #333;
  font-size: 16px;
  line-height: 30.4px;
}

.entry-article .article h2 {
	font-size: 24px;
	font-weight: 700;
}

.entry-article .article h3 {
	font-weight: 700;
	font-size: 19px;
  margin-top: 15px;
  margin-bottom: 15px;
}

.entry-article .article h5 {
	font-weight: 700;
	font-size: 19px;
  margin-top: 15px;
  margin-bottom: 15px;
}

.entry-article .article h6 {
	color: #828282;
	font-size: 14px;
  margin-top: 0px;
  margin-bottom: 30px;
}

/* 모바일 */
@media (max-width: 960px) {
  /* 본문 > 제목 크기 */
  /* 변경하시려면 주석을 해제해주세요
  .entry-article > header > h2 {
    font-size: 26px;
  }
  */
  
  /* 본문 > 글씨 크기 */
  /* 변경하시려면 주석을 해제해주세요 	*/
  body {
    font-size: 16px;
    line-height: 26px;
  }
}

/* --------------------------------------------------------------------------
색 변경
*/

/* 상단 메뉴 > 블로그 제목 */
/* 변경하시려면 주석을 해제해주세요
.header .site-title a {
  color: #333 !important; }
.header .site-title a:hover {
  color: #e95024 !important; }
*/

/* 상단 메뉴 > 메뉴 버튼 */
/* 변경하시려면 주석을 해제해주세요
.header .aside-button svg {
  fill: #333 !important; }
.header .aside-button svg:hover {
  fill: #e95024 !important; }
*/

/* 사이드바 > 구분선 */
/* 변경하시려면 주석을 해제해주세요
.sidebar .module + .module {
  border-color: rgba(0, 0, 0, .12) !important;
}
*/

/* 사이드바 > 방문자 */
.sidebar .module.visit em{color:#9b9993}
.sidebar .module.visit li+li{margin-top:0px !important;}

/* 대표색 */
/* 변경하시려면 주석을 해제해주세요
.button {
  background-color: #78b92c !important;
}

.site input[type="text"]:focus,
.site input[type="email"]:focus,
.site input[type="url"]:focus,
.site input[type="password"]:focus,
.site input[type="search"]:focus,
.site textarea:focus {
  border-color: #78b92c !important;
}

.comment-item > .comment .comment-body > footer a,
.site .taglist li a.cloud1,
.site .taglist li a.cloud2,
.header .account-dropdown > .menu > nav a.primary,
.sidebar .module h2,
.search-header > h2 > em,
.entry > .article .details > footer .item.primary a,
.entry-article > header > .category a,
.entry-article .article a,
.entry-section.tag > .section-content a,
.entry-section.related-article .related-more,
.entry-section.related-article .related-more a,
.entry-section.comment .activity .comment-toggle em,
.comment-item > .comment .comment-body > header .details > .item.date a,
.entry-article .moreless_fold,
.entry-article .moreless_top,
.entry-article .moreless_bottom,
.tt_more_preview_comments_wrap .tt_more_preview_comments_text,
.site > .account .module.user a.primary,
.comment-item > .comment .comment-body > header .author a:hover,
.site .taglist li a.cloud3:hover,
.site .taglist li a.cloud4:hover,
.site .taglist li a.cloud5:hover,
.header .site-title a:hover,
.header .account-dropdown > .menu > header > a:hover .details > .blog,
.header .account-dropdown > .menu > nav a:hover,
.sidebar .site-toolbar .section-title .title:hover,
.sidebar .module a:hover,
.sidebar .module a:hover > em,
.sidebar .module.profile > article > h2 a:hover,
.sidebar .module.category .link_tit:hover,
.sidebar .module.category .link_item:hover,
.sidebar .module.category .link_sub_item:hover,
.entry > .article .details > header > h3 a:hover,
.entry > .article .details > .summary:hover,
.entry > .article .details > .summary:hover p,
.entry > .article .details > footer .item a:hover,
.entry-article > header > h2 a:hover,
.entry-article > header > .details > .item a:hover,
.entry-section.author-info .author-body > header a:hover,
.entry-section.author-info .author-body > header .details .item a:hover,
.entry-section.author-info .author-body > footer a,
.related-items > .related-item a:hover .details > header h3,
.entry-section.comment .activity a:hover,
.navigation .nav-item:hover span:not(.selected),
.footer-nav a:hover,
.footer address a:hover,
.header .account > a:hover,
.site > .account .module a:hover,
.site > .account .module.profile > a:hover .details .blog {
  color: #78b92c !important;
}

.header .aside-button > svg:hover,
.sidebar .site-toolbar .aside-close-button > svg:hover,
.navigation .nav-end:not(.no-more-prev):not(.no-more-next):hover > svg:hover,
.site > .account > header .account-close-button > svg:hover {
  fill: #78b92c !important;
}

@media (min-width: 641px) {
  .navigation .nav-item span.selected {
    color: #78b92c !important;
  }
}
*/

/* 그리드 색상 */
.entry.grid>.article .details{background-color: white !important;padding:10px;}

/* 크기 변경 > 상단 메뉴 */
@media (min-width: 961px) {
  .header {
    height: 70px !important;
  }
}

/* --------------------------------------------------------------------------
webfont
*/
body {
  font-family: 'Nanum Gothic', roboto, san-serif;
}

/* 버튼 */
.button {
	background-color:#e94e24;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	border:1px solid #ffffff;
	display:inline-block;
	cursor:pointer;
	color:#ffffff !important;
	font-size:16px;
	padding:10px 22px;
	text-decoration:none !important;
}
.button:hover {
	background-color:#da4015;
}
.button:active {
	position:relative;
	top:1px;

}

/* 대표 이미지 숨기기 */
.titleimage {
	display: none!important;
}
/* 유튜브 반응형 */
.youtube {overflow:hidden; position:relative; margin-bottom:24px; padding-bottom:56.25%; height:0}
.youtube>iframe {position:absolute; top:0; left:0; width:100%; height:100%}

/* 로고 크기 변경하기(png, jpg) */
@media (min-width: 961px) {
  .header .site-title .logo img.desktop {
    max-height: 38px !important;
  }
}
/* 본문 로딩 */
 #loadOverwrapper {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    z-index: 9999;
    text-align: center;
    padding: 20%;
}
/* 로딩 사이클 애니매이션 */
.spinner {
  margin: 100px auto;
  width: 50px;
  height: 40px;
  text-align: center;
  font-size: 10px;
}

.spinner > div {
  background-color: #333;
  height: 100%;
  width: 6px;
  display: inline-block;
  
  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}