/*font*/
@import url('https://fonts.googleapis.com/css?family=Noto+Sans');
@import url('http://cdn.rawgit.com/hiun/NanumSquare/master/nanumsquare.css');
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url('https://webfontworld.github.io/SCoreDream/SCoreDream.css');



.notosans{ font-family: 'Noto Sans', sans-serif; }
.nanum_square { font-family: 'Nanum Square'; }
.nanum_gothic { font-family: 'Nanum Gothic', serif; }
.Nanum_myeongjo{ font-family: 'Nanum Myeongjo', serif; }
.SCoreDream { font-family: 'SCoreDream', serif; font-size:14px;}

.c-white {color:#fff;}


body { position: relative; font-family: 'SCoreDream','Nanum Gothic', serif; font-size:16px; }

h1, h2, h3, h4, h5, p { word-break: keep-all; }
li { word-break: keep-all; }
a:active, a:focus, button { outline: none !important; }

.container{ padding-right: 18.75% !important; padding-left: 18.75% !important; margin: 0 !important;}

#header { position: relative; height: 80px;}
@media all and (max-width: 425px) {
    #header { height: 70px;}
}
#header .container { background-color: #fff; border-color: #fff !important;}
@media all and (max-width: 768px) {
    #header .container .row .navbar .container { padding-right: 10.75% !important; padding-left: 10.75% !important; }
}
#header .container .navbar-header { height: 100%; }
#header .navbar-brand>img { position: relative; }
@media all and (max-width: 425px) {
#header .navbar-brand>img { width: 80%; top: 3px; }
}
#header .navbar-toggle { position: absolute; right: 0%; padding: 7px 7px !important; margin-top: 12px;}
#header .container .navbar { border: 0px !important; }
#header .navbar-collapse { border: 0px; }
#header .container .nav.navbar-nav { margin: 15px 0; width: auto; background-color: #fff; }
@media all and (max-width: 767px) {
    #header .container .nav.navbar-nav { width: 100%; position: absolute; left: 0; padding-right: 0; margin: 0; }
}
@media all and (min-width: 767px) {
    .navbar-nav>li { float: left; height: 65px; }
}
.navbar-inverse .navbar-nav > li > a { color: #000 !important; font-weight: 700; padding-left: 20px; padding-right: 20px;}
@media all and (max-width: 767px) {
.navbar-inverse .navbar-nav > li > a { padding: 10px 65px; text-align: center; }
}
.navbar-inverse .navbar-nav > li:hover{ border-bottom: 3px solid #e73953 !important; color: #e73953 !important; background-color: transparent !important; transition: border 0.2s ease-in-out; }

.navbar-inverse .navbar-nav > li:hover a { color: #e73953 !important;  }
#header .container { width: 100%; height: 100%; }
@media all and (max-width: 940px) {
#header .container { padding-left: 16.25% !important; padding-right: 16.25% !important; }
}
@media all and (max-width: 425px) {
#header > .container { padding-right: 10.75% !important; padding-left: 10.75% !important; }
}
#header .container .navbar-inverse { background-color: #fff; border-color: #fff; height: 80px; }
@media all and (max-width: 425px) {
#header .container .navbar-inverse { height: 70px; }
}
#header .container .navbar-header { margin-left: -15px !important; padding: 0; margin-right: -15px !important;}
@media all and (max-width: 890px) {
#header .container .navbar-header { margin-left: -75px !important; }
}
@media all and (max-width: 768px) {
#header .container .navbar-header { margin-left: -15px !important; }
}
@media all and (max-width: 425px) {
#header .container .navbar-header { margin-left: -43px !important; margin-right: -30px !important; }
}
#header .container .navbar-nav { margin-right: -15px !important; padding-right:0;}
@media screen and (max-width: 767px){
    ul.navbar-nav li.right,
    ul.navbar-nav li {float: none;}
}
#header .navbar-brand { padding: 26px 15px !important; }
@media screen and (max-width: 425px){
   #header .navbar-brand { padding: 22px 20px !important; height: 70px; }
}
@media screen and (max-width: 375px){
   #header .navbar-brand { padding: 22px 25px !important; height: 70px; }
}
@media screen and (max-width: 320px){
   #header .navbar-brand { padding: 22px 30px !important; height: 70px; }
}
#header .navbar-toggle {background-color: #fff; padding: 10px; top: 12%; border-radius: 0px; }
.navbar-inverse .navbar-toggle .icon-bar { background-color: #000 !important; width: 17px; }
.navbar-toggle { -ms-transition: all 0.4s ease; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; }


#footer {background-color: #2a2f36 !important; color:#fff; height: 100px;}
@media all and (max-width: 425px) {
    #footer { height: 93px;}
}
#footer > .container { width: 100%; height:100%; }
@media all and (max-width: 425px) {
#footer > .container { padding-right: 10.75% !important; padding-left: 10.75% !important; }
}
#footer > .container > .row {  height:100%; }
#footer > .container > .row > div { width: 100%; height:100%; padding: 40px 0 0 !important}
#footer > .container > .row > div div { padding: 0 0 0 3px !important; height: 100%; }
#footer > .container > .row > div > div > img { float: left; position: relative; width: auto; }
@media all and (max-width: 980px) {
    #footer > .container > .row > div > div > img {    width: 90%; }
}
@media all and (max-width: 425px) {
    #footer > .container > .row > div > div > img {    left: 0; width: 90%;}
}
#footer > .container > .row > div > div > h5 { text-align: left; margin: 0;  font-size: 1.4em;}
@media all and (max-width: 768px) {
    #footer > .container > .row > div > div > h5 {  }
}
@media all and (max-width: 425px) {
    #footer > .container > .row > div > div > h5 { font-size: 1.0em; }
}

.btn { border-radius: 0px; color:#fff;  padding: 12px 50px; border:solid 1px #ff0000;  }