#container{
    display : flex;
}
.navbar-toggle {
  position: relative;
  float: right;
  padding: 9px 10px;
  margin-top: 8px;
  margin-right: 15px;
  margin-bottom: 8px;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 4px;
}
.navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
    background-color: #ffffff;
}

/*모바일용 탑메뉴 시작*/
.nav {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.nav:before,
.nav:after {
  display: table;
  content: " ";
}

.nav:after {
  clear: both;
}


.nav > li {
  position: relative;
  display: block;
}

.nav > li > a {
  position: relative;
  display: block;
  padding: 10px 15px;
}

.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: #eeeeee;
}

.nav > li.disabled > a {
  color: #999999;
}

.nav > li.disabled > a:hover,
.nav > li.disabled > a:focus {
  color: #999999;
  text-decoration: none;
  cursor: not-allowed;
  background-color: transparent;
}

.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
  background-color: #eeeeee;
  border-color: #428bca;
}

.nav .nav-divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}

.nav > li > a > img {
  max-width: none;
}
.navbar-toggle .icon-bar + .icon-bar {
  margin-top: 4px;
}


.collapse {
  display: none;
}

.collapse.in {
  display: block;
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height 0.35s ease;
    -moz-transition: height 0.35s ease;
    -o-transition: height 0.35s ease;
    transition: height 0.35s ease;
}

.navbar-collapse {
  background-color : #222;
  max-height: 340px;
  padding-right: 15px;
  padding-left: 15px;
  overflow-x: visible;
  border-top: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-overflow-scrolling: touch;
}

.navbar-collapse:before,
.navbar-collapse:after {
  display: table;
  content: " ";
}

.navbar-collapse:after {
  clear: both;
}

.navbar-collapse.in {
  overflow-y: auto;
}

@media (min-width: 768px) {
  .navbar-collapse {
    width: auto;
    border-top: 0;
    box-shadow: none;
  }
  .navbar-collapse.collapse {
    display: none !important;
    height: auto !important;
    padding-bottom: 0;
    overflow: visible !important;
  }
  .navbar-collapse.in {
    overflow-y: visible;
  }
  .navbar-collapse .navbar-nav.navbar-left:first-child {
    margin-left: -15px;
  }
  .navbar-collapse .navbar-nav.navbar-right:last-child {
    margin-right: -15px;
  }
  .navbar-collapse .navbar-text:last-child {
    margin-right: 0;
  }
}

.container > .navbar-collapse {
  margin-right: -15px;
  margin-left: -15px;
}

@media (min-width: 768px) {
  .container > .navbar-collapse {
    margin-right: 0;
    margin-left: 0;
  }
}
@media (max-width: 767px) {
  .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    box-shadow: none;
  }
  .navbar-nav .open .dropdown-menu > li > a,
  .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
  }
  .navbar-nav .open .dropdown-menu > li > a {
    line-height: 20px;
  }
  .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-nav .open .dropdown-menu > li > a:focus {
    background-image: none;
  }

  #header {
      top : 0 !important;
      position : fixed !important;
      z-index : 1030 !important;
  }
}
/*모바일용 탑메뉴 끝*/

