@charset "utf-8";
/* ==================================================
		
		case PC・SP

================================================== */

/* --------------------------------------------------
		.clearfix
-------------------------------------------------- */
.clearfix:after {
	height: 0;
	clear: both;
	visibility: hidden;
	display: block;
	content: ".";
}

/* ==================================================
		
		case PC

================================================== */

@media screen and (min-width:781px) {
/* --------------------------------------------------
		.vi
-------------------------------------------------- */
.vi .vi-inner {
	background: url(/wordpress-content/services/sc/case/img/bg-vi-case.jpg) no-repeat center / cover;
}
/* --------------------------------------------------
		base
-------------------------------------------------- */
h3 {
	font-size: 35px;
	text-align: center;
	color: #00679a;
}
.case-detail h3 {
 text-align: left;
}
h4 {
 border: 1px solid #e4e4e4;
 border-left: 1px solid transparent;
}
h4 span {
 padding: 20px 0 19px 20px;
 border-left: 5px solid #00679a;
 margin: -1px;
 display: block;
 font-size: 17px;
 font-weight: bold;
 color: #00679a;
}
.inner {
 width: 1080px;
 margin: 0 auto;
}
.bluebox {
 width: 100%;
 padding: 20px;
 border: 5px solid #edf5f9;
 background: #f8fcff;
 box-sizing: border-box;
}
/* --------------------------------------------------
		.case
-------------------------------------------------- */
.main .case {
 font-size: 14px;
 color: #555555;
 padding-top: 50px;
}
.main .case .case-txt01 {
	text-align: center;
	margin-top: 15px;
}
.main .case .case-inner {
 margin-top: 30px;
}
.main .case .case-inner .case-box > li {
 margin-top: 10px;
}
.main .case .case-inner .case-box > li:first-of-type {
 margin-top: 0;
}
.main .case .case-inner .case-box > li .tit {
 font-size: 16px;
 font-weight: bold;
}
.main .case .case-inner .case-box > li .tit a:link, 
.main .case .case-inner .case-box > li .tit a:visited {
 color: #00679a;
 text-decoration: underline;
}
.main .case .case-inner .case-box > li .tit a:hover {
 text-decoration: none;
}
.main .case .case-inner .case-box > li .txt {
 padding-top: 2px;
}
.main .case .case-inner .case-box > li .case-wrapper {
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: flex-start;
 margin-top: 3px;
}
.main .case .case-inner .case-box > li .case-wrapper li {
 font-size: 13px;
 font-weight: bold;
 margin-right: 16px;
}
.main .case .case-inner .case-box > li .connection {
 margin: 21px 0 0 4px;
}
.main .case .case-inner .case-box > li .connection > p {
 color: #555555;
 font-weight: bold;
}
.main .case .case-inner .case-box > li .connection .tit {
 font-size: 14px;
 width: 103px;
}
.main .case .case-inner .case-box > li .connection .tit::after {
 content: "：";
} 
.main .case .case-inner .case-box > li .connection .connection-inner {
 width: 925px;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: flex-start;
 flex-wrap: wrap;
}
.main .case .case-inner .case-box > li .connection .connection-inner li {
 padding-right: 18px;
}
.main .case .case-inner .case-box > li .connection .connection-inner li a:link, 
.main .case .case-inner .case-box > li .connection .connection-inner li a:visited {
 color: #555555;
 font-weight: bold;
 text-decoration: none;
}
.main .case .case-inner .case-box > li .connection .connection-inner li a:hover {
 text-decoration: underline;
}
/* --------------------------------------------------
		.case-detail
-------------------------------------------------- */
.main .case-detail {
}
/* --------------------------------------------------
		.back
-------------------------------------------------- */
.main .case-detail .back {
 margin-top: 30px;
}
.main .case-detail .back .back-inner {
 margin-top: 15px;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: space-between;
}
.main .case-detail .back .back-inner .back-box01 li {
 text-indent: -14px;
 margin-left: 14px;
 padding-top: 27px;
}
.main .case-detail .back .back-inner .back-box01 li:first-of-type {
 padding-top: 0;
}
.main .case-detail .back .back-inner .back-box01 li::before {
 content: "・";
}
.main .case-detail .back .back-inner .back-box02 {
 padding: 5px 0 0 35px;
}
.main .case-detail .back .back-inner .back-box02 .img {
 padding-top: 40px;
}
.main .case-detail .back .back-inner .back-box02 .img:first-of-type {
 padding-top: 0;
}
/* --------------------------------------------------
		.result
-------------------------------------------------- */
.main .case-detail .result {
 margin-top: 30px;
}
.main .case-detail .result .result-inner {
 margin-top: 20px;
}
.main .case-detail .result .result-inner li {
 font-weight: bold;
 text-indent: -14px;
 margin-left: 14px;
 padding-top: 30px;
}
.main .case-detail .result .result-inner li:first-of-type {
 padding-top: 0;
}
.main .case-detail .result .result-inner > li::before {
 content: "・";
}
.main .case-detail .result .result-inner .num {
 padding-top: 11px;
}
.main .case-detail .result .result-inner .num::before {
 content: none;
}
.main .case-detail .result .result-inner .num ol li {
 padding-top: 0;
}
/* --------------------------------------------------
		.other
-------------------------------------------------- */
.main .case-detail .other {
 width: 100%;
 margin-top: 30px;
 display: block;
}
.main .case-detail .other .other-inner {
 padding-top: 15px;
 border-top: 1px solid #e4e4e4;
}
.main .case-detail .other .other-inner .other-box .other-wrapper {
 margin-top: 20px;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li {
 font-weight: bold;
 padding-top: 6px;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li:first-of-type {
 padding-top: 0;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li a:link, 
.main .case-detail .other .other-inner .other-box .other-wrapper li a:visited {
 color: #555555;
 text-decoration: none;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li a:hover {
 text-decoration: underline;
}
/*.connect
-------------------------------------------------- */ 
.main .case-detail .other .connect .other-box .other-wrapper li::before {
 content: "・";
}
/* --------------------------------------------------
		.btnarea
-------------------------------------------------- */
.main .case-detail .btnarea {
 margin-top: 50px;
 text-align: center;
}
.main .case-detail .btnarea .btn {
 display: inline-block;
 width: 462px;
 background: #0a6d9e url(/wordpress-content/services/sc/case/img/bak_btn.gif) no-repeat left top;
 border-radius: 30px;
}
.main .case-detail .btnarea .btn a {
 display: block;
 color: #ffffff;
 padding: 12px 0 12px;
 text-decoration: none;
}
.main .case-detail .btnarea .btn:hover {
 text-decoration: none;
 transition: opacity 0.5s;
 opacity: 0.6;
}
.main .case-detail .btn a span::after {
 content: "\f105";
 font-family: 'Font Awesome\ 5 Free';
 font-weight: bold;
 position: relative;
 top: 1px;
 left: 9px;
}
/* --------------------------------------------------
		accordion
-------------------------------------------------- */
.condition-btn {
 position: relative;
 margin-bottom: 30px;
 cursor: pointer;
}
.condition-btn span:after {
 content: "";
 position: absolute;
 right: 20px;
 top: 38%;
 transition: all 0.2s ease-in-out;
 display: block;
 width: 8px;
 height: 8px;
 border-top: solid 2px #00679a;
 border-right: solid 2px #00679a;
 -webkit-transform: rotate(135deg);
 transform: rotate(135deg);
}
.condition-btn span.open:after {
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 top: 45%;
}
.main .accordion-container {
 width: 910px;
 margin: 8px auto 40px;
 display: none;
}
.main .accordion-container .accordion-inner {
 border-bottom: 1px solid #e4e4e4;
 padding: 20px 10px;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: flex-start;
}
.main .accordion-container .accordion-inner:first-of-type {
 padding-top: 0;
}
.main .accordion-container .accordion-inner .condition-title {
 font-size: 18px;
 color: #00679a;
 font-weight: bold;
 letter-spacing: 6px;
 position: relative;
 min-width: 110px;
 margin-right: 38px;
 text-align: right;
}
.main .accordion-container .accordion-inner .condition label {
 font-size: 17px;
 padding-right: 20px;
}
.main .accordion-container .accordion-inner .condition label input {
 margin-right: 1px;
}
 
}

/* ==================================================
		
		case SP

================================================== */

@media screen and (max-width:780px) {
/* --------------------------------------------------
		.vi
-------------------------------------------------- */
.vi .vi-inner {
	background: url(/wordpress-content/services/sc/case/img/bg-vi-case.jpg) no-repeat center / cover;
}
/* --------------------------------------------------
		base
-------------------------------------------------- */
.vi.subpage .vi-wrapper h2 span:first-child  {
	font-size: 19px;
	letter-spacing: -0.5px;
}
h3 {
	font-size: 18px;
	text-align: center;
	color: #00679a;
	padding: 0 12px;
}
.case-detail h3 {
 text-align: left;
 margin: 0;
}
.case-detail .other h3 {padding: 0;}
h4 {
 border: 1px solid #e4e4e4;
 border-left: 1px solid transparent;
}
h4 span {
 padding: 15px 22px 14px;
 border-left: 5px solid #00679a;
 margin: -1px 0;
 text-indent: -15px;
 display: block;
 font-size: 12px;
 font-weight: bold;
 color: #00679a;
}
.inner {
 margin: 0 12px;
}
.bluebox {
 width: 100%;
 padding: 15px;
 border: 5px solid #edf5f9;
 background: #f8fcff;
 box-sizing: border-box;
}
/* --------------------------------------------------
		.case
-------------------------------------------------- */
.main .case {
 font-size: 12px;
 color: #555555;
	padding-top: 25px;
}
.main .case .case-txt01 {
	text-align: left;
	padding: 0 12px;
	margin-top: 5px;
}
.main .case .case-inner {
 margin-top: 20px;
}
.main .case .case-inner .case-box > li {
 margin-top: 10px;
}
.main .case .case-inner .case-box > li:first-of-type {
 margin-top: 0;
}
.main .case .case-inner .case-box > li .tit {
 font-size: 15px;
 font-weight: bold;
}
.main .case .case-inner .case-box > li .tit a:link, 
.main .case .case-inner .case-box > li .tit a:visited {
 color: #056a9c;
 text-decoration: underline;
}
.main .case .case-inner .case-box > li .tit a:hover {
 text-decoration: none;
}
.main .case .case-inner .case-box > li .txt {
 padding-top: 2px;
}
.main .case .case-inner .case-box > li .case-wrapper {
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: flex-start;
 margin-top: 3px;
}
.main .case .case-inner .case-box > li .case-wrapper li {
 font-size: 11px;
 font-weight: bold;
 margin-right: 5px;
}
.main .case .case-inner .case-box > li .connection {
 margin-top: 15px;
 color: #555555;
 font-weight: bold;
}
.main .case .case-inner .case-box > li .connection .tit {
 font-size: 12px;
 width: 90px;
}
.main .case .case-inner .case-box > li .connection .tit::after {
 content: "：";
} 
.main .case .case-inner .case-box > li .connection .connection-inner {
 width: calc(100% - 90px);
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: flex-start;
 flex-wrap: wrap;
}
.main .case .case-inner .case-box > li .connection .connection-inner li {
 padding-right: 10px;
}
.main .case .case-inner .case-box > li .connection .connection-inner li a:link, 
.main .case .case-inner .case-box > li .connection .connection-inner li a:visited {
 color: #555555;
 font-weight: bold;
 text-decoration: none;
}
.main .case .case-inner .case-box > li .connection .connection-inner li a:hover {
 text-decoration: underline;
}
/* --------------------------------------------------
		.case-detail
-------------------------------------------------- */
.main .case-detail {
}
/* --------------------------------------------------
		.back
-------------------------------------------------- */
.main .case-detail .back {
 margin-top: 20px;
}
.main .case-detail .back .back-inner {
 margin-top: 10px;
}
.main .case-detail .back .back-inner .back-box01 li {
 text-indent: -12px;
 margin-left: 12px;
 padding-top: 3px;
}
.main .case-detail .back .back-inner .back-box01 li:first-of-type {
 padding-top: 0;
}
.main .case-detail .back .back-inner .back-box01 li::before {
 content: "・";
}
.main .case-detail .back .back-inner .back-box02 .img {
 margin-top: 35px;
 padding-bottom: 15px;
 overflow: auto;
}
.main .case-detail .back .back-inner .back-box02 .img:first-of-type {
 margin-top: 15px;
}
.main .case-detail .back .back-inner .back-box02 .img img {
 width: 160%;
 max-width: 160%;
}
/* --------------------------------------------------
		.result
-------------------------------------------------- */
.main .case-detail .result {
 margin-top: 20px;
}
.main .case-detail .result .result-inner {
 margin: 15px 0;
}
.main .case-detail .result .result-inner li {
 font-weight: bold;
 text-indent: -12px;
 margin-left: 12px;
 padding-top: 24px;
}
.main .case-detail .result .result-inner li:first-of-type {
 padding-top: 0;
}
.main .case-detail .result .result-inner > li::before {
 content: "・";
}
.main .case-detail .result .result-inner .num {
 padding-top: 4px;
}
.main .case-detail .result .result-inner .num::before {
 content: none;
}
.main .case-detail .result .result-inner .num li {
 text-indent: -15px;
 margin-left: 16px;
 padding-top: 4px;
}
/* --------------------------------------------------
		.other
-------------------------------------------------- */
.main .case-detail .other {
 display: block;
}
.main .case-detail .other .other-inner {
 margin-top: 20px;
 padding-top: 10px;
 border-top: 1px solid #e4e4e4;
 width: 100%;
 box-sizing: border-box;
}
.main .case-detail .other .other-inner .other-box .other-wrapper {
 margin: 15px 0;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li {
 font-weight: bold;
 padding-top: 3px;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li:first-of-type {
 padding-top: 0;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li a:link, 
.main .case-detail .other .other-inner .other-box .other-wrapper li a:visited {
 color: #555555;
 text-decoration: none;
}
.main .case-detail .other .other-inner .other-box .other-wrapper li a:hover {
 text-decoration: underline;
}
/*.connect
-------------------------------------------------- */ 
.main .case-detail .other .connect .other-box .other-wrapper li {
 text-indent: -12px;
 margin-left: 12px;
}
.main .case-detail .other .connect .other-box .other-wrapper li::before {
 content: "・";
}
/* --------------------------------------------------
		.btnarea
-------------------------------------------------- */
.main .case-detail .btnarea {
 margin-top: 40px;
 text-align: center;
}
.main .case-detail .btnarea .btn {
 display: inline-block;
 width: 80%;
 background: #0a6d9e url(/wordpress-content/services/sc/case/img/bak_btn.gif) no-repeat left top;
 border-radius: 30px;
}
.main .case-detail .btnarea .btn a {
 display: block;
 color: #ffffff;
 padding: 10px 0;
 text-decoration: none;
}
.main .case-detail .btnarea .btn:hover {
 text-decoration: none;
 transition: opacity 0.5s;
 opacity: 0.6;
}
.main .case-detail .btn a span::after {
 content: "\f105";
 font-family: 'Font Awesome\ 5 Free';
 font-size: 16px;
 font-weight: bold;
 position: relative;
 top: 2px;
 left: 5px;
}
/* --------------------------------------------------
		accordion
-------------------------------------------------- */
.condition-btn {
 position: relative;
 margin-bottom: 20px;
 cursor: pointer;
}
.condition-btn span:after {
 content: "";
 position: absolute;
 right: 10px;
 top: 38%;
 transition: all 0.2s ease-in-out;
 display: block;
 width: 8px;
 height: 8px;
 border-top: solid 2px #00679a;
 border-right: solid 2px #00679a;
 -webkit-transform: rotate(135deg);
 transform: rotate(135deg);
}
.condition-btn span.open:after {
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 top: 45%;
}
.main .accordion-container {
 margin: 5px 0 25px;
 display: none;
}
.main .accordion-container .accordion-inner {
 border-bottom: 1px solid #e4e4e4;
 padding: 10px;
 border-bottom: 1px solid #e4e4e4;
 padding: 15px 10px;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: flex-start;
}
.main .accordion-container .accordion-inner:first-of-type {
 padding-top: 0;
}
.main .accordion-container .accordion-inner .condition-title {
 font-size: 15px;
 color: #00679a;
 font-weight: bold;
 letter-spacing: 3px;
 position: relative;
 min-width: 40px;
 margin-right: 18px;
 text-align: right;
}
.main .accordion-container .accordion-inner .condition label {
 font-size: 15px;
 padding-right: 10px;
}
.main .accordion-container .accordion-inner .condition label input {
 margin-right: 1px;
}

}