﻿/*혜진추가*/
@media (max-width:1900px){
	#responWeb {display:none;}
	#NOresponWeb {display:block;}
	#middleA {width:400px;}

	.box-area .btn-ar2 {text-align:right; padding:30px 50px;}
	.box-area .btn-ar2 li {display:inline-block; margin-left:10px;}
}

@media (max-width:1700px){
	.sms .send-area {width:67%;}
	.sms .addrbook .btn-area {display:none;}
	
	.organization .left {width:30%;}
	.organization .right {width:68%}
	#middleA {width:400px;}

}

@media (max-width:1500px){
	/*nav > ul > li > a {width:82px; padding:0 18px; letter-spacing:-1px;}*/
	nav > ul ul a {font-size:12px;}
}

@media (max-width:1280px){
	#small {display:none};
	.btn {padding:0 13px;}
	.btn.middle {padding:0 26px;}
	.btn.big2 { width:20%; }
	
	.btn9.middle {margin-left:50px;}
	.btn10.middle {margin-left:10px;}
	.btn11.middle {margin-left:10px;}
	.btn12.middle {margin-left:10px;}
		
	.work-time li p {letter-spacing:-1px;}
	
	nav {left:55%;}
	
	.nav-bottom.pc {display:none;}
	.nav-bottom.mobile {display:block;}
	.nav-bottom.mobile {position:fixed; right:0; top:0; width:100%;}
	.nav-bottom.mobile .util {position:absolute; right:10px; top:17px;}

	.board li:nth-child(13) p {top:80%;}
	.tabs label {width:calc(100% / 2 - 10px);}
	
	.approval li i {display:none;}
}

