body {background-color: #fff;}

#wrap {width: 100%; position: relative; overflow-x: hidden;}
#container {width: 100%;}
.contents_area {display: block;}
.contents_area_1280 {display: none;}
.contents_area_m {display: none;}

.main_area {display: block;}
.main_area_1280 {display: none;}
.main_area_1920 {display: none;}

.ft_menu {display: block;}

#myCarousel {display: block;}
#myCarousel2 {display: none;}

/* header menu */
#header .in_header .global_menu {position: absolute; right: 0;  top: 10px;}
#header .in_header .global_menu li {float: left;}
#header .in_header .global_menu li a {display: block; padding: 5px 21px 5px 21px; color: #ffffff; font-weight: bold; font-size: 13px;}

.navbar-collapse{padding: 0 10px 0 10px;}
.navbar {background-color: #00aee8; border-color: #00aee8; height: 47px;}
.navbar-default {border: none; margin: 0; border-radius: 0;}
.navbar-default-2 {background-color: #f5f6f7; border: none; margin: 0; border-radius: 0; height: 100px;}
.container-fluid {background-color: #00aee8; padding-left: 5%; padding-right: 3%; height: 50px;}
.container-fluid-2 {height: 168px; width: 100%; ;max-width: 480px; margin: auto; text-align: center; padding: 62px 0 0;}
.container-fluid-3 {background-color: #00aee8; height: 60px; width:100%; text-align: center;}
.navbar-default .navbar-nav > li {height: 50px;}
.navbar-default .navbar-nav > li > a {padding-top: 13px; padding-left: 25px; padding-right: 25px; height: 50px; color: white;}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {background-color: #00aee8; color: white;}

.navbar-default .navbar-toggle {border-color: #00aee8; background-color: #00aee8;}
.navbar-default .navbar-toggle .icon-bar {background-color: white;}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {border-color: #00aee8; background-color: #00aee8;}
.navbar-collapse .collapse {height: 70px;}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {width: 100%; height: 460px; height: 460px;}

.logo {padding-right: 0; padding-top: 0; padding-bottom: 0;}
.logo .img {position: relative; width: 150px; top: 20%;}
.logo .img-2 {width: 158px; height: 60;}
.logo .parents_logo {position: relative; width: 150px; top: 25%;}

.navbar-collapse.collapse {height: 50px;}

.main_center {background-position: center; margin: auto; width: 100%;}
.main_center .col-md-10 {width: 100%; overflow: hidden; left: 10%;}
.main_visual {width: 100%; margin: 0 0 0 0; padding: 0;}
.main_visual-2 {width: 100%; margin: 0 0 20px 0; padding: 0;}
.main_visual .slider img {width: 100%; max-height: 500px;}

.main_visual .inner_container .page {color: #00aee8; float: right; font-size: 15px; font-weight: 100;}
.main_visual .inner_container .icon img {width: 4.5%; position: relative;}
.main_visual .inner_container .title_img {width: 85px; max-height: 10px;}
.main_visual .inner_container .title_img2 {width: 110px; max-height: 21px;}
.main_visual .inner_container .title_img3 {width: 135px; max-height: 0; position: relative;}

/* parents page */
.inner_container .width_perfect {
  width: 100%;
}

.inner_container .parents_text_img {
  width: 92%;
  margin: 30px 4% 10px 4%;
}

.inner_container .parents1280_text_img {
  position: absolute;
  width: 25%;
  top: 2%;
  right: 5%;
}

.position_relative {
  position: relative;
}

.inner_container .parents_common_btn {
  width: 72%;
  margin: 0 14% 30px 14%;
}

.inner_container .parents_reservation_btn_div {
  margin-top: 80px;
  text-align: center;
}

.inner_container .parents_reservation_btn_div img {
  width: 60%;
}

.inner_container .parents_footer {
  margin-top: 100px;
}
.visang_logo {
  margin:70px 0;
  text-align: center;
}

/* max-width 일때 작은 부분 */
@media (max-width: 768px) {
    .visang_logo img {width: 100%; padding: 0 20px;}
}

/* parents login */
.gray_bg {
  background: #f5f6f7;
}

.login_page_row {
  padding: 0 12px;
}

.center-content {
  width: 100%;
  max-width: 480px;
  margin: auto;
  margin-top: 44px;
}

.margin-bottom-60 {
  margin-bottom: 60px;
}

.center-content > font {
  color: #ababab;
  font-size: 0.625em;
  text-align: center;
  margin-right: 6%;
  margin-left: 6%;
}

.btn_res {
  margin: 70px 0;
  text-align: center;
}

.btn_res input {
  background-color: #004DB6;
  border-radius: 20px;
  behavior: url( "css/PIE.htc" );
  border: none;
  color: #fff;
  padding:10px 25px;
  font-size: 20px;
}

.contents_area img,
.contents_area_1280 img,
.contents_area_m img {
  width: 100%;
}

.reserv-div {
  width: 620px;
}

.explain-subject {
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.warning {
  margin-top: 20px;
}

.explain-content {
  width: 100%;
  max-width: 480px;
  margin: auto;
  margin-top: 40px;
  padding: 0 12px
}

.warning > ul > li {
  color: red
}

.explain-submit {
  width: 100%;
  max-width: 480px;
  margin: auto;
  margin-top: 20px;
  padding: 0 12px
}

.explain-logo {
  display: none;
}

.popup-input {
  margin-top: 10px;
}

.img_radius {
  border-radius: 25px;
}

#myCarousel {background-color: transparent; box-shadow: none; position: relative; height: 460px;}
#myCarousel .carousel-inner {height: 460px; width: 100%;}
#myCarousel .carousel-inner .text_img1 img {width: 30%;}

.box {padding: 5% 5% 5% 5%;}
.box-2 {padding: 3% 5% 3% 5%;}
#box1 a img,
#box2 a img,
#box3 a img,
#box4 a img {
  border-radius: 10px;
  width: 100%;
}

.contents_area img {width: 100%;}
.carousel-caption {right: -30%; bottom: 20%; text-shadow: none;}
.carousel-caption p {font-size: 20px; color: #004db6; text-align: right;}
.carousel-caption p span {font-size: 25px; font-weight: bolder;}
.carousel-caption p img {width: 240px;}
.carousel-caption p img {width: 240px;}

.panel {margin-bottom: 20px; background-color: #fff; border: 1px solid transparent; border-radius: 4px; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .05); box-shadow: 0 0 rgba(0, 0, 0, .05);}
.panel-default {border-color: #ffffff;}
.panel-default > .panel-heading {color: #333; background-color: #f5f5f5; border-color: #ddd;}
.panel-default > .panel-heading + .panel-collapse > .panel-body {border-top-color: #ddd;}
.panel-default > .panel-heading .badge {color: #f5f5f5; background-color: #ffffff;}
.panel-default > .panel-footer + .panel-collapse > .panel-body {border-bottom-color: #ffffff;}
.btn {display: inline-block; margin-bottom: 0; font-size: 14px; font-weight: normal; vertical-align: middle; text-align: center; white-space: nowrap;
    cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 0; border-radius: 10px;}
.btn-primary {font-size: 120%; height: 50px; color: #666666; background-color: #ffce00; border: 0; vertical-align: middle;}
.btn-primary .badge {color: #fff; background-color: #00aee8;}
.btn-warning {color: #fff; background-color: #00aee8; border: 0; margin-bottom: 20px; border-radius: 6px;}

.cencelBtn {color: #ffffff;}

@media (min-width: 1280px) {
    .main_area {display: none;}
    .main_area_1280 {display: block;}

    /* 결과지 설명 로그인 페이지 모바일*/
    .explain-logo {
      display: block;
    }
    .explain-subject-font {
      margin-left: -15%;
    }
}

@media (max-width: 993px) {
  .col-sm-6 {width: 50%;}
  #box1, #box2 {margin-bottom: 5%;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 70%;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 70%;}
  .nav > li.headermenu2 {display: block;}
}

@media (max-width: 956px) {
  .col-sm-6{width: 50%;}
  #box1, #box2 {margin-bottom: 5%;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 50%;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 50%;}
  .nav > li.headermenu2 {display: block;}
}

@media (max-width: 1280px) {
  .contents_area {display: none;}
  .contents_area_1280 {display: block;}
  .contents_area_m {display: none;}
}

@media (max-width: 1000px) {
  .navbar-header {float: none;}
  .navbar-left, .navbar-right {float: none !important;}
  .navbar-toggle {display: block;}
  .navbar-collapse {box-shadow: inset 0 1px 0 rgba(255,255,255,0.1); background: #00aee8; float: right;}
  .navbar-collapse.collapse {display: none !important;}
  .navbar-nav {float: none!important;}
  .navbar-nav > li {float: none; padding-left: 30px;}
  .navbar-nav > li > a {padding-top: 10px; padding-bottom: 10px;}
  .nav > li > a {padding-top: 10px; padding-bottom: 10px;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 70%;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 70%;}
  .nav > li.headermenu1 {display: none;}
  .nav > li.headermenu2 {display: block;}

  .contents_area {display: none;}
  .contents_area_1280 {display: none;}
  .contents_area_m {display: block;}
  .ft_menu {display: none;}
  #footer .ft_info {padding: 30px 0 30px 0; position: relative; color: #a7a7a7; text-align: center; font-size: 12px;}
  #footer a {width: 100%; height: 200px; background-color: #000; color: #a7a7a7; padding: 0 5px 0 5px;}
  .navbar-collapse.collapse {height: auto;}
  .navbar-default .navbar-collapse {border-color: #00aee8;}
  .navbar-default .navbar-nav > li > a {padding-left: 10px; padding-right: 10px;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 70%; width: 30%; padding: 0 5px 0 5px;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 70%; width: 30%; padding: 0 5px 0 5px;}
  .nav > li.headermenu2 {display: block;}
}

@media (max-width: 768px) {
  .contents_area {display: none;}
  .contents_area_1280 {display: none;}
  .contents_area_m {display: block;}
  .col-sm-6 {width: 50%;}
  #box1, #box2 {margin-bottom: 5%;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 70%;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 70%;}
  .nav > li.headermenu2 {display: block;}
}

@media (max-width: 700px) {
  #myCarousel {display: none;}
  #myCarousel2 {display: block;}
  .navbar-red {height: 57px;}
  .sideMenuContents {visibility: hidden;}
  .contents {position: relative; margin-left:5%; margin-right:5%; margin-bottom:3%; display: block; word-break: break-all; z-index: 100;}
  #box1, #box2 {margin-bottom: 5%;}
}

@media (max-width: 600px) {
  .col-sm-6{width: 50%;}
  #box1, #box2 {margin-bottom: 5%;}
  .navbar-collapse {width: 40%;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 69%; width:34%; padding: 0 5px 0 5px;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 69%; width:34%; padding: 0 5px 0 5px;}
  .navbar-default .navbar-nav > li > a {padding-left: 5px; padding-right: 5px;}
  .nav > li.headermenu2 {display: block;}
}

@media (max-width: 400px) {
  .contents_area {display: none;}
  .contents_area_1280 {display: none;}
  .contents_area_m {display: block;}
  .navbar-collapse.collapse {height: auto;}
  .navbar-default .navbar-collapse {border-color: #00aee8;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 70%; width: 34%; padding: 0 5px 0 5px;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 70%; width: 34%; padding: 0 5px 0 5px;}
  .nav > li.headermenu2 {display: block;}
}

@media (max-width: 350px) {
  .contents_area {display: none;}
  .contents_area_1280 {display: none;}
  .contents_area_m {display: block;}
  .navbar-collapse.collapse {height: auto;}
  .navbar-default .navbar-collapse {border-color: #00aee8;}
  .navbar-nav {margin-top: 0 0 0 0;}
  .collapse.in {display: block !important; position: absolute; z-index: 999; left: 65%; width: 40%; padding-left: 5px;}
  .collapsing {display: block !important; position: absolute; z-index: 999; left: 65%; width: 40%; padding-left: 5px;}
  .nav > li.headermenu2 {display: block;}
}

#footer {background-color: #000; margin-top: 50px;}
#footer .ft_menu {margin-top: 30px; color: #a7a7a7; text-align: center;}
#footer .ft_menu span {margin: 0 5% 0 5%;}
#footer .ft_info {padding: 30px 0 30px 0;  position: relative; color: #a7a7a7; text-align: center; font-size: 12px;}
#footer a {width: 100%; height: 200px; background-color: #000; color: #a7a7a7;}
