@charset "utf-8";


/* ==============================================
   board
   ============================================== */

/* common */

.boardTopExp {margin-bottom: 40px;}
.boardTopExp p.main {line-height: 26px;font-size: 20px;}
.boardTopExp p.main strong {font-weight: 700;}
.boardTopExp p.sub {line-height: 24px;font-size: 18px;margin-top: 20px;}
.boardTopExp p.sub strong {font-weight: normal;color: #35c0d9;}

/* write */

table.boardWrite {width: 100%;border-top: 1px solid #ebebeb;}
table.boardWrite tr td {border-bottom: 1px solid #ebebeb;padding: 12px 0;}
table.boardWrite tr td.title {line-height: 26px;font-size: 16px;font-weight: 700;vertical-align: middle;}
table.boardWrite tr td.title span.essential {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;color: #f00;vertical-align: middle;margin-left: 4px;}
table.boardWrite tr td input[type=text],
table.boardWrite tr td input[type=password] {width: 100%;line-height: 24px;font-size: 16px;border: 1px solid #dddddd;outline: none;padding: 12px 20px;}
table.boardWrite tr td input[type=text]::placeholder ,
table.boardWrite tr td input[type=password]::placeholder {color: #999;}
table.boardWrite tr td input[type=checkbox] {}
table.boardWrite tr td select {width: 100%;}
table.boardWrite tr td textarea {width: 100%;}
table.boardWrite tr td p.exp {line-height: 26px;font-size: 16px;color: #999;padding: 5px 0;margin-top: 12px;}

div.boardWrite {width: 100%;border-top: 1px solid #ebebeb;}
div.boardWrite .item {display: flex;align-items: center;border-bottom: 1px solid #ebebeb;padding: 12px 0;}
div.boardWrite .item p.title {flex: 0 0 auto;width: 170px;line-height: 26px;font-size: 16px;font-weight: 700;vertical-align: middle;}
div.boardWrite .item p.title span.essential {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;color: #f00;vertical-align: middle;margin-left: 4px;}
div.boardWrite .item .content {flex: 1 1 auto;}
div.boardWrite .item .content input[type=text],
div.boardWrite .item .content input[type=password] {width: 100%;line-height: 24px;font-size: 16px;border: 1px solid #dddddd;outline: none;padding: 12px 20px;}
div.boardWrite .item .content input[type=text]::placeholder ,
div.boardWrite .item .content input[type=password]::placeholder {color: #999;}
div.boardWrite .item .content input[type=checkbox] {}
div.boardWrite .item .content select {width: 100%;}
div.boardWrite .item .content textarea {width: 100%;}
div.boardWrite .item .content p.exp {line-height: 26px;font-size: 16px;color: #999;padding: 5px 0;margin-top: 12px;}

div.boardWrite .item .contentWide {padding: 28px 0;}
div.boardWrite .item .contentWide p.title {flex: none;margin-bottom: 18px;}
div.boardWrite .item .contentWide .content {flex: none;}
div.boardWrite .item .policyBox.terms {margin-top: 40px;}


/* list */

table.boardList {width: 100%;}
table.boardList tr th {line-height: 24px;font-size: 16px;font-weight: 700;text-align: center;background-color: #f0f8fa;padding: 23px 0;}
table.boardList tr th:first-child {
	-moz-border-radius-topleft: 35px;
	-webkit-border-top-left-radius: 35px;
	border-top-left-radius: 35px;
	-moz-border-radius-bottomleft: 35px;
	-webkit-border-bottom-left-radius: 35px;
	border-bottom-left-radius: 35px;
}
table.boardList tr th:last-child {
	-moz-border-radius-topright: 35px;
	-webkit-border-top-right-radius: 35px;
	border-top-right-radius: 35px;
	-moz-border-radius-bottomright: 35px;
	-webkit-border-bottom-right-radius: 35px;
	border-bottom-right-radius: 35px;
}
table.boardList tr td {line-height: 24px;vertical-align: middle;border-bottom: 1px solid #ebebeb;padding: 10px 10px;}
table.boardList tr td.date {text-align: center;}
table.boardList tr td.service {text-align: center;}
table.boardList tr td.person {text-align: center;}
table.boardList tr td.period {width: 210px;text-align: center;}
table.boardList tr td.link {width: 210px;text-align: center;}
table.boardList tr td.link .tipBox {width: 152px;}
table.boardList tr td.link .tipBox a.btnRound {display: block;}
table.boardList tr td.status {width: 210px;text-align: center;}
table.boardList tr.waiting td {}
table.boardList tr.running td.status {color: #38c1d9;font-weight: 700;}
table.boardList tr.end td {color: #999;}

div.boardList {}
div.boardList .head,
div.boardList .item {display: grid;
	grid-template-columns: auto 550px 210px 210px;
}
div.boardList .serviceInfo {display: grid;
	grid-template-columns: 2fr 1.5fr 1fr 1.5fr;
}
div.boardList .head p {line-height: 24px;font-size: 16px;font-weight: 700;text-align: center;background-color: #f0f8fa;padding: 23px 0;}
div.boardList .head > p:first-child {
	-moz-border-radius-topleft: 35px;
	-webkit-border-top-left-radius: 35px;
	border-top-left-radius: 35px;
	-moz-border-radius-bottomleft: 35px;
	-webkit-border-bottom-left-radius: 35px;
	border-bottom-left-radius: 35px;
}
div.boardList .head > p:last-child {
	-moz-border-radius-topright: 35px;
	-webkit-border-top-right-radius: 35px;
	border-top-right-radius: 35px;
	-moz-border-radius-bottomright: 35px;
	-webkit-border-bottom-right-radius: 35px;
	border-bottom-right-radius: 35px;
}
div.boardList .item {position: relative;line-height: 24px;vertical-align: middle;border-bottom: 1px solid #ebebeb;padding: 10px 0;}
div.boardList .item p {display: flex;align-items: center;justify-content: center;}
div.boardList .item .link {display: flex;align-items: center;justify-content: center;}
div.boardList .item .link .tipBox {width: auto;}
div.boardList .item .link .tipBox a.btnRound {display: block;}
div.boardList .item p.person span {display: none;}
div.boardList .item p.status {text-align: center;}
div.boardList .item.running p.status {color: #38c1d9;font-weight: 700;}
div.boardList .item.end {color: #999;}

/* pagination */

.pagination {}
.pagination ul {display: flex;justify-content: center; width:100%;}
.pagination ul li {}
.pagination ul li span,
.pagination ul li a {display: block;width: 32px;height: 32px;line-height: 30px;color: #999;text-align: center;text-decoration: none;border: 1px solid transparent;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	border-radius: 100%;
}
.pagination ul li.current span  {color: #03A9F4 !important; font-weight: 800; font-size: large;}

.pagination ul li a:hover {color: #252d3a;}
.pagination ul li span {color: #252d3a;}
.pagination ul li.home {margin-right: 7px;}
.pagination ul li.prev {margin-right: 22px;}
.pagination ul li.next {margin-left: 22px;}
.pagination ul li.end {margin-left: 7px;}
.pagination ul li.home a,
.pagination ul li.prev a,
.pagination ul li.next a,
.pagination ul li.end a {text-indent: -9999px;background-position: center center;background-repeat: no-repeat;background-size: auto 8px;border: 1px solid #ccc;}
.pagination ul li.home a:hover,
.pagination ul li.prev a:hover,
.pagination ul li.next a:hover,
.pagination ul li.end a:hover {border-color: #999;}
.pagination ul li.home a {background-image: url('../images/common/pagination_icon_home.png');}
.pagination ul li.prev a {background-image: url('../images/common/pagination_icon_prev.png');}
.pagination ul li.next a {background-image: url('../images/common/pagination_icon_next.png');}
.pagination ul li.end a {background-image: url('../images/common/pagination_icon_end.png');}



/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	/* list */

	div.boardList .head,
	div.boardList .item {
		grid-template-columns: auto 46% 160px 130px;
	}

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* common */

	.boardTopExp {margin-bottom: 20px;}
	.boardTopExp p.main {line-height: 22px;font-size: 16px;}
	.boardTopExp p.sub {line-height: 20px;font-size: 14px;margin-top: 8px;}

	/* write */

	table.boardWrite {width: 100%;border-top: 1px solid #ebebeb;}
	table.boardWrite tr td {border-bottom: 1px solid #ebebeb;padding: 12px 0;}
	table.boardWrite tr td.title {line-height: 26px;font-size: 16px;font-weight: 700;vertical-align: middle;}
	table.boardWrite tr td.title span.essential {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;color: #f00;vertical-align: middle;margin-left: 4px;}
	table.boardWrite tr td input[type=text],
	table.boardWrite tr td input[type=password] {width: 100%;line-height: 24px;font-size: 16px;border: 1px solid #dddddd;outline: none;padding: 12px 20px;}
	table.boardWrite tr td input[type=text]::placeholder ,
	table.boardWrite tr td input[type=password]::placeholder {color: #999;}
	table.boardWrite tr td input[type=checkbox] {}
	table.boardWrite tr td select {width: 100%;}
	table.boardWrite tr td textarea {width: 100%;}
	table.boardWrite tr td p.exp {line-height: 26px;font-size: 16px;color: #999;padding: 5px 0;margin-top: 12px;}

	div.boardWrite {border-top: 0; }
	div.boardWrite .item { flex-direction: column; align-items: flex-start; border-bottom: 0;padding: 0; margin-bottom: 18px; }
	div.boardWrite .item:last-child { margin-bottom: 0; }
	div.boardWrite .item p.title {flex: 0 0 auto;width: auto;line-height: 22px;font-size: 14px; margin-bottom: 7px; }
	div.boardWrite .item .content { width: 100%; }
	div.boardWrite .item .content input[type=text],
	div.boardWrite .item .content input[type=password] {line-height: 23px;font-size: 14px;padding: 10px 16px;}
	div.boardWrite .item .content p.exp {line-height: 18px;font-size: 14px;padding: 0;margin-top: 10px;}

	div.boardWrite .item .contentWide {padding: 0;}
	div.boardWrite .item .contentWide p.title {margin-bottom: 7px;}
	div.boardWrite .item .policyBox.terms {margin-top: 26px;}

	/* list */

	table.boardList {width: 100%;}
	table.boardList tr th {line-height: 24px;font-size: 16px;font-weight: 700;text-align: center;background-color: #f0f8fa;padding: 23px 0;}
	table.boardList tr th:first-child {
		-moz-border-radius-topleft: 35px;
		-webkit-border-top-left-radius: 35px;
		border-top-left-radius: 35px;
		-moz-border-radius-bottomleft: 35px;
		-webkit-border-bottom-left-radius: 35px;
		border-bottom-left-radius: 35px;
	}
	table.boardList tr th:last-child {
		-moz-border-radius-topright: 35px;
		-webkit-border-top-right-radius: 35px;
		border-top-right-radius: 35px;
		-moz-border-radius-bottomright: 35px;
		-webkit-border-bottom-right-radius: 35px;
		border-bottom-right-radius: 35px;
	}
	table.boardList tr td {line-height: 24px;vertical-align: middle;border-bottom: 1px solid #ebebeb;padding: 10px 10px;}
	table.boardList tr td.date {text-align: center;}
	table.boardList tr td.service {text-align: center;}
	table.boardList tr td.person {text-align: center;}
	table.boardList tr td.period {width: 210px;text-align: center;}
	table.boardList tr td.link {width: 210px;text-align: center;}
	table.boardList tr td.link .tipBox {width: 152px;}
	table.boardList tr td.link .tipBox a.btnRound {display: block;}
	table.boardList tr td.status {width: 210px;text-align: center;}
	table.boardList tr.waiting td {}
	table.boardList tr.running td.status {color: #38c1d9;font-weight: 700;}
	table.boardList tr.end td {color: #999;}

	div.boardList {}
	div.boardList .head,
	div.boardList .item {display: grid;
		grid-template-columns: 28% auto 25%;
	}
	div.boardList .head .serviceInfo { display: block; }
	div.boardList .head p {line-height: 24px;font-size: 15px;padding: 13px 0;}
	div.boardList .head p.link,
	div.boardList .head p.person,
	div.boardList .head p.period { display: none; }
	div.boardList .head > p:first-child {
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
	}
	div.boardList .head > p:last-child {
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		border-radius: 0;
	}
	div.boardList .item {padding: 30px 0 75px;}
	div.boardList .item .serviceInfo {display: flex; flex-direction: column; justify-content: center; }
	div.boardList .item .serviceInfo p.person { order: 1; }
	div.boardList .item .link { position: absolute; left: 50%; bottom: 25px; transform: translateX(-50%); }
	div.boardList .item p { font-size: 14px; }
	div.boardList .item p.person span {display: block; margin-right: 4px; }

	/* pagination */

	.pagination ul li span,
	.pagination ul li a {font-size: 14px}
	.pagination ul li.home {margin-right: 7px;}
	.pagination ul li.prev {margin-right: 10px;}
	.pagination ul li.next {margin-left: 10px;}
	.pagination ul li.end {margin-left: 7px;}
	.pagination ul li:nth-child(n+8):nth-child(-n+11) a { display: none; }

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {


}




/* ==============================================
   member
   ============================================== */

/* submit unit */

.submitUnit {position: relative;}
.submitUnit p.head {line-height: 26px;font-size: 20px;font-weight: 700;margin-bottom: 50px;}
.submitUnit p.exp {line-height: 20px;font-size: 14px;color: #999;margin-top: -20px;margin-bottom: 18px;}

.submitUnit ul.input {}
.submitUnit ul.input li {margin-bottom: 10px;}
.submitUnit ul.input li:last-child {margin-bottom: 0;}
.submitUnit ul.input li input {width: 100%;line-height: 28px;font-size: 16px;border: 1px solid #ddd;outline: none;background-color: #fff;padding: 10px 20px;}
.submitUnit ul.input li input::placeholder {color: #999;}
.submitUnit ul.input li input::-webkit-input-placeholder {color: #999;}
.submitUnit ul.input li input:-ms-input-placeholder {color: #999;}

.submitUnit button[type=submit] {display: block;width: 100%;height: 55px;line-height: 55px;font-size: 16px;color: #fff;font-weight: 700;text-align: center;outline: none;border: 0;background-color: #35c0d9;margin-top: 26px;cursor: pointer;
   -moz-border-radius: 28px;
   -webkit-border-radius: 28px;
   border-radius: 28px;
}
.submitUnit button[type=submit]:hover {background-color: #45cde5;}

.submitUnit ul.link {display: flex;justify-content: center;margin-top: 24px;}
.submitUnit ul.link li {position: relative;padding-left: 16px;margin-left: 14px;}
.submitUnit ul.link li:after {content: " ";position: absolute;left: 0;top: 50%;width: 1px;height: 16px;background-color: #707070;margin-top: -8px;}
.submitUnit ul.link li:first-child {padding-left: 0;margin-left: 0;}
.submitUnit ul.link li:first-child:after {display: none;}
.submitUnit ul.link li a {line-height: 20px;font-size: 16px;color: #6b7078;text-decoration: none;}
.submitUnit ul.link li a:hover {color: #000;text-decoration: underline;}

/* login */

#identityLogin .submitUnit {width: 430px;margin: 150px auto;}
#identityLogin .submitUnit p.head {text-align: center;}

/* search id password */

.searchIdPwBox {display: flex;width: 1200px;border: 1px solid #898d94;padding: 104px 90px 108px;margin: 150px auto;}
.searchIdPwBox .submitUnit {width: 430px;}
.searchIdPwBox .searchPassword {margin-left: auto;}
.searchIdPwBox .searchPassword:after {content: " ";position: absolute;left: -80px;top: 0;width: 1px;height: 100%;background-color: #e5e9eb;}

/* change password */

#identityChangePw .submitUnit {width: 430px;margin: 150px auto;}
#identityChangePw .submitUnit p.head {text-align: center;}

/* join */

.joinInfoWrap {width: 820px;margin: 110px auto 150px;}

.joinInfoWrap .btnList {margin-top: 60px;}
.joinInfoWrap .btnList ul li a.btnRound {width: 370px;}

/* join - search organization */

#searchOrganization {}

/* join done */

.joinDoneBox {width: 1200px;border: 1px solid #898d94;background: url('../images/member/join_done_icon.png') right 70px center no-repeat;padding: 86px 94px;margin: 150px auto;}
.joinDoneBox p.head {line-height: 44px;font-size: 36px;font-weight: 700;}
.joinDoneBox p.exp {line-height: 24px;font-size: 18px;color: #5e6064;margin-top: 18px;}
.joinDoneBox .btnList {margin-top: 40px;}
.joinDoneBox .btnList ul li a.btnRound {padding: 16px 50px;}

/* policy */

.policyWrap {width: 1200px;margin: 90px auto 100px;}


/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	/* search id password */

	.searchIdPwBox {width: auto;padding: 80px 60px 80px;margin: 120px 30px;}
	.searchIdPwBox .submitUnit {width: 48%;}
	.searchIdPwBox .submitUnit p.exp { width: 245px; word-break: keep-all; }
	.searchIdPwBox .searchPassword:after {display: none;}

	/* policy */

	.policyWrap {width: auto;margin: 80px 60px 90px;}

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* submit unit */

	.submitUnit p.head {line-height: 24px;font-size: 18px;margin-bottom: 40px;}
	.submitUnit p.exp {line-height: 20px;font-size: 14px;color: #999;word-break: keep-all;margin-top: -30px;margin-bottom: 18px;}

	.submitUnit ul.input li {margin-bottom: 10px;}
	.submitUnit ul.input li input {line-height: 23px;font-size: 14px;padding: 10px 20px;}

	.submitUnit button[type=submit] {height: 45px;line-height: 45px;font-size: 14px;margin-top: 20px;
	   -moz-border-radius: 23px;
	   -webkit-border-radius: 23px;
	   border-radius: 23px;
	}

	.submitUnit ul.link {margin-top: 28px;}
	.submitUnit ul.link li:after {height: 14px;margin-top: -7px;}
	.submitUnit ul.link li a {line-height: 20px;font-size: 14px;}

	/* login */

	#identityLogin .submitUnit {width: auto;margin: 100px 60px;}

	/* search id password */

	.searchIdPwBox { flex-direction: column; width: auto;border: 0;padding: 0;margin: 0;}
	.searchIdPwBox .submitUnit {width: auto; padding: 40px 60px 50px; }
	.searchIdPwBox .submitUnit p.exp { width: auto;}
	.searchIdPwBox .searchPassword { border-top: 1px solid #ebebeb; margin-left: 0; }
	.searchIdPwBox .searchPassword:after { display: none; }

	/* change password */

	#identityChangePw .submitUnit {width: auto;margin: 100px 60px;}

	/* join */

	.joinInfoWrap {width: auto;margin: 40px 60px 50px;}

	.joinInfoWrap .btnList {margin-top: 30px;}
	.joinInfoWrap .btnList ul li a.btnRound {width: 370px;}

	/* join - search organization */

	#searchOrganization {}

	/* join done */

	.joinDoneBox {width: auto;border: 0; background-position: center top; background-size: 186px auto;padding: 186px 0 0;margin: 40px auto 90px;}
	.joinDoneBox p.head {line-height: 34px;font-size: 24px; text-align: center; }
	.joinDoneBox p.exp {line-height: 20px;font-size: 15px; text-align: center; }
	.joinDoneBox .btnList {margin-top: 30px;}
	.joinDoneBox .btnList ul { justify-content: center; }
	.joinDoneBox .btnList ul li a.btnRound { width: 124px; padding: 12px 25px;}

	/* policy */

	.policyWrap {width: auto;margin: 60px 60px 70px;}

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* login */

	#identityLogin .submitUnit {margin: 100px 25px;}

	/* search id password */

	.searchIdPwBox .submitUnit {padding: 40px 25px 50px; }
	.searchIdPwBox .searchId p.exp { width: 245px; }
	.searchIdPwBox .searchPassword p.exp { width: 185px; }

	/* change password */

	#identityChangePw .submitUnit {margin: 100px 25px;}

	/* join */

	.joinInfoWrap {width: auto;margin: 40px 25px 50px;}
	.joinInfoWrap .btnList ul li {width: 100%;}
	.joinInfoWrap .btnList ul li a.btnRound {width: 100%;}

	/* join done */

	.joinDoneBox p.exp { width: 260px; margin: 20px auto 0; }

	/* policy */

	.policyWrap {margin: 40px 25px 50px;}

}




/* ==============================================
   mypage
   ============================================== */

/* jindan list */

.jindanListWrap {width: 1200px;margin: 110px auto 150px;}
.jindanListWrap .pagination {margin-top: 80px;}

/* member info */

.memberInfoWrap {width: 820px;margin: 110px auto 150px;}
.memberInfoWrap .btnList {margin-top: 60px;}
.memberInfoWrap .btnList ul li a.btnRound {width: 180px;}



/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	/* jindan list */

	.jindanListWrap {width: auto;margin: 80px 60px 100px;}

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* jindan list */

	.jindanListWrap {width: auto;margin: 45px auto 50px;}
	.jindanListWrap .pagination {margin-top: 40px;}

	/* member info */

	.memberInfoWrap {width: auto;margin: 45px 60px 50px;}
	.memberInfoWrap .btnList {margin-top: 30px;}
	.memberInfoWrap .btnList ul li a.btnRound {width: auto;}

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* member info */

	.memberInfoWrap {width: auto;margin: 45px 25px 50px;}

}