#togglemenu {
    display : none;
} 
#togglemenu:checked + #leftmenu-zone{
    display : inline-block;
    position : absolute;
    top: 20px;
    left: 0;
    height : 100%;
    overflow-y : auto;
    z-index : 100;
}
#togglemenu:checked + .toggleButton {
    background-image: url('/Images/button/essential_set_close-128.png');
    background-size : 20px;
}
.toggleButton {
    position: fixed !important;
    top: 75px;
    left: 0;
    z-index: 1;
    display: block;
    width: 20px;
    height: 20px;
    cursor: pointer;
    -webkit-transition: width 2s, height 2s, background-color 2s, -webkit-transform 2s;
    -moz-transition: width 2s, height 2s, background-color 2s, transform 2s;
    -o-transition: width 2s, height 2s, background-color 2s, transform 2s;
    transition: width 2s, height 2s, background-color 2s, transform 2s;
    background-image: url('/Images/button/right_arrow_point_menu-128.png');
    background-size: 20px;
}
@media (min-width:768px){
    .navbar-toggle , .toggleButton, .navbar-collapse{
        display: none;
    }
    .top-script-mobile, .gender-mobile{
        display : none;
    }
}
@media (max-width : 768px){
    body{
        background-image : none;
    }
    #wrapper #header {
        min-width : 100%;
    }
    #wrapper #header .head_area{
        width : 100%;
    }
    #wrapper #header .top_menu{
        display : none;
    }
    #wrapper #header .navi_area{
        display : none;
    }
    /*하위메뉴 탑 이미지*/
    #wrapper #sub_visual {
        display : none;
    }
    /*left 메뉴*/
    #leftmenu-zone {
       display : none;
       position : fixed !important;
       top : 95px !important;
       background: #808080 !important;
    }

    #container #contents{
         margin-left:0px;
    }

    #wrapper #container{
        top : 55px;
    }

    #wrapper #container, #wrapper #container #contents, #wrapper #container #content_wide {
        /*float :none;*/
        width : 100%;
    }
    
    #main-visual-box{
        display : none;
    }
    #main_container{
        width: 100%;
        top : 30px;
    }
    #main_container .main-top-box{
        width : 100%;
    }
    #main_container .main-top-box .main-notice{
        float : none !important;
        width : 94% !important;
    }
    #main_container .main-top-box .main-notice .more{
        left: auto;
        right : 20px !important;
    }
    #main_container .main-top-box .main-donation {
        float : none !important;
        width : 94% !important;
        background-size : cover;
    }
    #main_container .main-top-box .main-donation .more{
        left: auto;
        right : 20px !important;
    }
    #main_container .main-mid-box{
        width : 100%;
    }
    #main_container .main-schedule{
        float : none !important;
        width : 94% !important;
    }
    #main_container .main-donghang {
        float : none !important;
        width : 94% !important;
    }
    /*메인 갤러리*/
    #main_container .main-btm-box .gallery-box{
        width : 100% !important;
    }
    #main_container .main-btm-box .gallery-box > ul > li {
        display : none;
    }
    #main_container .main-btm-box .gallery-box > ul > li:first-child{
        display : block;
        width : 100%;
    }
    #main_container .main-btm-box .gallery-box ul li .photo-box p{
        width : 100% !important;
        height : auto;
    }
    #main_container .main-btm-box .gallery-box ul li .photo-box p img{
        width : 100% !important;
    }
    #main_container .main-btm-box .gallery-box ul li .photo-box span{
        width : 100% !important;
    }

     /*SNS Box*/
    #main_container .main-btm-box .sns-box{
        display : none;
    }
    #main_container .main-btm-box .sns-box-media{
        width : 100%;
        display : block;
        text-align : center;
    }
    #main_container .main-btm-box .sns-box-media li{
        display : inline;
        padding-left : 50px;
    }
    #main_container .main-btm-box .sns-box-media li:first-child{
        padding-left : 0;
    }

    /*푸터*/
    #footer .footer_zone{
        width : 100%;
        text-align : center !important;
    }
    #footer .footer_zone .footer_menu{
        position : relative;
        float : none;
        top : 0 !important;
        text-align : center;
    }
     #footer .footer_zone .footer_menu li{
         display : inline-block;
         text-align : center;
         float : none;
     }
    #footer .footer_zone address{
        position : relative;
        float : none;
        top : 0 !important;
    }

    /*댓글 영역*/
    .comment-zone .comment-input p{
        padding-left : 10px;
        padding-right : 10px;
    }
    .comment-zone .comment-input textarea {
        width : 60% !important;
    }
    .detail_board .detail_academy_inner .write_input textarea{
        width : 75% !important;
    }
    .comment-zone .comment-input .reply_btn{
        position : relative !important;
    }

    /* 10분 동사섭 & 아카데미 동영상 사이즈*/
    .youtube_detail01 {
        width : 100% !important;
    }
    .youtube_detail01_txt , .academy_detail01_txt {
        width : 93% !important;
    }
    .dongsasub_youtube li{
        width : 100% !important;
        height : 400px !important;
    }
    .resizable_w376 {
        width : 100% !important;
        height : 360px !important;
    }
    .resizable_w376 div{
        height : 100%;
    }

    .academy_list_wrap li{
        width : 100% !important;
        height : 400px !important;
    }
    .resizable_w239 {
        width : 100% !important;
        height : 360px !important;
    }
    .resizable_w239 div{
        height : 100%;
    }

    .resizable_w769 , .resizable_w1000{
        width : 100% !important;
    }
    .academy_level2 , .academy_level3{
        width : 100% !important;
        text-align : center ;
    }
     .academy_level2 > ul, .academy_level3 > ul {
         display : inline;
     }
    .academy_level2 > ul > li, .academy_level3 > ul > li{
        width : 30% !important;
        float : none !important;
        display : inline-block;
        text-align : center;
    }

    .academy_level3 > ul > li > a , .academy_level3 li .tab_on , .academy_level3 li a:hover {
        width : 100% !important;
    }
    
    /*관련 동영상*/
    .detail_board .youtube_list{
       position:relative;
       width : 100%
    }
    .detail_board .youtube_list ul li{
        display : inline-block;
    }

    .detail_board .detail_board_inner, .detail_board .detail_academy_inner{
        width: 100% !important;
    }

    .board-list table{
        width : 100% !important;
    }

    /*다음글 이전글*/
    .prevnext-zone ul li a {
        max-width: 65%;
        display: block;
        overflow-x: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /*행복갤러리*/
    .gallery-list{
        width : 100% !important;
    }
    .gallery-list li{
        width : 95% !important;
        margin-left : 0 !important;
        margin-right : 0 !important;
    }
    .gallery-list li div, .gallery-list li div img {
        width : 100% !important;
        height : auto !important;
    }

    /*w재단법인 행복마을*/
    .happyvillage {
        width : 100% !important;
        text-align : center ;
    }

    .happyvillage ul li, .happyvillage li.on, .happyvillage li:hover{
        width : 23% !important;
        float : none !important;
        text-align : center;
    }
    .purpose {
        width : 100% !important;
        padding-left : 0 !important;
        padding-right : 0 !important;
    }
    #village_3 img{
        width : 100% !important;
    }

    /*수련신청*/
    .dn-form2 th{
        display : none;
    }
    .application-con .top-script{
        display : none;
    }
    .top-script-mobile{
        padding-bottom : 20px;
        padding-left : 15px;
    }
    .btn-zone-ct, .btn-zone{
        padding-bottom : 30px;
    }

    /*회원가입*/
    .member .join table th,.member .join_input table th{
        display : none;
    }
    .member .join table td,.member .join_input table td{
       width:100%;
       padding-left : 1em;
    }
}