@charset "UTF-8";
/* CSS PC/SP共通レイアウト */
/*--------------------------------------------------*
 *   事業案内ページ
 *--------------------------------------------------*/
#works {
	width: 100%;
}
#works .works_block .respond {
	width: 980px;
	margin: 0px auto 130px;
}
#works .works_block .respond .wrap {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 100px;
}
#works .works_block .respond .wrap div:nth-child(1) {
	width: 540px;
	font-size: 4.0rem;
	letter-spacing: 0.07em;
	line-height: 1.4;
	font-weight: 600;
}
#works .works_block .respond .wrap div:nth-child(2) {
	width: calc(100% - 540px);
	font-size: 1.6rem;
}
#works .works_block .graph {
	width: 980px;
	text-align: center;
	background-color: #e1effc;
	border-radius: 16px;
	margin: 0px auto 130px;
	padding: 50px 0px;
}
#works .works_block .flow {
	background-color: #f4f5f6;
	padding: 80px 0px 150px;
}
#works .works_block .flow .inner {
	width: 980px;
	margin: 0px auto;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}
#works .works_block .flow .inner .flow_menu {
	width: calc(100% - 800px);
	position:relative;
}
#works .works_block .flow .inner .flow_menu ul{
	position:sticky;
	top:130px;
}
#works .works_block .flow .inner .flow_menu ul li {
	margin-bottom: 15px;
}
#works .works_block .flow .inner .flow_menu ul li a {
	display: block;
	font-size: 1.7rem;
	color: #77808c;
	font-weight: 500;
	padding-left: 20px;
	position: relative;
}
#works .works_block .flow .inner .flow_menu ul li a:after {
	content: "■";
	font-size: 1.0rem;
	position: absolute;
	top: 50%;
	left: 0px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#works .works_block .flow .inner .flow_menu ul li a:hover {
	color: #242b38;
	opacity: 1.0;
}
#works .works_block .flow .inner .flow_menu ul li a:hover:after {
	color: #1b69e0;
}
#works .works_block .flow .inner .flow_menu ul li a.now {
	color: #242b38;
}
#works .works_block .flow .inner .flow_menu ul li a.now:after {
	color: #1b69e0;
}
#works .works_block .flow .inner .flow_list {
	width: 800px;
	background-color: #FFF;
	border-radius: 16px;
	padding: 60px 50px;
}
#works .works_block .flow .inner .flow_list ul li {
	margin-bottom: 100px;
}
#works .works_block .flow .inner .flow_list ul li:last-child {
	margin-bottom: 0px;
}
#works .works_block .flow .inner .flow_list ul li .major {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap {
	width: calc(100% - 300px);
	padding-right: 50px;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .koumoku {
	font-size: 2.4rem;
	font-weight: 600;
	line-height: 1.6;
	position: relative;
	margin-bottom: 10px;
	padding-left: 20px;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .koumoku:after {
	content: "■";
	font-size: 1.2rem;
	color: #1b69e0;
	position: absolute;
	top: 50%;
	left: 0px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .notice {
	font-size: 1.6rem;
	margin-bottom: 24px;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .bt_detail {
	width: 184px;
	font-size: 1.6rem;
	color: #1b69e0;
	font-weight: 500;
	line-height: 60px;
	border: 1px solid #1b69e0;
	padding-left: 24px;
	position: relative;
	cursor: pointer;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .bt_detail .arrow_button {
	width: 12px;
	height: 6px;
	background: url("../img/works/icon_open.png") no-repeat right center;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	-webkit-transform : translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .toggle_button_close .arrow_button {
	width: 12px;
	height: 6px;
	background: url("../img/works/icon_close.png") no-repeat right center;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	-webkit-transform : translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .bt_detail .arrow_button span {
	position: absolute;
	left: -7650px;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .bt_detail .arrow_button_close {
	width: 12px;
	height: 6px;
	background: url("../img/works/icon_close.png") no-repeat right center;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	-webkit-transform : translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .toggle_box {
	display:none;
}
#works .works_block .flow .inner .flow_list ul li .toggle_open{
	display:block;
}

#works .works_block .flow .inner .flow_list ul li .open_box {
	margin-top: 30px;
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}
#works .works_block .flow .inner .flow_list ul li .open_box .photo {
	width: 300px;
}
#works .works_block .flow .inner .flow_list ul li .open_box ul {
	width: calc(100% - 300px);
}
#works .works_block .flow .inner .flow_list ul li .open_box ul li {
	font-size: 1.6rem;
	margin-bottom: 10px;
	padding-left: 16px;
	position: relative;
}
#works .works_block .flow .inner .flow_list ul li .open_box ul li:after {
	content: "■";
	font-size: 1.0rem;
	color: #cacaca;
	position: absolute;
	top: 14px;
	left: 0px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .hyou table {
	width: 100%;
}
#works .works_block .flow .inner .flow_list ul li .hyou table th {
	width: 56px;
	font-size: 1.6rem;
	font-weight: 600;
	vertical-align: top;
	padding-top: 6px;
}
#works .works_block .flow .inner .flow_list ul li .hyou table td {
	width: calc(100% - 56px);
	line-height: 1.6;
	padding-top: 8px;
}
#works .works_block .flow .inner .flow_list ul li .hyou table td ul {
	display:-webkit-box;
	display: flex;
	flex-wrap: wrap;
}
#works .works_block .flow .inner .flow_list ul li .hyou table td ul li {
	font-size: 1.6rem;
	margin-right: 15px;
	margin-bottom: 0px;
	padding-left: 14px;
	position: relative;
}
#works .works_block .flow .inner .flow_list ul li .hyou table td ul li:before {
	content: "■";
	font-size: 1.0rem;
	color: #CACACA;
	position: absolute;
	top: 50%;
	left: 0px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .major .photo {
	width: 300px;
}
#works .works_block .flow .inner .flow_list ul li .produce {
	width: 100%;
}
#works .works_block .flow .inner .flow_list ul li .produce .ttl_produce {
	font-size: 1.8rem;
	color: #1b69e0;
	font-weight: 600;
	border-bottom: 1px solid #77808c;
	padding-bottom: 8px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li {
	border-bottom: 1px solid #77808c;
	margin-bottom: 0px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add {
	position: relative;
	padding: 16px 80px 16px 0px;
	cursor: pointer;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .question {
	display:-webkit-box;
	display:flex;
	flex-wrap: wrap;
	align-items: center;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .question div:nth-child(1) {
	width: 150px;
	font-size: 1.6rem;
	font-weight: 600;
	border-right: 2px solid #f4f5f6;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .question div:nth-child(2) {
	width: calc(100% - 150px);
	font-size: 1.3rem;
	color: #77808c;
	padding-left: 20px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .toggle_button {
	width: 20px;
	height: 20px;
	background: url("../img/works/icon_arrow_open.png") no-repeat right center;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	-webkit-transform : translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .toggle_button span {
	position: absolute;
	left: -7650px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .toggle_button_close {
	width: 20px;
	height: 2px;
	background: url("../img/works/icon_arrow_close.png") no-repeat right center;
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	-webkit-transform : translateY(-50%);
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer {
	padding: 8px 0px 60px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .note {
	font-size: 1.6rem;
	margin-bottom: 20px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .ph_grp {
	display: -webkit-box;
	display: flex;
	flex-wrap: wrap;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .ph_grp div {
	width: 49%;
	margin-bottom: 2%;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .ph_grp div:nth-child(2n-1) {
	margin-right: 2%;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .subheading {
	display:-webkit-box;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 1.6rem;
	margin-bottom: 8px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .subheading:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	background: #EEE;
	margin-left: 20px;
	display: block;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .line ul {
	display:-webkit-box;
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 8px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .line ul li {
	font-size: 1.6rem;
	margin-right: 20px;
	margin-bottom: 8px;
	padding-left: 14px;
	border-bottom: none;
	position: relative;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .line ul li:before {
	content: "■";
	font-size: 1.0rem;
	color: #CACACA;
	position: absolute;
	top: 50%;
	left: 0px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

/* スマホレイアウト */
@media (max-width: 1024px) {
#works .works_block .respond {
	width: 100%;
	margin: 0px 0px 8vw;
}
#works .works_block .respond .wrap {
	display: block;
	flex-wrap: nowrap;
	margin-bottom: 8vw;
	padding: 0px 5.33vw;
}
#works .works_block .respond .wrap div:nth-child(1) {
	width: 100%;
	font-size: 6.93vw;
	margin-bottom: 6vw;
}
#works .works_block .respond .wrap div:nth-child(2) {
	width: 100%;
	font-size: 4vw;
}
#works .works_block .graph {
	width: auto;
	text-align: center;
	background-color: #e1effc;
	border-radius: 16px;
	margin: 0px 5.33vw 24vw;
	padding: 6vw 5.33vw;
}
#works .works_block .flow {
	padding: 16vw 5.33vw 26.67vw;
}
#works .works_block .flow .inner {
	width: 100%;
	display: block;
	flex-wrap: nowrap;
}
#works .works_block .flow .inner .flow_menu {
	display: none;
}
#works .works_block .flow .inner .flow_list {
	width: 100%;
	padding: 8vw 5.33vw;
}
#works .works_block .flow .inner .flow_list ul li {
	margin-bottom: 24vw;
}
#works .works_block .flow .inner .flow_list ul li .major {
	display: block;
	flex-wrap: nowrap;
	position: relative;
}
#works .works_block .flow .inner .flow_list ul li .major.pb_space {
	padding-bottom: 22vw;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap {
	width: 100%;
	padding-right: 0px;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .koumoku {
	font-size: 5.33vw;
	margin-bottom: 2vw;
	padding-left: 5vw;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .koumoku:after {
	font-size: 2vw;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .notice {
	font-size: 4vw;
	margin-bottom: 3vw;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .bt_detail {
	width: 100%;
	font-size: 4.27vw;
	line-height: 16vw;
	padding-left: 8vw;
	position: absolute;
	left: 0px;
	right: 0px;
	bottom: 0px;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .bt_detail .arrow_button {
	right: 8vw;
}
#works .works_block .flow .inner .flow_list ul li .major .wrap .bt_detail .arrow_button_close {
	right: 8vw;
}
#works .works_block .flow .inner .flow_list ul li .open_box {
	margin-top: 6vw;
	display: block;
	flex-wrap: nowrap;
}

#works .works_block .flow .inner .flow_list ul li .open_box .photo {
	width: 100%;
}
#works .works_block .flow .inner .flow_list ul li .open_box ul {
	width: 100%;
	margin-bottom: 4vw;
}
#works .works_block .flow .inner .flow_list ul li .open_box ul li {
	font-size: 4vw;
	margin-bottom: 1vw;
	padding-left: 4vw;
}
#works .works_block .flow .inner .flow_list ul li .open_box ul li:after {
	font-size: 2vw;
	top: 3vw;
}
#works .works_block .flow .inner .flow_list ul li .hyou {
	margin-bottom: 6vw;
}
#works .works_block .flow .inner .flow_list ul li .hyou table th {
	width: 20%;
	font-size: 4vw;
	padding-top: 3vw;
}
#works .works_block .flow .inner .flow_list ul li .hyou table td {
	width: calc(100% - 20%);
	padding-top: 3vw;
}
#works .works_block .flow .inner .flow_list ul li .hyou table td ul li {
	font-size: 4vw;
	margin-right: 3vw;
	padding-left: 4vw;
}
#works .works_block .flow .inner .flow_list ul li .hyou table td ul li:before {
	font-size: 2vw;
}
#works .works_block .flow .inner .flow_list ul li .major .photo {
	width: 100%;
}
#works .works_block .flow .inner .flow_list ul li .major .photo img {
	width: 100%;
}
#works .works_block .flow .inner .flow_list ul li .produce {
	width: 100%;
}
#works .works_block .flow .inner .flow_list ul li .produce .ttl_produce {
	font-size: 4.27vw;
	margin-top: 12vw;
	padding-bottom: 2vw;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add {
	padding: 4vw 12vw 4vw 0px;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .question div:nth-child(1) {
	width: 36vw;
	font-size: 4.27vw;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .bt_add .question div:nth-child(2) {
	width: calc(100% - 36vw);
	font-size: 3.47vw;
	padding-left: 3vw;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer {
	padding: 3vw 0px 16vw;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .note {
	font-size: 4vw;
	margin-bottom: 4vw;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .ph_grp {
	display: block;
	flex-wrap: nowrap;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .ph_grp div {
	width: 100%;
	margin-bottom: 3%;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .ph_grp div:nth-child(2n-1) {
	margin-right: 0;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .subheading {
	font-size: 4vw;
	margin-bottom: 3vw;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .line ul li {
	font-size: 4vw;
	margin-right: 3vw;
	padding-left: 4vw;
}
#works .works_block .flow .inner .flow_list ul li .produce ul li .add_box .answer .line ul li:before {
	font-size: 2vw;
}
}