/* Util */
.util {
	margin-bottom:30px;
}

.util .search {
	display: flex;
	justify-content: flex-end;
}

.util .search form {
	display: flex;
	justify-content: space-between;
	max-width:440px;
	width:100%;
}

.util .search .search-select {
	width:36%;
	border-bottom:1px solid #505050;
}

.util .search .search-select select {
	width:100%;
	height:46px;
	font-size:1.6rem;
}

.util .search .search-input {
	position: relative;
	width: 61%;
	border-bottom:1px solid #505050;
}

.util .search .search-input input {
	width:100%;
	height:46px;
	font-size:1.6rem;
	padding-right:50px;
}

.util .search .search-input button {
	display:block;
	position: absolute;
	top:0;
	right:0;
	width:46px;
	height:46px;
	background: url('/child/img/icon/ico_search.svg') no-repeat center / auto 16px;
}

@media screen and (max-width:1200px) {
	.util .search .search-select select {
		height:42px;
		font-size:1.5rem;
	}
	
	.util .search .search-input input {
		height:42px;
		font-size:1.5rem;
	}

	.util .search .search-input button {
		width:42px;
		height: 42px;
	}
}
@media screen and (max-width:1024px) {
	.util {
		margin-bottom:24px;
	}

	.util .search .search-input input {
		padding-right:44px;
	}
}
@media screen and (max-width:768px) {
	.util {
		margin-bottom:20px;
	}

	.util .search .search-select select {
		height:40px;
		font-size:1.4rem;
	}

	.util .search .search-input input {
		height:40px;
		font-size:1.4rem;
	}

	.util .search .search-input button {
		width:40px;
		height:40px;
	}
}
@media screen and (max-width:576px) {
	.util {
		margin-bottom:12px;
	}

	.util .search .search-select select {
		height:38px;
		font-size:1.3rem;
	}

	.util .search .search-input input {
		height:38px;
		padding-right:40px;
		font-size:1.3rem;
	}

	.util .search .search-input button {
		width:38px;
		height:38px;
	}
}


/* Pagination */
.pagination {
	display: flex;
	justify-content: center;
	margin-top:40px;
}

.pagination a {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width:36px;
	height:36px;
	margin:0px 2px;
  font-size:1.6rem;
	color:#5c5c5c;
	background-repeat:no-repeat;
  background-position:center;
  background-color:#fff;
  border:1px solid #dfdfdf;
  text-align: center;
  -webkit-transition:all ease-out .15s;
  transition:all ease-out .15s;
}

.pagination a:not(.current) {
  cursor:pointer;
}

.pagination a.current {
	color:#fff;
  background-color: #255341;
	border-color: #255341;
}

.pagination a.pagination-prev {
  background-image: url('/child/img/common/btn_prev.png');
}

.pagination a.pagination-next {
  background-image: url('/child/img/common/btn_next.png');
}

.pagination a.pagination-backward {
  background-image: url('/child/img/common/btn_backward.png');
}

.pagination a.pagination-forward {
  background-image: url('/child/img/common/btn_forward.png');
}

@media screen and (max-width:1200px) {
	.pagination a {
		font-size:1.5rem;
	}
}
@media screen and (max-width:1024px) {
	.pagination {
		margin-top:30px;
	}

	.pagination a {
		width:32px;
		height:32px;
	}
}
@media screen and (max-width:768px) {
	.pagination {
		margin-top:24px;
	}

	.pagination a {
		width:28px;
		height:28px;
		font-size:1.4rem;
	}
}
@media screen and (max-width:576px) {
	.pagination {
		margin-top:16px;
	}

	.pagination a {
		width:26px;
		height:26px;
		font-size:1.3rem;
	}
}


/* Basic List */
.basic-table {
	table-layout: fixed;
	width:100%;
	border-collapse: collapse;
	border-top:2px solid #121212;
}

.basic-table tr {
	border-bottom:1px solid #c6c6c6;
}

.basic-table th, .basic-table td {
	height:64px;
	padding:12px;
	font-size:1.8rem;
}

.basic-table tr.table-message td {
	padding:100px 20px;
}

.basic-table th {
	font-weight:700;
}

.basic-table td {
	text-align: center;
}

.basic-table td.subject {
	text-align: left;
}

