@charset "UTF-8";
/* Upper Menu Header */
* { font-family: 'Roboto', sans-serif; }
* ul { list-style: none; padding: 0; }

.upper_blue_line { padding: 5px; position: static; left: 0; top: 0; width: 100%; background-color: #10134c; }

.upper_header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 16px; padding-top: 20px; }
.upper_header .side_logo img { display: none; }
.upper_header .upper_menuwrap { padding-top: 10px; }
.upper_header .upper_menuwrap ul.upper_menu { display: flex; flex-direction: row; align-items: center; padding: 0; }
.upper_header .upper_menuwrap ul.upper_menu li.sitemap_box { padding-right: 40px; }
.upper_header .upper_menuwrap ul.upper_menu li.sitemap_box a { color: #FFFFFF; font-weight: 500; text-decoration: none; }
.upper_header .upper_menuwrap ul.upper_menu .english_box { background-color: #032B7D; padding: 10px 25px; }
.upper_header .upper_menuwrap ul.upper_menu .english_box a { font-weight: bold; color: #FFFFFF; text-decoration: none; }
.upper_header .upper_menuwrap ul.upper_menu .indonesia_box { background-color: #78ADE6; padding: 10px 25px; }
.upper_header .upper_menuwrap ul.upper_menu .indonesia_box a { font-weight: bold; color: #FFFFFF; text-decoration: none; }

/* Main Menu Header */
nav { width: 100%; }

.phone_menu { display: none; }

.button_wrap { display: flex; justify-content: flex-end; }

nav header .main_menu .long_menu { display: flex; flex-direction: row; white-space: nowrap; }
nav header .main_menu .long_menu a { color: #02217A; text-decoration: none; cursor: pointer; width: 25%; padding: 15px; text-align: center; background-color: white; border-right: 1px solid #02217A; transition: 0.5s; font-weight: bold; }
nav header .main_menu .long_menu a:hover { color: #FFFFFF; background-color: #02217A; }
nav header .main_menu .long_menu #first_menu { border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
nav header .main_menu .long_menu #last_menu { border-right: 0; border-top-right-radius: 3px; border-bottom-right-radius: 3px; }

@media screen and (max-width: 1024px) { .long_menu a { font-size: 14px; width: 30%; } }
@media screen and (max-width: 768px) { .phone_menu { display: flex; }
  .modal { padding-right: 0px !important; }
  .modal-dialog { max-width: 100%; }
  .upper_blue_line { display: none; }
  .upper_header { display: none; }
  nav { display: none; }
  .burger_button { display: flex; justify-content: flex-end; padding: 1rem; padding-right: 0; }
  .burger_button img { max-width: 100%; }
  #lang_button { padding-right: 0; }
  .close { opacity: 1; text-shadow: none; color: none; line-height: 0; font-weight: 0; font-size: 0; }
  .modal-dialog { margin: 0; padding: 0; width: 100%; height: 100%; }
  .modal-header { padding: 1rem; border: none; }
  .modal-content { border-radius: 0; background-color: rgba(0, 10, 77, 0.86); height: auto; min-height: 100%; }
  .modal-body { display: flex; flex-direction: column; padding: 0 1rem 1rem 1rem; }
  .modal-body li { padding-top: 2rem; padding-bottom: 2rem; font-size: 21px; font-weight: bold; border-bottom: 1px solid #FFFFFF; }
  .modal-body li a { color: #FFFFFF; text-decoration: none; }
  .modal-body #mobile_first_1 { border-top: 1px solid #FFFFFF; }
  .rules_menu { display: flex; flex-direction: column; text-decoration: none; padding-top: 3rem; }
  .rules_menu li { font-size: 16px; font-weight: bold; color: #FFFFFF; padding-bottom: 1rem; padding-top: 0; border-bottom: none; }
  .language_menu li { display: flex; align-items: center; text-decoration: none; }
  .language_menu li span { padding-left: 10px; }
  .language_menu #mobile_first_2 { border-top: 1px solid #FFFFFF; } }
/*IE専用*/
@media screen and (min-width: 0\0) { nav header .main_menu .long_menu { white-space: normal; }
  #second_menu { display: flex; justify-content: center; align-items: center; }
  #third_menu { display: flex; justify-content: center; align-items: center; }
  #fourth_menu { display: flex; justify-content: center; align-items: center; }
  #last_menu { display: flex; justify-content: center; align-items: center; } }

/*# sourceMappingURL=top_header.css.map */
