@import url("http://fonts.googleapis.com/css?family=Montserrat:400,700");
/* @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); */
/* @import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);*/

/* =============================================================================
   Global setting
   ============================================================================= */
html { font-size: 100% !important; }

/* Link */
a { color: #0088CC; text-decoration: none; }
a:hover, a:focus { color: #005580; text-decoration: none !important; }

/* Remove Firefox selection dot */
a, a:focus, a:active, a:hover, object, embed { outline: none; }
:-moz-any-link:focus { outline: none; }
input::-moz-focus-inner { border: 0; }
:focus { outline: 0; }

/* Firefox opacity jog fix */
.fade-hover img { background: #fff; }

del { color: #ccc; }

/* Line */
hr {
  border: solid #ddd;
  border-width: 1px 0 0;
  clear: both;
  margin: 30px 0 20px;
  height: 0;
}

/* Image */
a img { border: none; }

img {
  max-width: 100%;
  height: auto;
  -ms-interpolation-mode: bicubic;
}

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

/* SELECTED TEXT */
::selection { background: #ff5e99; color: #FFFFFF; }
::-moz-selection { background: #ff5e99; color: #FFFFFF; }

/* Position */
.left { float: left; }
.right { float: right; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center, .text-centre { text-align: center; }
.hide { display: none; }
.highlight { background: #ff0; }

div { word-wrap: break-word; }

/* clearfloat */
.clear, .clearfloat {
  clear: both;
  font-size: 1px;
  height: 0;
  line-height: 0;
}




/* =============================================================================
   Animation setting
   ============================================================================= */

/* Normal Fade Animation */
.animation, .navbar-toggle {
    -webkit-transition: all 300ms cubic-bezier(0.485, 0, 0.25, 1);
    -moz-transition: all 300ms cubic-bezier(0.485, 0, 0.25, 1);
    transition: all 300ms cubic-bezier(0.485, 0, 0.25, 1);
    /* -webkit-transform: translate3d(0, 0, 0); Webkit Hardware Acceleration*/
    -webkit-backface-visibility: hidden;
    /* Safari Flicker Fix #2 */
    -webkit-transform: translateZ(0);
}


/* Fast  Fade Animation */
    .animation-fast, .brand, .fade-hover, .nav li a, .sns-icons-box li, .brand .icon-reorder:before, .maker a, #footer li a, .back-top a, .btn, a {
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    transition: all 200ms ease;
    /* -webkit-transform: translate3d(0, 0, 0); Webkit Hardware Acceleration*/
    -webkit-backface-visibility: hidden;
    /* Safari Flicker Fix #2 */
    -webkit-transform: translateZ(0);
}




/* =============================================================================
   Layout setting
   ============================================================================= */
body { margin: 0; padding-top: 80px; }


.container { margin: auto; max-width: 960px; }
    @media (max-width: 991px) { .main-content .container { max-width: 690px; } }

#sidebar { position: relative; }
    @media (min-width: 992px) { 
        #main { float:right; } 
        #sidebar { float: left; top: 0; }
        #sidebar.affix {
            position: fixed !important;
            width: 16% !important;
            top: -175px;
            }
        }
    @media (max-width: 991px) {
        #sidebar {
            position: relative;
            top: 0 !important;
            }
        }

    
#footer {
    margin-top: 100px;
    padding: 30px 0 30px 0;
    border-top: 1px solid #eee;
    background: #f9f9f9;
    }
    .copyright { text-align: center; }
    .back-top { margin-top: 20px; }
    
    
    
    
/* =============================================================================
   Typography
   ============================================================================= */
body, p, h1, h2, h3, h4, h5, h6, .btn, .navbar, .brand, a {
  font-family: "proxima-nova-soft", "Montserrat", "Helvetica", Arial, "Apple SD Gothic Neo", "나눔고딕", "Nanum Gothic","Malgun Gothic", Applegothic, sans-serif; 
  }


h1, h2, h3, h4, h5, h6,
h1 a,h2 a, h3 a, h4 a, h5 a, h6 a {
    color: #000;
    font-weight: bold;
    }
    @media (min-width: 768px) { h2 { font-size: 2.75rem !important; }}


body, p {
    color: #444;
    line-height: 1.6;
    font-size: 14px;
    }
    .article p {
        margin-bottom: 22px;    
        }


.byline { color: #BDC3C7; }


/* Logo */
.brand {
    font-weight: bold !important;
    font-size: 2rem !important;
    }
    @media (max-width: 767px) {
        .brand {
            font-size: 1.5rem !important;
            }
        }




/* =============================================================================
   Navigation
   ============================================================================= */

@media (min-width: 768px) {
    .nav.navbar-nav { border-left: 1px solid #ddd; border-right: 1px solid #fff; }
    .nav.navbar-nav li { border-left: 1px solid #fff; }
    .nav.navbar-nav li { border-right: 1px solid #ddd; }
    .navbar-collapse { padding-right: 0; }
    }

@media (max-width: 767px) {
    ul.navbar-nav { float: left !important; width: 100%; }
    .container > .navbar-collapse { background: #333; padding-left: 0 !important; padding-right: 0 !important; }
    .container > .navbar-collapse a { color: #ddd !important; padding: 12px 24px; border-bottom: 1px solid #000; border-top: 1px solid #444;}
    .container > .navbar-collapse a:hover { background: #666 !important; }
    .navbar-collapse .navbar-nav { margin: 0 !important; }
    }


/* Mobile button */
.navbar-toggle {
    background-color: #CCCCCC; /* BG */
    border: 3px solid #aaa !important;
    border-radius: 20px 20px 20px 20px;
    float: right;
    margin-bottom: 8px;
    margin-right: 15px;
    margin-top: 8px;
    padding: 10px 6px;
    position: relative;
    }
    .navbar-default .navbar-toggle { border-color: #000000; } /* Border */
    .navbar-default .navbar-toggle .icon-bar { background-color: #FFFFFF; } /* Icon inside stripes */

    /* Opening animation */
    .navbar-toggle.collapsed {
    	-webkit-transform: rotate(0deg) !important;
    	-moz-transform: rotate(0deg) !important;
    	-o-transform: rotate(0deg) !important;
    	-ms-transform: rotate(0deg) !important;
    	transform: rotate(0deg) !important;
        }
        
    .navbar-toggle {
    	-webkit-transform: rotate(-90deg) !important;
    	-moz-transform: rotate(-90deg) !important;
    	-o-transform: rotate(-90deg) !important;
    	-ms-transform: rotate(-90deg) !important;
    	transform: rotate(-90deg) !important;
    
    	-webkit-transition: all 0.3s ease 0s !important;
    	-moz-transition: all 0.3s ease 0s !important;
    	-o-transition: all 0.3s ease 0s !important;
    	-ms-transition: all 0.3s ease 0s !important;
    	transition: all 0.3s ease 0s !important;
        }
    




/* =============================================================================
   Sidebar
   ============================================================================= */

/* Profile image */
.blogImage {
    width:140px;
    overflow: hidden;
    border-radius: 80px;
    border: 4px solid #f1f1f1;
    margin-top: 22px;
    }


/* Description */
.blogDesc { color: #999; font-weight: 100; font-family: "proxima-nova", "Montserrat", "Helvetica Neue", "Helvetica", "Apple SD Gothic Neo", "나눔고딕", "Nanum Gothic","Malgun Gothic", Applegothic, sans-serif; }

.userID {
    font-weight: bold;
    font-size: 1.5rem;
    }


/* Category list */
.category div { cursor: pointer; }




/* =============================================================================
   Main
   ============================================================================= */

/* Meta  */
.meta {
    border-bottom: 1px dashed #CCCCCC;
    border-top: 1px dashed #CCCCCC;
    margin: 20px 0;
    padding: 4px 0;
    }


.meta span {
    font-family: "proxima-nova", "Apple SD Gothic Neo", "나눔고딕", "Nanum Gothic","Malgun Gothic", Applegothic, sans-serif;
    font-weight: 200 !important;
    color: #888;
    font-size: 0.94rem; 
    display: inline-block;
    }
    @media (max-width: 567px) { 
        .meta span { font-size: 0.75rem;}
        }
        @media (max-width: 479px) { 
            .meta span { font-size: 0.63rem;}
            }

    @media (min-width: 568px) {
    .meta .date {
        border-right: 1px solid #ccc;     
        border-left: 1px solid #ccc;
        padding: 0px 15px !important;
        margin-left: 10px;
        }
    
    .meta .author { 
        border-right: 1px solid #ccc; 
        padding: 0 14px 0 10px; 
        margin-right: 10px; 
        }
    }
    

/* Page style */
.titleWrap { 
    text-align: center !important; 
    }
    
    
.entry { 
    padding:10px 0 60px; 
    margin-bottom: 24px; 
    border-bottom: 4px solid #eee; 
    }
    
    
/* Pagination */
.paging { text-align: center; }    
.numbox { margin: 0 14px; }

    
/* Tags */
.label a { color: #fff; }
.tagTrail { color: #fff; }
.tagTrail a {
    background: none repeat scroll 0% 0% #5CB85C;
    color: #fff;
    padding: 3px 10px;
    }
    .tagTrail a:hover {
        color: #fff; opacity: 0.8;
        }


/* More button */
.moreless_fold, 
.moreless_top, 
.moreless_bottom { 
    text-align: center;
    margin: 10px 0 !important;
    }

.moreless_fold span, 
.moreless_top span, 
.moreless_bottom span { 
    background: #0088cc; 
    display: inline-block; 
    padding: 4px 8px; 
    color:#fff;  
    }
    /* More Content */
    .moreless_content { border: 2px dashed #ccc; padding: 20px; }


/* Gallery */
.tt-gallery-box { 
    background: #f9f9f9; 
    padding: 10px 20px; 
    border-radius: 5px; 
    border: 1px solid #eee; 
    }
    .galleryControl a img {
        height: 18px !important;
        width: auto;
        }



/* =============================================================================
   Form
   ============================================================================= */

/* Comment form */
.guestWrite { border-bottom: 3px solid #ddd; padding-bottom: 30px; margin-bottom: 40px; }
.commentWrite { border-top: 3px solid #ddd; padding-top: 0px; margin-top: 40px; }
.comment ol, .guestList ol {
    list-style: none;
    padding-left: 0px;
    }
    .comment ol ul, .guestList ol ul {
        list-style: none;
        padding: 20px 0 0 0px;
        border-left: 1px solid #ccc;
        margin: -20px 0 0 30px !important;
        }


.comment ol ul .panel.panel-default,
.guestList ol ul .panel.panel-default {
     border-left: 0;
     border-radius: 0px 4px 4px 0px;
    }


.comment h3 {
    padding: 0 0 10px;
    }
    
    
.commentList {
     border-top: 4px solid #CCCCCC;
     margin-top: 20px;
     padding-top: 24px;
    }


/* Trackback */
.trackback .alert {
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 0 0 0 0;
    margin-bottom: 15px;
    margin-top: 10px;
    padding: 8px 10px 5px;
    }


.trackback-box {
     list-style: none outside none;
     padding: 0px;
    }
    .trackback-box li {
         border-top: 1px dashed #ddd;
        }
    .trackback-box h4 {
        font-size: 1rem; margin-bottom: 4px !important;
        }
    .trackback-box p {
        font-size: 0.75rem;
        color: #888;
        }



/* =============================================================================
   Syntax Highlighting
   ============================================================================= */

/* Preformatted text and code
---------------------------------------- */

/* Allows line wrapping of 'pre' */
pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
	border-radius: 0 0 0 0 !important;
}

.pln {
  color: #cccccc !important;
}

@media screen {
  /* string content */
  .prettyprint .str {
    color: #a0ab7f !important;
  }

  /* a keyword */
  .prettyprint .kwd {
    color: #faefac !important;
  }

  /* a comment */
  .prettyprint .com {
    color: #726E73 !important;
  }

  /* a type name */
  .prettyprint .typ {
    color: #ab99ac !important;
  }

  /* a literal value */
  .prettyprint .lit {
    color: #f99157 !important;
  }

  /* punctuation */
  .prettyprint .pun {
    color: #cccccc !important;
  }

  /* lisp open bracket */
  .prettyprint .opn {
    color: #cccccc !important;
  }

  /* lisp close bracket */
  .prettyprint .clo {
    color: #cccccc !important;
  }

  /* a markup tag name */
  .prettyprint .tag {
    color: #ac8259 !important;
  }

  /* a markup attribute name */
  .prettyprint .atn {
    color: #e6ce9d !important;
  }

  /* a markup attribute value */
  .prettyprint .atv {
    color: #a0ab7f !important;
  }

  /* a declaration */
  .prettyprint .dec {
    color: #f99157 !important;
  }

  /* a variable name */
  .prettyprint .var {
    color: #f2777a !important;
  }

  /* a function name */
  .prettyprint .fun {
    color: #6699cc !important;
  }
}
/* Use higher contrast and text-weight for printable form. */
@media print, projection {
  .prettyprint .str {
    color: #006600 !important;
  }

  .prettyprint .kwd {
    color: #006 !important;
    font-weight: bold !important;
  }

  .prettyprint .com {
    color: #600 !important;
    font-style: italic !important;
  }

  .prettyprint .typ {
    color: #404 !important;
    font-weight: bold !important;
  }

  .prettyprint .lit {
    color: #004444 !important;
  }

  .pun, .opn, .clo {
    color: #444400 !important;
  }

  .prettyprint .tag {
    color: #006 !important;
    font-weight: bold !important;
  }

  .prettyprint .atn {
    color: #440044 !important;
  }

  .prettyprint .atv {
    color: #006600 !important;
  }
}

/* Style */
pre.prettyprint {
  background: #2d2d2d !important;
  font-family: Menlo, "Bitstream Vera Sans Mono", "DejaVu Sans Mono", Monaco, Consolas, monospace !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  border: 1px solid #cccccc !important;
  padding: 10px !important;
}

/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* IE indents via margin-left */
li.L0,
li.L1,
li.L2,
li.L3,
li.L4,
li.L5,
li.L6,
li.L7,
li.L8,
li.L9 {
  /* */
}

/* Alternate shading for lines */
li.L1,
li.L3,
li.L5,
li.L7,
li.L9 {
  background: transparent;
}



/* =============================================================================
   FIX
============================================================================= */

/* Responsive Video	*/
.youtube,
.tt-youtube-plugin {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.youtube embed, 
.youtube object, 
.youtube iframe, 
.tt-youtube-plugin embed, 
.tt-youtube-plugin object, 
.tt-youtube-plugin iframe 
 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* Icon size fix */
.entry-ccl img, .searchList img { width: 14px !important; }

/* IE Flicker fix */
html { filter: expression(document.execCommand("BackgroundImageCache", false, true)); }

/* Thumbnails box margin left fix */
.thumbnails { margin-left: 0; }

/* Bootstrap Fix Lines on Button (Retina) */
.btn:hover { background-position: inherit; }

/* Responsive Google Map */
.map iframe { width: 100% !important; }