@charset "utf-8";

@media only screen and (max-width:768px){

  .mobile{display: block}

  #hd{border-bottom: 0;}
  #hd .top_banner{display: none;}
  #hd .top_banner div{min-width: 100%; padding: 0 15px;}

  #hd, #wrapper, #ft{min-width: 100%;}
  #hd .headerin{min-width: 100%;}
  #hd .headerin > div.cate{min-width: 100%; padding: 0 15px; position: absolute; padding-bottom: 40px; left: 0; top: 302px; display: none;}
  #hd .headerin > div.cate .gnb_mnal{margin-right: 0; width:calc(100% - 30px); position: absolute; left:15px; bottom:0;}
  #hd .headerin > div.cate .gnb_mnal button{background:#eff1f5; padding-left: 0; width: 100%; height: 40px; border-radius: 30px; line-height: 30px; font-size: 13px;}
  #hd .headerin > div.cate > a{display: none;}
  #hd .headerin > div.cate #gnb{width: 100%; height: auto; padding-bottom: 16px;}
  #hd .headerin > div.cate #gnb .gnb_wrap #gnb_1dul{padding:0;}
  #hd .headerin > div.cate #gnb .gnb_wrap #gnb_1dul span.gnb_1dli{width: 25%; border-right: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7;}
  #hd .headerin > div.cate #gnb .gnb_wrap #gnb_1dul span.gnb_1dli:nth-child(4n){border-right: 0;}
  #hd .headerin > div.cate #gnb .gnb_wrap #gnb_1dul span.gnb_1dli:nth-child(n + 17){border-bottom: 0;}
  #hd .headerin > div.cate #gnb .gnb_wrap #gnb_1dul span.gnb_1dli a.gnb_1da{font-size: 12px; line-height:3; padding: 0;}

  #hd .headerin > div#hd_wrapper{padding: 0 15px; position: relative;}
  #hd .headerin > div#hd_wrapper .hd_sch_wr{width: 100%; margin:10px 0;}

  #hd .headerin > div#hd_wrapper .hd_login{display: none;}
  #hd .headerin > div#hd_wrapper .profile_btn{display: none;}
  #hd .headerin > div#hd_wrapper > div.mobile_menu{background: url(/theme/nofee/img/icon_menu_b.svg) no-repeat; width: 30px; height: 30px; margin-right: 0; position: absolute; right: 15px; top: 0; background-size: cover;}

  #container_wr.main{min-width: 100%;}
  #container_wr.main .cons{min-width: 100%; padding: 0 15px; margin: 50px auto;}
  #container_wr.main .cons > p{font-size: 20px;}
  #container_wr.main .cons > p b{font-size: 20px;}

  #container_wr.main .cons.con01{margin:0 0 310px 0; height: auto; padding: 0;}
  #container_wr.main .cons.con01 .row.main_img{width: 100%; position: relative;}
  #container_wr.main .cons.con01 .row.main_img .slick-slide{background: none; margin: 0; border-radius: 0;}
  #container_wr.main .cons.con01 .row.main_img .slick-slide img{opacity: 1;}

  #container_wr.main .cons.con02 .row.boxs .box{margin-right: 0px; width:100%;}
  #container_wr.main .cons.con02 .row.boxs .box:nth-child(n + 2){margin-top: 15px;}
  #container_wr.main .cons.con02 .row.boxs .box span{line-height: 1.5; word-break: keep-all;}
  #container_wr.main .cons.con02 .row.boxs .box .btns{width: 100%; margin-top: 15px; display: flex;}
  #container_wr.main .cons.con02 .row.boxs .box .btns a{display: block; width: 100%; margin: 0;}
  #container_wr.main .cons.con02 .row.boxs .box .btns a:nth-child(n + 2){margin: 0 0 0 5px;}

  #container_wr.main .cons.con03 ul li{width:calc((100% - 20px) / 2);}
  #container_wr.main .cons.con03 ul li .img{height: 43vw;}
  #container_wr.main .slick-arrow{display: none !important;}

  #container_wr.main .cons.con04{padding: 50px 0;}
  #container_wr.main .cons.con04 .row{padding: 0 15px;}
  #container_wr.main .cons.con04 .row .box div{width: calc((100% - 10px) / 2); margin-right: 10px;}
  #container_wr.main .cons.con04 .row .box div:nth-child(5n){margin-right: 10px;}
  #container_wr.main .cons.con04 .row .box div:nth-child(2n){margin-right: 0px;}
  #container_wr.main .cons.con04 .row .box div:nth-child(n + 6){margin-top: 10px;}
  #container_wr.main .cons.con04 .row .box div:nth-child(n + 3){margin-top: 10px;}
  #container_wr.main .cons.con04 .row .box div img{width: 90%; height: auto;}
  #container_wr.main .cons.con04 > span{display: none;}

  #container_wr.main .cons.con05{margin-top: 50px;}
  #container_wr.main .cons.con05 .row .box{width: 100%; margin-right: 0;}
  #container_wr.main .cons.con05 .row .box:nth-child(n + 2){margin-top: 20px;}

  #container_wr.main .cons.con06{margin-bottom: 0px;}
  #container_wr.main .cons.con06 .row{padding: 0 15px; background: none;}
  #container_wr.main .cons.con06 .row .box{width: 100%; background: #fff; padding: 30px;}
  #container_wr.main .cons.con06 .row .box:nth-child(n + 2){margin-top: 20px;}

  .pic_list3 > a{top:30px !important;}
  .pic_list3 ul li a:after{display: none !important;}

  #hd_pop, #hd_wrapper, #tnb .inner, #gnb .gnb_wrap, #container_wr, #ft_wr{width: 100%;}
  #ft .footerin{min-width: 100%; padding: 0 15px;}
  #ft .footerin #ft_wr #ft_company div{width: 100%; margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #e7e7e7;}
  #ft .footerin #ft_wr #ft_company div span{display: block; width: 100%; padding: 0;}
  #ft .footerin #ft_wr #ft_company div span::after{display: none;}

  #ft_copy{width: 100%;}

  #gnb_all{position: fixed; top:0; left: 0; width: 100%; height:100%;  box-shadow:none; background: rgb(246, 247, 249); border: 0; }
  #gnb_all .gnb_al_ul{display: block; position: absolute; width: 100%; height: 100%; overflow: auto;}
  #gnb_all .gnb_al_ul .gnb_al_li{width: 100%;  }
  #gnb_all .gnb_al_li{border-left: 0; min-height: 0; padding: 0;}
  #gnb_all .gnb_al_li .gnb_al_a{width: 30%; color:#333; margin-bottom: 0; font-size: 14px; color:rgb(170, 180, 191); padding: 15px;}
  #gnb_all .gnb_al_ul .gnb_al_li.on{background: #fff;}
  #gnb_all .gnb_al_ul .gnb_al_li.on .gnb_al_a{color:#333;}
  #gnb_all .gnb_al_ul .gnb_al_li.on > ul{z-index: 2;}
  #gnb_all .gnb_al_li > ul{width:calc(70% - 40px); top:0px; right:0px; background: #fff; position: absolute; padding: 15px; height:100%;}
  #gnb_all .gnb_al_li > ul li{line-height: 2.5;}
  #gnb_all_bg{display:none!important;;}

  .mobile_menu_list{background: rgba(0,0,0,0.6); position: fixed; width: 100%; height: 100%; z-index: 999999; top:0; left: 0; display: none;}
  .mobile_menu_list .box{width: 80%; background: #fff; position: absolute; left:0; top:0; height: 100%; padding: 20px; transition: transform .3s ease;  transform: translateX(-100%);  will-change: transform;}
  .mobile_menu_list.show {display: block;}
  .mobile_menu_list.slide-in .box{ transform: translateX(0); }
  .mobile_menu_list .box .login{padding: 20px 0; border-bottom:1px solid rgb(239, 241, 245);}
  .mobile_menu_list .box .login a{padding: 10px; border: 1px solid #cdcdcd; border-radius: 10px; display: inline-block;}
  .mobile_menu_list .box .logout{position: absolute; left: 20px; bottom: 20px;}
  .mobile_menu_list .box .logout a{padding-bottom: 3px; border-bottom:1px solid #999; color:#999;}
  .mobile_menu_list .box ul{padding: 20px 0;}
  .mobile_menu_list .box ul li{line-height: 3;}
  .mobile_menu_list .box > a{position: absolute; top:20px; right: 20px;}
  .mobile_menu_list .box > a img{height: 15px; }

  #mb_login.mbskin{width: 100%; padding: 20px;}

  .register{width: 100%; padding: 20px; margin-top: 0 !important; }

  .register.yatt{width: 100%; padding: 20px;}

  #hd .headerin > div.cate #gnb .gnb_wrap #gnb_1dul span.gnb_1dli{display: none;}

  .social_register{margin:0 !important; padding:0 20px 20px 20px;}
  .social_join h2{font-size: 25px; font-family: 'S-CoreDream-6Bold'; padding: 20px 20px 0 20px; border-bottom: 0;  margin-bottom: 20px;}

  .register.yatt #fregisterform .email_fim_show > div a.resand{display: block; position: static; transform: translate(0); padding: 0; text-align: right;}

  #reg_result .reg_result_p i{line-height: 1.3;}
  #reg_result .result_txt{word-break: keep-all;}

  #bo_gall{margin:0px auto !important; min-width: 100% !important; padding:0 20px;}
  #bo_gall .top_cate{display: none;}
  #bo_gall #bo_btn_top{width: 100% !important; margin: 0;}
  #bo_gall #bo_btn_top > p{display: none;}
  #bo_gall #bo_btn_top div{width: 100%; overflow-x:auto;}
  #bo_gall #bo_btn_top ul{margin-top:0 !important; width: max-content;}
  #bo_gall #bo_btn_top ul li{float: left; background: none !important; width: auto !important; padding: 0 10px !important; border-radius: 0px !important;}
  #bo_gall #bo_btn_top ul li.active{border-bottom: 2px solid #3572E5;}
  #bo_gall .right_cont{width: 100% !important;}
  #bo_gall #gall_ul{display: flex; gap: 10px 0; min-height:50vh;}
  .gall_row .col-gn-4{width: 50% !important;}
  #bo_gall .gall_box{margin-bottom: 0 !important;}
  #bo_gall .gall_info .right{float: left !important; display: block !important; width: 100%; margin-top: 5px;}

  .btn_bo_user{display: none;}
  #bo_cate{display: none;}

  #bo_v{min-width: 100% !important; margin: 0 auto !important; padding: 0 20px;}
  .bo_v_top #bo_v_img{width: 100% !important; }
  .bo_v_top .bo_v_right{width: 100% !important; margin-top:15px;}
  .bo_v_top .bo_v_right #bo_v_title .bo_v_cate{}
  .bo_v_top .bo_v_right #bo_v_title .bo_v_tit{font-size: 30px !important; line-height: 1.3 !important;}
  #bo_v section.service{padding: 30px !important; margin-top: 20px !important;}
  #bo_v section.service ul.gall_row{display: flex;}
  #bo_v section.service ul.gall_row li{width: 100% !important; margin-right: 0 !important;;}
  #bo_v section.service ul.gall_row li .gall_img{height: auto !important;}
  #bo_v section.service ul.gall_row li .icon_option span img{width: 90px !important;}
  #bo_v section.service ul.gall_row li .gall_info .right{display: block !important; width: 100%; margin-top: 5px;}
  #bo_v section.service ul.gall_row li .gall_info .pf_img{width: 40px !important; height: 40px !important;}
  #bo_v section.service ul.gall_row li .gall_info .name{line-height: 40px;}
  #bo_v section.service ul.gall_row li .gall_text_href a{display: block; width: 100%;}

  #bo_w{padding: 20px !important;}
  #bo_w .bo_w_h2{margin-bottom: 10px !important; padding-bottom: 10px !important;}
  #bo_w hr{width: 100%; margin: 10px 0 !important;}
  #bo_w .row{min-width: 100% !important; padding: 30px !important;}
  #bo_w .row form{display: flex; gap: 20px; flex-wrap: wrap;}
  #bo_w .row form > input{display: none;}
  #bo_w .bo_w_tit{padding: 0 !important; width: 100%;}
  #bo_w .bo_w_tit > label{width: 100% !important; padding: 0 0 5px 0 !important;}
  #bo_w .bo_w_tit > label br{display: none;}
  #bo_w .bo_w_tit > div{width: 100% !important;}
  #bo_w .bo_w_tit > div select{width:calc((100% - 10px) / 2) !important; float: left;}
  #bo_w .bo_w_tit > div select:nth-child(n + 2){margin-left: 10px !important;}
  #bo_w .bo_w_tit > div input[type="text"]{width: 100%;}
  #bo_w .bo_w_tit > div.checkbox{display: flex; flex-wrap: wrap; gap: 10px; width: 100% !important;}
  #bo_w .bo_w_tit > div.checkbox label{margin-right: 0; width:calc((100% - 20px) / 3);}
  #bo_w .bo_w_tit > div.checkbox label span:last-child{width: max-content;}
  #bo_w .bo_w_tit > div.font_data{line-height: 1 !important; margin:10px 0 0 0 !important; text-align: right;}
  #bo_w .bo_w_tit > div.phone span{line-height: 58px; float: left;}
  #bo_w .bo_w_tit > div.phone select{width: calc((100% - 60px) / 3) !important; float: left;}
  #bo_w .bo_w_tit > div.phone input[type="text"]{width: calc((100% - 60px) / 3) !important; float: left;}
  #bo_w .bo_w_tit > div.box_radio label{width: 50%;}
  #bo_w .btn_confirm{width: 100%;}
  #bo_w .btn_confirm a{margin-bottom: 5px;}
  #bo_w .btn_confirm a, #bo_w .btn_confirm button{width: 100% !important;}
  #bo_w .bo_w_tit > div.career_box > div .tit{position: static !important; width: 100% !important; line-height: 40px !important; border-right: 0px solid #DEDFE8 !important; border-bottom: 1px solid #DEDFE8;}
  #bo_w .bo_w_tit > div.career_box > div .tit br{display: none;}
  #bo_w .bo_w_tit > div.career_box > div ul{padding: 10px !important;}
  #bo_w .bo_w_tit > div.career_box > div ul li{width: 100% !important;}
  #bo_w .bo_w_tit > div.career_box > div ul li span{width: 100%; margin-right: 0 !important; line-height: 2 !important;}
  #bo_w .bo_w_tit > div.career_box > div ul li div{width: 100% !important;}
  #bo_w .bo_w_tit > div.career_box > div ul li div select{width: 100% !important;}
  #bo_w .bo_w_tit > div.career_box > div ul li div input{width: 100%;}
  #bo_w .bo_w_tit > div.career_box > div ul li.button button{width: 100% !important;}
  #bo_w .bo_w_tit > div.career_box > div.list .tit{background: #fff !important;}
  #bo_w .bo_w_tit > div.career_box > div.list ul li{text-align: center;}

}