@charset "UTF-8";
@import url("contents_repond.css");
/*-------------------------------------------------
title       : 서브 반응형
Author      : ㅈㅁㅈ
Create date : 2020-12-01
-------------------------------------------------*/
@media (max-width: 1620px) { 
#wrap.fixed .contents_util .util { right: 10rem; } 
}

@media (max-width: 1150px) { #header { z-index: 2; }
  #snb { display: none; }
  #contents { float: none; width: 100%; }
  .contents_util { position: relative; z-index: 1; height: 6rem; margin: 0 -2rem 2rem; background-color: #E6E6EE; line-height: 6rem; }
  .contents_util .path { display: none; }
  .contents_util .group { visibility: visible; overflow: visible; width: auto; height: auto; opacity: 1; position: static; width: 100% !important; line-height: 6rem; }
  .contents_util .group p.item { width: 6rem; text-align: center; }
  .contents_util .group div.item { padding-left: 0; }
  .contents_util .group div.item::before { display: none; }
  .contents_util .group div.list { display: block; height: 6rem; border: 0 none !important; border-left: 1px solid rgba(0, 0, 0, 0.1) !important; line-height: 6rem; }
  .contents_util .group div.list button::after { font-size: 2.5rem; }
  .contents_util .group div.list ul { -webkit-box-shadow: 0.5rem 1rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0.5rem 1rem 1rem rgba(0, 0, 0, 0.1); border: 0 none; }
  .contents_util .group div.list.active button { -webkit-box-shadow: 0.5rem 1rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0.5rem 1rem 1rem rgba(0, 0, 0, 0.1); background-color: #fff; }
  .contents_util .group div.list.active ul { padding-top: 1.5rem; }
  .contents_util .util { position: static; float: right; width: 12rem; height: 100%; margin-top: 0; background-color: #161B52; -webkit-transform: translate(0); transform: translate(0); }
  .contents_util .util .btn { width: 6rem; height: 6rem; border: 0 none; color: #fff; line-height: 6rem; }
  .contents_util .share { position: static; }
  .contents_util .share .item { left: auto; right: 0; top: 0; background-color: #161B52; text-align: center; white-space: nowrap; -webkit-transform: translate(0); transform: translate(0); }
  .contents_util .share .item .list { display: inline !important; max-width: 100%; text-align: center; }
  .contents_util .share .item li { display: inline !important; }
  .contents_util .share .item a { display: inline-block; margin-top: 0; border-color: #fff; background: none; color: #fff; vertical-align: middle; }
  .contents_util .share .item .close { background-color: #fff; color: #151515; }
  .contents_util .share.active .item { width: 35rem; padding: 0 0.1rem; }
  .contents_util .share.active .item a { margin: 0 1rem; } }

@media (max-width: 768px) { .contents_util .group div.item:nth-child(2) { display: none; }
  .depth4_tab #depth4_menu_ul, .depth4_tab.bookmark #depth4_menu_ul { display: block; overflow: hidden; overflow-x: auto; white-space: nowrap; }
  .depth4_tab #depth4_menu_ul li, .depth4_tab.bookmark #depth4_menu_ul li { display: inline-block; vertical-align: top; }
  .depth4_tab #depth4_menu_ul a, .depth4_tab.bookmark #depth4_menu_ul a { width: auto; min-width: 12.8rem; padding: 0 1rem; } }

@media (max-width: 580px) { 
	#visual::before { background-position-x: 40%; }
  .contents_util .group .item { display: none; }
  .contents_util .group .item:last-child { display: table-cell; }
  .contents_info .qr { width: 8rem; }
  .kogl-info {flex-direction: column;}
  .kogl-info .img {height: 6rem; margin-right: 0; margin-bottom: 1rem;}
  .kogl5 .kogl-info .img {height: auto;}
  .kogl-info .desc > span {display: inline-block;}
  .duty { padding: 1.5rem; }
  .duty li { display: block; }
  #satisfy { padding: 1.5rem; }
  #satisfy .form_radio { display: block; }
  .layerpopup { background-color: rgba(0, 0, 0, 0.4); }
  .layerpopup .group { padding: 2rem; }
  .layerpopup .close { right: 2rem; top: 2rem; }
  .layerpopup .form_mail { text-align: center; }
  .layerpopup .form_mail [class*="form_"] { width: 100% !important; }
  .layerpopup .form_mail .form_select { margin-top: 0.5rem; } }