.basic-table td.subject a {
	display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.basic-table tr.table-notice {
	background-color: #ddede6;
}

.basic-table tr.table-notice td.subject {
	font-weight:700;
}

@media screen and (max-width:1200px) {
	.basic-table th, .basic-table td {
		height:60px;
		font-size:1.7rem;
	}
}
@media screen and (max-width:1024px) {
	.basic-table th, .basic-table td {
		height:54px;
		padding:10px;
	}
}
@media screen and (max-width:768px) {
	.basic-table {
		display: block;
	}

	.basic-table thead {
		display: none;
	}

	.basic-table tbody {
		display: block;
	}

	.basic-table tr {
		display: flex;
		flex-wrap: wrap;
		width:100%;
		padding:6px;
	}

	.basic-table tr.table-message {
		justify-content: center;
		text-align: center;
	}

	.basic-table tr.table-message td::after {
		display: none;
	}

	.basic-table th, .basic-table td {
		position: relative;
		height:auto;
		font-size:1.6rem;
		padding:4px 6px;
	}

	.basic-table td::after {
		content: "";
		display: block;
		position: absolute;
		top:50%;
		right:0;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		width:1px;
		height:10px;
		background-color: #999;
	}

	.basic-table td.subject::after,
	.basic-table td.writer::after {
		display: none;
	}

	.basic-table td.no {
		order: 2;
	}

	.basic-table td.subject {
		order:1;
		width:100%;
	}

	.basic-table td.writer {
		order: 4;
	}

	.basic-table td.data {
		order:3;
	}
}
@media screen and (max-width:576px) {
	.basic-table tr {
		padding:6px;
	}

	.basic-table th, .basic-table td {
		font-size:1.4rem;
		padding:3px 4px;
	}

	.basic-table td::after {
		height:8px;
	}

	.basic-table tr.table-message td {
		padding:60px 12px;
	}
}


/* Basic View */
.basic-view .view-head {
	/* padding-bottom:30px; */
}

.basic-view .view-body {
	padding:80px 0px;
	border-top:1px solid #e1e1e1;
	border-bottom:1px solid #e1e1e1;
}

.basic-view .view-btn {
	display: flex;
	justify-content: center;
	margin-top:40px;
}

.basic-view .pin {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width:50px;
	height:26px;
	margin-bottom:10px;
	font-size:1.4rem;
	font-weight:500;
	color:#fff;
	border-radius:6px;
	background-color: #55a783;
}

.basic-view .subject {
	font-size:2.8rem;
	font-weight:700;
	margin-bottom:30px;
}

.basic-view .din {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.basic-view .din dd {
	margin:0px -4px;
}

.basic-view .din span {
	display:inline-block;
	vertical-align: middle;
	font-size:1.4rem;
	font-weight:500;
	line-height:.8;
	padding:0px 4px;
}

.basic-view .din span.writer {
	border-right:1px solid #333333;
}

.basic-view .din span.data {
	color:#999999;
}

.basic-view .file {
	display: flex;
	align-items: center;
	margin-top:20px;
	padding:20px;
	border-top:1px solid #e1e1e1;
}

.basic-view .file p {
	width:80px;
	font-size:1.4rem;
	font-weight:700;
}

.basic-view .file span {
	display: block;
	width: calc(100% - 80px);
	font-size:1.4rem;
	font-weight:500;
	color:#666;
}

.basic-view .context p {
	font-size:1.8rem;
	line-height:1.8;
}

.basic-view .button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	max-width: 300px;
	width:100%;
	height:60px;
	font-size:1.8rem;
	font-weight:500;
	color:#fff;
	border-radius: 6px;
	background-color: #255341;
}

@media screen and (max-width:1200px) {
	.basic-view .subject {
		font-size:2.4rem;
	}
	
	.basic-view .context p {
		font-size:1.7rem;
	}

	.basic-view .button {
		height:54px;
		font-size:1.7rem;
	}
}
@media screen and (max-width:1024px) {
	/* .basic-view .view-head {
		padding-bottom:24px;
	} */

	.basic-view .view-body {
		padding:60px 0px;
	}

	.basic-view .view-btn {
		margin-top:30px;
	}

	.basic-view .subject {
		margin-bottom:24px;
	}
	
	.basic-view .din span {
		font-size:1.3rem;
	}

	.basic-view .file {
		margin-top:16px;
		padding:16px;
	}
	
	.basic-view .file p {
		width:60px;
		font-size:1.3rem;
	}
	
	.basic-view .file span {
		width: calc(100% - 60px);
		font-size:1.3rem;
	}

	.basic-view .button {
		height:50px;
	}
}
@media screen and (max-width:768px) {
	/* .basic-view .view-head {
		padding-bottom:20px;
	} */

	.basic-view .file {
		margin-top:12px;
		padding:12px;
	}

	.basic-view .view-body {
		padding:40px 0px;
	}

	.basic-view .view-btn {
		margin-top:24px;
	}

	.basic-view .subject {
		font-size:2rem;
		margin-bottom:20px;
	}

	.basic-view .context p {
		font-size:1.6rem;
		line-height:1.6;
	}

	.basic-view .button {
		max-width:240px;
		height:46px;
		font-size:1.6rem;
	}
}
@media screen and (max-width:576px) {
	/* .basic-view .view-head {
		padding-bottom:12px;
	} */

	.basic-view .file {
		margin-top:8px;
		padding:8px;
	}
	
	.basic-view .file p {
		font-size:1.2rem;
	}
	
	.basic-view .file span {
		font-size:1.2rem;
	}

	.basic-view .view-body {
		padding:30px 0px;
	}

	.basic-view .view-btn {
		margin-top:16px;
	}

	.basic-view .subject {
		font-size:1.8rem;
		margin-bottom:12px;
	}

	.basic-view .din span {
		font-size:1.2rem;
	}

	.basic-view .context p {
		font-size:1.4rem;
	}

	.basic-view .button {
		max-width:200px;
		height:40px;
		font-size:1.4rem;
	}
}



/* Basic Photo Front */
.photo-front .thumbnail-wrap {
	position: relative;
	width:100%;
	height:0;
	padding-top: calc(520/400*100%);
	background-color: #cccccc;
	overflow: hidden;
}

.photo-front .thumbnail-wrap div {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size:cover;
	z-index:1;
}

.photo-front .title {
	font-size:3.8rem;
	font-weight:600;
	color:#255341;
	margin-bottom:40px;
	padding-bottom:50px;
	border-bottom:1px solid #cccccc;
}

.photo-front .context p {
	font-size: 2rem;
	line-height:1.5;
}

@media screen and (max-width:1200px) {
	.photo-front .title {
		font-size:3rem;
	}

	.photo-front .context p {
		font-size:1.8rem;
	}
}
@media screen and (max-width:1024px) {
	.photo-front .title {
		margin-bottom:30px;
		padding-bottom:38px;
	}
}
@media screen and (max-width:768px) {
	.photo-front .title {
		font-size:2.4rem;
		margin-bottom:24px;
		padding-bottom:28px;
	}

	.photo-front .context p {
		font-size:1.7rem;
	}
}
@media screen and (max-width:576px) {
	.photo-front .title {
		font-size:2rem;
		margin-bottom:16px;
		padding-bottom:20px;
	}

	.photo-front .context p {
		font-size:1.6rem;
	}
}

/* Basic Client */
.client-list {
	display: flex;
	flex-wrap: wrap;
	margin:-16px;
}

.client-list li {
	flex:0 0 16.6667%;
	max-width:16.6667%;
	padding:16px;
}

.client-list .img {
	display: flex;
	justify-content: center;
	align-items: center;
	width:100%;
	height:140px;
	border:2px solid #cccccc;
} 

.client-list .img img {
	display: block;
	max-height:100%;
}

@media screen and (max-width:1200px) {

}
@media screen and (max-width:1024px) {
	.client-list {
		margin:-12px;
	}
	
	.client-list li {
		flex:0 0 33.33%;
		max-width:33.33%;
		padding:12px;
	}

	.client-list .img {
		height:120px;
	}
}
@media screen and (max-width:768px) {
	.client-list {
		margin:-6px;
	}
	
	.client-list li {
		padding:6px;
	}

	.client-list .img {
		height:80px;
	}
}
@media screen and (max-width:576px) {
	.client-list {
		margin:-4px;
	}

	.client-list li {
		flex:0 0 50%;
		max-width:50%;
		padding:4px;
	}

	.client-list .img {
		height:60px;
	}
}


/* Basic Statute */
.statute-list {
	display: flex;
	flex-wrap: wrap;
	margin:-20px;
}

.statute-list li {
	flex:0 0 50%;
	max-width:50%;
	padding:20px;
}

.statute-list a {
	display: flex;
	justify-content: center;
	align-items: center;
	width:100%;
	height:90px;
	font-size:2.4rem;
	font-weight:500;
	color:#ffffff;
	background-color: #55a783;
	-webkit-transition:all .4s ease;
	transition:all .4s ease;
}

.statute-list a::before {
	content: "";
	display: block;
	width:24px;
	height:22px;
	background: url('/child/img/icon/ico_download.svg') no-repeat center;
	margin-right:20px;
}

.statute-list .link-ani {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.statute-list .link-ani span {
  -webkit-transition:all .4s ease;
	transition:all .4s ease;
}

.statute-list .link-ani span.link-ani-show {
  -webkit-transform: translateY(0);
	transform: translateY(0);
}

.statute-list .link-ani span.link-ani-hide {
  position: absolute;
  -webkit-transform: translateY(100%);
	transform: translateY(100%);
}

@media (min-width:1201px) {
	.statute-list a:hover {
		background-color: #255341;
	}

  .statute-list a:hover .link-ani-show {
    -webkit-transform: translateY(-100%);
		transform: translateY(-100%);
  }

  .statute-list a:hover .link-ani-hide {
    -webkit-transform: translateY(0);
		transform: translateY(0);
  }
}
@media screen and (max-width:1200px) {
	.statute-list a {
		height:70px;
		font-size:2rem;
	}

	.statute-list a::before {
		width:22px;
		height:20px;
	}
}
@media screen and (max-width:1024px) {
	.statute-list {
		margin:-16px;
	}
	
	.statute-list li {
		padding:16px;
	}

	.statute-list a {
		height:60px;
	}

	.statute-list a::before {
		margin-right:16px;
	}
}
@media screen and (max-width:768px) {
	.statute-list {
		margin:-12px;
	}
	
	.statute-list li {
		padding:12px;
	}

	.statute-list a {
		font-size:1.8rem;
	}

	.statute-list a::before {
		width:20px;
		height:18px;
		margin-right:12px;
	}
}
@media screen and (max-width:576px) {
	.statute-list {
		margin:-4px;
	}
	
	.statute-list li {
		flex:1 1 100%;
		max-width:100%;
		padding:4px;
	}

	.statute-list a {
		font-size:1.7rem;
		height:48px;
	}

	.statute-list a::before {
		width:18px;
		height:16px;
		margin-right:6px;
	}
}