@media (max-width:1024px){
	#responWeb {display:block;}
	#NOresponWeb {display:none;}
	#middleA {width:100%;}
	#big {display:none}
	#small {display:block}
	.btn {padding:0 13px;}
	.btn.middle {padding:0 30px;}
	.btn.big {padding:0 40px;}

	.btn2 {padding:0 13px;}
	.btn2.middle {padding:0 30px;}
	.btn2.big {padding:0 40px;}

	.btn3 {padding:0 13px;}
	.btn3.middle {padding:0 30px;}
	.btn3.middle2 {padding:0 30px;}
	.btn3.big {padding:0 40px;}

	.btn5 {padding:0 13px;}
	.btn5.middle {padding:0 30px;}
	.btn5.big {padding:0 40px;}

	.btn6 {padding:0 13px;}
	.btn6.middle {padding:0 30px;}
	.btn6.big {padding:0 40px;}
	
	.btn8.middle {padding:0 30px; width:100%; display:block; margin-bottom:10px;}
  	
	input[type=file], input.input1, input.input2, input.input3, input.input4, select.select1 {width:100% !important;}
	input.char5 {width:80%;}
	input.char6 {width:90%;}
	label.label1 {line-height:50px;}
	
	table .tit {width:15%;}
	table .tb-cont {width:35%;}
	
	/*table thead th {line-height:40px;}
	table th, table td {line-height:2; padding:10px;}
	table th, table td {padding:10px 15px;}*/
	
	table.type3 th.tit, table.type3 td.name {line-height:30px;}
	table.type3 th, table.type3 td {line-height:1; padding:0;}
	
	table.type1 .sch-btn {width:50px; height:30px;}
	/*table.type1 .sch-btn {vertical-align:top;}
	table.type1 .sch-btn a {margin-top:10px;}*/

	.container section {width:100%; margin:0 auto;}

	.board li:nth-child(13) p {top:50%;}

	.nav-top {display:none;}
	.nav-top.mobile {display:block}
	
	.nav-top a, .nav-bottom a {display:inline-block;}
	.nav-top > a {width:22px; height:22px; text-indent:-999em; background:url(/include/images/ico/ico_manager.png) no-repeat;}
	.nav-top ul {position:absolute; top:30px; right:0; width:17vw; border-radius:5px; border:1px solid #dbdbdb; background:#fff; display:none;}
	.nav-top li:first-child {background:#653700;}
	.nav-top li {margin:0 auto; padding:10px; color:#fff; display:block;}
	.nav-top li.manager, .nav-top li.myinfo, .nav-top li.logout {width:100%; height:auto; padding:0 10px; margin-bottom:10px; box-sizing:border-box; background:none;}
	.nav-top li.manager span, .nav-top li.myinfo span, .nav-top li.logout span {display:block; position:relative; left:0; top:0; transform:none; font-size:1em; color:#333; background:none;}
	
	.section .box-area {padding:20px; margin-bottom:10px;}
	.section .box-area .btn-down a {position:relative; top:auto; right:0; display:inline-block; margin-top:10px;}

	.box-area .btn-area2 {padding:20px;}
	
	.searchWrap li .th, .searchWrap li span {width:100%; display:block; margin-bottom:10px; padding:0;}
	.searchWrap li .td .btn-payment {right:2%;}

	.tableWrap .cont, .box-area .cont, .annual, .tb-wrap, .tableWrap {overflow-x:auto;}
	.tableWrap .cont table, .box-area .cont table, .annual table, .tb-wrap table {width:1000px;}

	.tableWrap .paging a {margin:0 auto;}
	
	.box-area .cont table.noreponse {width:100%;}
	
	.btn-hd {height:auto;}
	.btn-hd p {margin-bottom:0;}
	/*.btn-hd ul {position:relative; right:auto; top:auto; transform:none; text-align:right;}*/
	
	.box-confirm > div {min-width:630px;}
	.box-confirmN > div {min-width:630px;}
	.modal-cont {padding:10px;}
	.modal-cont .listbox { display:block;width:99%;height:110px;margin-bottom:10px; }
	.modal-cont .listbox .listitem { width:100%; }
	.modal-cont .listbox .two li {display:inline-block;width:45%;}
	.modal-cont select.type1, .modal-cont select.type2 {margin-bottom:10px; height:auto;}
	/*.modal-cont select:last-child {width:100%; height:100px;}*/
	.modal-cont .select-area .shuttlebox { display:block;margin-bottom:10px;width:100%;text-align:center;}
	.modal-cont .select-area .shuttle {display:inline-block; width:100%;height:30px; }
	.modal-cont .select-area .shuttle li {display:inline-block; transform:rotate(90deg);}
	
	/*혜진추가*/
	.modal-cont select.selteam{width:100%; margin-bottom:10px;}
	.modal-cont .listboxN { display:block;width:99%;height:110px;margin-bottom:10px; }
	.modal-cont .listboxN .listitem { width:100%; }
	.modal-cont .listboxN .two li {display:inline-block;width:45%;}
	
	.modal-cont .listboxN #newpayline li {display:inline-block;width:45%;}
	
	.modal-cont .damdang { display:block;width:99%;height:110px;margin-bottom:10px; }
	.modal-cont .damdang .listitem { width:100%; }
	.modal-cont .damdang .two li {display:inline-block;width:45%;}
	

	
	.modal-cont .title-area { display:block;margin-bottom:10px;width:100%;}
	.modal-cont .title-areaE { display:block;margin-bottom:10px;width:100%;text-align:center;}
	.modal-cont .title-areaD { display:block;margin-bottom:10px;width:100%;text-align:center;}
	/*.modal-cont #paylineAdd {font-size:16px; width:90%;text-align:center;}*/


	.information colgroup col {width:100%;}
/*	.information th, .information td {display:block;}
	.information th {border-bottom:0 !important;}
	.information table td.photo { text-align:center; }*/
	.information table th {float:left; display:block; padding:20px 15px;width:30%; min-height:70px; border:0; border-bottom:1px solid #dbdbdb;border-right:1px solid #dbdbdb; box-sizing:border-box;}
	.information table td {float:left; display:block; width:70%; min-height:70px; border:0; border-bottom:1px solid #dbdbdb;border-right:1px solid #dbdbdb; box-sizing:border-box;}
	.information table th.tdall, .information table td.tdall { width:100%; }
	.information table th.td2, .information table td.td2 { height:120px; }
	.information table th.td3, .information table td.td3 { height:165px; }
	.information table th.td10, .information table td.td10 { height:460px; }
	.information table th.photo, .information table td.photo { height:141px; }
	.information table th.photo img { height:140px; }
	.information table .blank {display:none;}
	
	col.tdsize15 { width:30%; }
	col.tdsize35 { width:70%; }

	.organization .left {float:none; min-width:100%; margin-bottom:10px;}
	.organization .left td {padding:0;}
	/* .organization .left .cont > div, .organization .right .cont > div {height:200px; padding:10px;} */
	.organization .right {float:none; min-width:100%;}
	.organization .right .cont > div {padding:0;}
	.organization .right table {border:0;}
	.organization .right table td {float:left; display:block; width:100%; border:0; border-bottom:1px solid #dbdbdb; box-sizing:border-box;}
	.organization .right table col {width:100%;}
	.person-info-photo {width:100px; height:100px; left:5%;}
	.person-info-photo img {width:100%;}
	.person-info {margin:20px 0 20px 23%}

	.sms .left, .sms .right {float:none; width:100%; max-width:100%;}
	.sms .left li {width:calc(100% / 4 - 6px); display:inline-block; text-align:center; margin-bottom:20px;}
	.sms .right .cont {padding:20px;}
	.sms .phone {width:48%; float:none; margin:0 auto;}
	.sms .kakao {width:48%; float:none; margin:0 auto;}
	.sms .send-area {float:none; width:100%; max-width:100%; margin-top:20px;}
	.sms .kakao-send-area {float:none; width:100%; max-width:100%; margin-top:20px;}
	
	.sms .right .cont.type2 {overflow-x:auto;}
	.sms-save li {width:calc(100% / 2)}
	.sms-select li {width:calc(100% / 2)}

	.addr-popup .right .table-area, .group-area .member .lst dl, .group-area .member2 .lst dl {overflow-x:auto;}
	.addr-popup dl, .group-area .member .lst dt, .group-area .member .lst dd, .group-area .member2 .lst dt, .group-area .member2 .lst dd {width:400px;}
	.addr-popup dd p {padding-bottom:10px; border-bottom:1px solid #dbdbdb;}

	.group-area .group .top, .group-area .member .top, .group-area .member2 .top {padding:10px 20px;}
	.group-area .group .top p, .group-area .member .top p, .group-area .member2 .top p {line-height:1.5; margin-bottom:10px;}
	.group-area .group .top span, .group-area .member .top span, .group-area .member2 .top span {position:relative; right:auto; top:auto; transform:none; display:block; text-align:right;}
	.group-area .group .top span a, .group-area .member .top span a, .group-area .member2 .top span a {margin:0 auto;}
	.group-area .member .select-group select, .group-area .member2 .select-group select {display:block; margin:0 auto 10px;}

	.tab-area li {margin-right:0;}
	.tab-area li > a {min-width:90px; padding:0;}
	.tab-area2 {margin-top:0;}

	footer p {line-height:3;}
	footer p.addr {position:relative; top:auto; transform:none;}
}

@media (max-width:800px){
	.btn.big2 { width:60%; }
	
	.approval li {width:calc(100% / 3 - 16px); margin-bottom:10px;}
	
	.box-spchar > div {min-width:470px;}
	.spc-tabBox ul li{width:72px;}
}

@media (max-width:640px){
	.btn {padding:0 13px;}
	.btn.middle {padding:0 20px;}
	.btn.big {font-size:16px; padding:0 30px;}
	

	.btn2 {padding:0 13px;}
	.btn2.middle {padding:0 20px;}
	.btn2.big {font-size:16px; padding:0 30px;}

	.btn3 {padding:0 13px;}
	.btn3.middle {padding:0 20px;}
	.btn3.middle2 {padding:0 20px;}
	.btn3.big {font-size:16px; padding:0 30px;}
  
	
  
	/*헤진생략
	 .btn4 {height:35px; font-size:0 !important; padding-left:23px !important;}*/
   
	/*혜진추가*/
	/*.box-area .btn-ar2 {padding:30px 50px;}
	.box-area .btn-ar2 li {display:block;}
	*/
	/*
  .btn4.check {width:100%;}
	.btn4.write {width:100%;}
	.btn4.del {width:100%;}
	.btn4.list {width:100%;}
	*/
	.btn5 {padding:0 13px;}
	.btn5.middle {padding:0 20px;}
	.btn5.big {font-size:16px; padding:0 30px;}

	.btn6 {padding:0 13px;}
	.btn6.middle {padding:0 20px;}
	.btn6.big {font-size:16px; padding:0 30px;}
	
	.btn9.middle {display:block; margin-left:0px; margin-bottom:10px;}
	.btn10.middle {margin-left:0px; margin-bottom:10px;}
	.btn11.middle {margin-left:0px; margin-bottom:10px;}
	.btn12.middle {margin-left:0px; margin-bottom:10px;}
	.nospace { margin:0;padding:0 5px;}

	/*input[type=text] {width:100%;}
	input.input5 {min-width:120px;width:50%;}*/
  
	/*혜진추가*/
	#text {width:100%;}
	header p.notice {line-height:1.5; padding:10px 0 10px 65px;}
	#login .login-form, #login2 .form {min-width:310px;}
	#login .login-link a {float:none; margin-top:10px;}
  
	
	
	.nav-top ul {width:50vw;}
	
	/*.container {margin:10px 10px 0;}*/
	.container section > div {margin-bottom:20px;}
	
	.container .approval {display:block;}
	
	.approval li {width:calc(100% / 2 - 16px); margin-bottom:10px;}

	.work-time li {float:none; width:100%; margin:0 auto 20px;}
	.work-time li p {text-align:left; margin-bottom:10px;}

	.board ul {margin:0 auto;}
	.board li {width:100%; line-height:35px; float:none; margin:0 auto;}

	.tabs label {width:calc(100% / 2 - 8px);}
	.tab-content li p {width:100%; line-height:35px;}
	.tab-content li .date {display:none;}

	.right .btn-area li {width:calc(100% / 2 - 5px); margin:0 auto;}
	.right .sect3 .btn-area li {width:calc(100% / 2 - 5px); margin:0 auto;}
	.right .sect4 .btn-area li {width:calc(100% / 2 - 5px); margin:0 auto;}

	.tableWrap .cont table, .annual table, .tb-wrap table {width:850px;}
	.searchWrap li .td .btn-payment {right:2%;}
	.searchWrap.type2 li .th {width:100%;}

	.box-confirm > div {min-width:auto; width:90%; max-height:90vh; overflow-y:auto;}
  .box-confirmN > div {min-width:auto; width:90%; max-height:90vh; overflow-y:auto;}
	.tb-file label {min-width:60px; width:40%;}
	.tb-file div {width:100%; margin:10px auto 0;}

	.btn-hd li a {height:33px; font-size:0; padding:0 18px;}

	.box-area .bo-file li {line-height:2; padding:10px; margin:10px auto 0;}
	.box-area .bo-file li i {display:block;}
	.box-area .btn-area2 li {margin-left:0;}
	/*.box-area .btn-area2:first-child li:first-child {display:block; width:100%; margin-bottom:5px;} comyujiview.asp*/

	.bo-vc li {padding:10px 20px;}
	.bo-vc li span.name, .bo-vc li span.date {position:relative; top:auto; right:auto; left:auto; transform:none;}
	.bo-vc li span.date {text-align:right; display:block;}
	.bo-vc li p {padding-left:0; line-height:1.5;}

	.bo-vc-w {padding:10px 20px 0;}
	.bo-vc-w textarea {width:100%;}
	.bo-vc-w button {position:relative; right:auto; width:100%; height:50px; margin-top:10px;}
	.bo-vc-w button br {display:none;}

	/* .organization .cont {width:10px;} */
	.organization .right table td {width:174%; padding:0;}
	.person-info-photo {position:relative; top:auto; left:auto; transform:none; width:80px; height:80px; margin:10px auto 0;}
	.person-info {width:90%; box-sizing:border-box; margin:20px 0 20px 10px;}

	.sms .left li {width:calc(100% / 2 - 6px); margin-bottom:5px;}
	.sms .right .cont {padding:10px;}
	.sms .phone {width:100%; background-size:100%;}
	.sms .phone-text {height:414px;}
	.sms .katao {width:100%; background-size:100%;}
	.sms .kakao-templete-text {height:414px;}
	.sms .addrbook .addr-number {width:100%; margin:10px auto 0;}
	.sms .sender input {width:100%; margin:10px auto 0;}
	.sms .sender .btn-area {position:relative; top:auto; right:auto; text-align:right; margin:10px auto 0;}
	.sms .ins-box {padding:10px;}
	.sms-save li {width:calc(100% / 1)}
	.sms-select li {width:calc(100% / 1)}

	.section .box-area {padding:10px;}

	.addr-popup .left, .addr-popup .right {float:none; width:100%;}
	.addr-popup .right {margin-top:20px;}
	.addr-popup dl {width:350px; height:200px;}

	.group-area .group, .group-area .member, .group-area .member2 {float:none; width:100%; max-width:100%;}

	.tab-area li > a {min-width:75px;}
	.tab-area2 li {line-height:2; padding-left:10px; margin:10px auto;}
	.tab-area2 li a {font-size:14px;}

	.searchWrap.type2 .btn-area {position:relative; right:auto; bottom:auto;}

	footer {padding:10px 0;}
	footer p {line-height:1.5;}
	
	div.twobulk {width:80%;display:block;}
}