/**
* Template Name: Selecao - v2.1.0
* Template URL: https://bootstrapmade.com/selecao-bootstrap-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); 

@font-face{font-family:'GilroyRegular';src:url("fonts/gilroy-regular-webfont.woff2") format("woff2"),url("fonts/gilroy-regular-webfont.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}
@font-face{font-family:'GilroySemiBold';src:url("fonts/gilroy-semibold-webfont.woff2") format("woff2"),url("fonts/gilroy-semibold-webfont.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}
@font-face{font-family:'GilroyBold';src:url("fonts/gilroy-bold-webfont.woff2") format("woff2"),url("fonts/gilroy-bold-webfont.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}


body {  font-family: 'GilroyRegular', 'Noto Sans KR', sans-serif;  word-break:keep-all;}
a {  color: #032D42;}
a:hover {  color: #86ED78;  text-decoration: none;}

h1{  font-family: 'GilroyBold', 'Noto Sans KR', sans-serif; }
h2, h3, h4, h5, h6 {  font-family: 'GilroySemiBold', 'Noto Sans KR', sans-serif; }
/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {  position: fixed;  display: none;  right: 15px;  bottom: 10px;  z-index: 99999;}
.back-to-top i {  display: flex;  align-items: center;  justify-content: center;  font-size: 24px;  width: 40px;  height: 40px;  border-radius: 50px;  
  background: rgba(3, 45, 66, 0.5); color: #fff;  transition: all 0.4s;}  
.back-to-top i:hover {  background: rgba(3, 45, 66, 1.0);  color: #86ED78;}

/*--------------------------------------------------------------
# Disable AOS delay on mobile
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {    transition-delay: 0 !important;  }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {  height: 70px;  transition: all 0.5s;  z-index: 997;  transition: all 0.5s;  background: rgba(3, 45, 66, 0);}
#header.header-transparent {  background: transparent;}
#header.header-scrolled {  background: rgba(3, 45, 66, 0.8);}
#header .logo h1 {  font-size: 28px;  margin: 0;  padding: 0;  line-height: 1;  font-weight: 700;  letter-spacing: 1px;}
#header .logo h1 a, #header .logo h1 a:hover {  color: #fff;  text-decoration: none;}
#header .logo img {  padding: 0;  margin: 0;  max-height: 40px;}

@media screen and (max-width: 980px) {  .header-scrolled {display: none !important}  }

/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Desktop Navigation */
.nav-menu, .nav-menu * {  margin: 0;  padding: 0;  list-style: none;}
.nav-menu > ul > li {  position: relative;  white-space: nowrap;  float: left;}
.nav-menu a {  display: block;  position: relative;  color: #fff;  padding: 5px 15px 7px 15px;  margin-left: 5px;  transition: 0.3s;  font-size: 15px;  border-radius: 50px; }
.nav-menu a:hover, .nav-menu .active > a, .nav-menu li:hover > a {  background: #032D42; color:#86ED78;  text-decoration: none;}
/*  .nav-menu .drop-down ul {  display: block;  position: absolute;  left: 0;  top: calc(100% - 30px);  z-index: 99;  opacity: 0;  visibility: hidden;  padding: 10px 0; background: fff;  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);  transition: ease all 0.3s;  border-radius: 15px;  margin-top: 5px;}
.nav-menu .drop-down:hover > ul {  opacity: 1;  top: 100%;  visibility: visible;}
.nav-menu .drop-down li {  min-width: 180px;  position: relative;}
.nav-menu .drop-down ul a {  padding: 10px 20px;  font-size: 14px;  font-weight: 500;  text-transform: none;  color: #2a2c39;}
.nav-menu .drop-down ul a:hover, .nav-menu .drop-down ul .active > a, .nav-menu .drop-down ul li:hover > a {  color: #86ED78;  background: none;}
.nav-menu .drop-down > a:after {  content: "\ea99";  font-family: IcoFont;  padding-left: 5px;}
.nav-menu .drop-down .drop-down ul {  top: 0;  left: calc(100% - 30px);}
.nav-menu .drop-down .drop-down:hover > ul {  opacity: 1;  top: 0;  left: 100%;}
.nav-menu .drop-down .drop-down > a {  padding-right: 35px;}
.nav-menu .drop-down .drop-down > a:after {  content: "\eaa0";  font-family: IcoFont;  position: absolute;  right: 15px;}

@media (max-width: 1366px) {  
  .nav-menu .drop-down .drop-down ul {    left: -90%;  }
  .nav-menu .drop-down .drop-down:hover > ul {    left: -100%;  }
  .nav-menu .drop-down .drop-down > a:after {    content: "\ea9d";  }
}*/

/* Mobile Navigation
.mobile-nav-toggle {  position: fixed;  right: 15px;  top: 15px;  z-index: 9998;  border: 0;  background: none;  font-size: 24px;  transition: all 0.4s;  outline: none important;  line-height: 1;  cursor: pointer;  text-align: right;}
.mobile-nav-toggle i {  color: #fff;}
.mobile-nav {  position: fixed;  top: 55px;  right: 15px;  bottom: 15px;  left: 15px;  z-index: 9999;  overflow-y: auto;  background: #fff;  transition: ease-in-out 0.2s; opacity: 0;  visibility: hidden;  border-radius: 10px;  padding: 10px 0;}
.mobile-nav * {  margin: 0;  padding: 0;  list-style: none;}
.mobile-nav a {  display: block;  position: relative;  color: #2a2c39;  padding: 10px 20px;  font-weight: 500;  outline: none;}
.mobile-nav a:hover, .mobile-nav .active > a, .mobile-nav li:hover > a {  color: #86ED78;  text-decoration: none;}
.mobile-nav .drop-down > a:after {  content: "\ea99";  font-family: IcoFont;  padding-left: 10px;  position: absolute;  right: 15px;}
.mobile-nav .active.drop-down > a:after {  content: "\eaa1";}
.mobile-nav .drop-down > a {  padding-right: 35px;}
.mobile-nav .drop-down ul {  display: none;  overflow: hidden;}
.mobile-nav .drop-down li {  padding-left: 20px;}

.mobile-nav-overly {  width: 100%;  height: 100%;  z-index: 9997;  top: 0;  left: 0;  position: fixed;  background: rgba(3, 45, 66, 0.6);  overflow: hidden;  display: none; transition: ease-in-out 0.2s;}
.mobile-nav-active {  overflow: hidden;}
.mobile-nav-active .mobile-nav {  opacity: 1;  visibility: visible;}
.mobile-nav-active .mobile-nav-toggle i {  color: #fff;}  */

.mobile-nav-toggle, .mobile-nav {display: none}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero {  width: 100%;  min-height:500px;  position: relative;  background:#032d42 url(../images/hero_bg.jpg) no-repeat center center; background-size: cover;
  padding: 50px 0;}
#hero h1 {color:#86ED78; font-size:62px; line-height: 70px; margin-top: 50px;}
#hero h3 {color:#ffffff; margin:30px 0}

#hero .btn-get-started {   font-family: 'GilroySemiBold', 'Noto Sans KR', sans-serif;  font-size: 18px;  letter-spacing: 1px;  display: inline-block;  padding: 12px 32px;  border-radius: 5px;  transition: 0.5s;  line-height: 1;  margin: 10px 0;  color: #fff;  -webkit-animation-delay: 0.8s;  animation-delay: 0.8s;  border: 2px solid #86ED78;}
#hero .btn-get-started:hover {  background: #86ED78;  color: #032D42;  text-decoration: none;}

@media (max-width: 980px) { 
  #hero { background:#032d42; background-image: none}
}


/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {  padding: 60px 0;  overflow: hidden;}
.section-title {  padding-bottom: 25px;}
.section-title h2 {  font-size: 16px;  font-weight: 500;  padding: 0;  line-height: 1px;  margin: 0 0 5px 0;  letter-spacing: 1;  color: #86ED78;  }
.section-title h2::after {  content: "";  width: 70px;  height: 1px;  display: inline-block;  background: #86ED78;  margin: 4px 10px;}
.section-title p {  margin: 0;  margin: 0;  font-size: 36px; font-family: 'GilroyBold';  color: #032D42;}

/*--------------------------------------------------------------
# Agenda
--------------------------------------------------------------*/
.agenda {background: #f4f5f8}
a {cursor: pointer}

.agenda table {width:100%; border-radius: 5px; border-bottom:1px #032D42 solid }
.agenda td {padding: 15px 15px;  font-size: 17px;  line-height: 1.4;  }
.agenda th {padding: 10px 15px; font-weight: normal;  text-align: center;  letter-spacing: 1px; color:#032D42; border-top:2px #032D42 solid; border-bottom:1px #032D42 solid }
.agenda tr:nth-child(odd) td {background: #e9ebf1}

.agenda .ses { font-family: 'GilroySemiBold', 'Noto Sans KR', sans-serif; }
.agenda .time {width:16%; color:#032D42;  font-family: 'GilroySemiBold' ; text-align: center; line-height: 1.2; vertical-align: top}
.spk {font-size:15px; padding-top: 15px;  color:#555d6a;}

.detailview {cursor: pointer}
.iconset {display: inline-block; white-space: normal; float:right}

.viewicon  {color:#032D42 !important;  border:1px #032D42 solid; padding:1px 4px;  display: inline-block; border-radius: 2px; font-size:13px !important; 
               transition: 0.3s;  -webkit-animation-delay: 0.4s;  animation-delay: 0.4s;  }
.detailview:hover .viewicon, .viewicon:hover {color:#86ED78 !important; background: #032D42}

.quizeventicon {color:#ffffff !important;  background: #fc1255; border:1px #fc1255 solid; padding:1px 4px;  display: inline-block; border-radius: 2px;   }
.liveicon      {color:#e74f52 !important;  background: #ffffff; border:1px #e74f52 solid; padding:1px 4px;  display: inline-block; border-radius: 2px;   }

.description {clear:both; font-size:14px !important; color:#555d6a; padding-top:10px ; margin-top:10px; border-top: 1px #e0e0e0 solid; }
.small {font-size:13px; letter-spacing: -0.5px}


@media (max-width: 780px) { 
	.agenda td {font-size:14px; padding:10px; }  	.agenda th {font-size:12px; padding:5px;}	
  .spk, .description {font-size:12px !important}
  .viewicon {font-size:12px !important; letter-spacing: -1px; }
}


/*--------------------------------------------------------------
# Speaker
--------------------------------------------------------------*/
.speaker th{width: 200px; padding:12px 20px 12px 0;}
.speaker th img{width: 180px; cursor: pointer}
.speaker td h6 {display: block; width:98%; border-top:1px #e0e0e0 solid; padding-top:10px; margin-top:10px; margin-bottom:20px;}

.modal  {z-index: 10000}
.modal-dialog {max-width: 600px;}
.modal-header {background: #032D42; border-bottom:0; padding: 10px 20px 5px 20px; border-radius: 0; min-height: 40px; color:#ffffff} 
.modal-body  {padding: 0 20px 0 20px; }

.modal-body p {font-size:14px;}


/*--------------------------------------------------------------
# Event
--------------------------------------------------------------*/
.event {background: #86ED78}
.event .section-title {  padding-bottom: 25px;}
.event .section-title h2 {  color: #ffffff;  }
.event .section-title h2::after {  background: #ffffff;  }

.event .row p {letter-spacing: -0.5px}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {  background: #000;  color: #fff;  font-size: 14px;  text-align: center;  padding: 17px 0;}
#footer .social-links {  margin: 0 0 40px 0;}
#footer .social-links a {  font-size: 18px;  display: inline-block;  background: #86ED78;  color: #fff;  line-height: 1;  padding: 8px 0;  margin-right: 4px;  border-radius: 0%; text-align: center;  width: 36px;  height: 36px;  transition: 0.3s;}
#footer .social-links a:hover {  background: #bd5102;  color: #fff;  text-decoration: none;}
#footer .copyright {  margin: 0 0 5px 0;}