@charset "utf-8";
/* CSS Document */


/* --------------------------------------------------------------------------------
	header
-------------------------------------------------------------------------------- */
#fscc-plan #header{
	overflow:hidden;
	padding:0;
}


/*--------------------------------------------------------------------
 ヘッダー画像
---------------------------------------------------------------------*/
#fscc-plan .header-img{
	width:1100px;
	margin:0 auto;
	background: #1e5078;
}
#fscc-plan .header-img h2{
	width:630px;
	margin:0 auto;
	padding: 10px 0;
}
#fscc-plan .header-img h2 img{
	max-width:100%;
	vertical-align:bottom;
}




/*--------------------------------------------------------------------
 fscc-plan
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan{
	width:1100px;
	margin:0 auto;
	padding: 0 0 44px;
}



/*--------------------------------------------------------------------
 こんなお困りごとありませんか？
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .problems-block{
	margin:45px auto 80px auto;
}
#fscc-plan .fscc-plan .problems-block h3{
	width:790px;
	margin:0 auto;
}
#fscc-plan .fscc-plan .problems-block .problems{
	background: url("../images/problems-img.png") no-repeat;
	width: 945px;
	height: 505px;
	margin: 50px auto 0 auto;
	position: relative;
}
#fscc-plan .fscc-plan .problems-block .problems p{
	font-size: 17px;
	font-weight: 700;
	text-align: center;
}
#fscc-plan .fscc-plan .problems-block .problems p.text1{
	position: absolute;
	top:15px;
	left: 50%;
	transform: translate(-50%, 0);
}
#fscc-plan .fscc-plan .problems-block .problems p.text2{
	position: absolute;
	top:135px;
	left: 120px;
}
#fscc-plan .fscc-plan .problems-block .problems p.text3{
	position: absolute;
	top:135px;
	right: 60px;
}
#fscc-plan .fscc-plan .problems-block .problems p.text4{
	position: absolute;
	top:310px;
	left: 18px;
}
#fscc-plan .fscc-plan .problems-block .problems p.text5{
	position: absolute;
	top:310px;
	right: 70px;
}
#fscc-plan .fscc-plan .problems-block h4{
	font-size: 50px;
	color: #f07d32;
	font-weight: 700;
	text-align: center;
}
#fscc-plan .fscc-plan .problems-block h4 span{
	border-bottom: 7px solid #d14848;
}



/*--------------------------------------------------------------------
コマースクリエイターってこんなに便利なんです!!
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .convenience-block{
	background: #ece9e9;
	margin:0 auto;
	padding: 70px 0 50px 0;
}
#fscc-plan .fscc-plan .convenience-block h3{
	width:935px;
	margin:0 auto;
}
#fscc-plan .fscc-plan .convenience-block h4{
	font-size: 30px;
	text-align: center;
	margin: 60px 0 40px 0;
}
#fscc-plan .fscc-plan .convenience-block p{
	font-size: 17px;
	text-align: center;
}
#fscc-plan .fscc-plan .convenience-block .convenience{
	width: 940px;
	margin: 60px auto 30px auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#fscc-plan .fscc-plan .convenience-block .convenience .box{
	width: 460px;
	background: #fff;
	padding: 20px;
	margin-bottom: 15px;
	border-radius: 7px;
	box-sizing: border-box;
	font-size: 17px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#fscc-plan .fscc-plan .convenience-block .convenience .box .img{
	width: 42px;
}
#fscc-plan .fscc-plan .convenience-block .convenience .box p{
	width: 355px;
	text-align: left;
}
#fscc-plan .fscc-plan .convenience-block .convenience .box p .txt-ora{
	color: #e77737;
}
#fscc-plan .fscc-plan .convenience-block .btn{
	width: 505px;
	margin: 0px auto;
}



/*--------------------------------------------------------------------
『夢や』が選ばれる理由
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .reason-block{
	width: 940px;
	margin: 75px auto 85px auto;
}
#fscc-plan .fscc-plan .reason-block h3{
	width:490px;
	margin:0 auto;
}
#fscc-plan .fscc-plan .reason-block .reason{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 60px;
}
#fscc-plan .fscc-plan .reason-block .reason .box1{
	width:285px;
	display: flex;
	flex-direction: column;
	align-items: center;
}
#fscc-plan .fscc-plan .reason-block .reason .box2{
	width:315px;
	display: flex;
	flex-direction: column;
	align-items: center;
}
#fscc-plan .fscc-plan .reason-block .reason .img{
	width:190px;
}
#fscc-plan .fscc-plan .reason-block .reason .icon{
	margin: 15px 0 20px 0;
}
#fscc-plan .fscc-plan .reason-block .reason p{
	font-size: 21px;
	font-weight: 700;
	text-align: center;
	letter-spacing: -0.05em;
}
#fscc-plan .fscc-plan .reason-block .reason p .txt-ora{
	color: #e77737;
}



/*--------------------------------------------------------------------
料金
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .price-block{
	background: #ece9e9;
	margin:0 auto;
	padding: 70px 0 50px 0;
}
#fscc-plan .fscc-plan .price-block h3{
	width:192px;
	margin:0 auto;
}
#fscc-plan .fscc-plan .price-block .price{
	width: 940px;
	margin: 50px auto 15px auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#fscc-plan .fscc-plan .price-block .price .box{
	width:305px;
	background: #fff;
	border-radius: 7px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 30px;
}
#fscc-plan .fscc-plan .price-block .price .box .plan{
	width:305px;
	background: #1f4e79;
	border-radius: 7px;
	font-size: 22px;
	color:#fff;
	text-align: center;
	line-height: 1.7;
	height: 170px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
#fscc-plan .fscc-plan .price-block .price .box .plan span{
	font-size: 16px;
	display: inline-block;
}
#fscc-plan .fscc-plan .price-block .price .box .txt{
	position: relative;
	height: 190px;
	padding: 30px;
	box-sizing: border-box;
}
#fscc-plan .fscc-plan .price-block .price .box .txt::after{
	content: url("../images/border-dot.png");
	position: absolute;
	bottom: 0;
}
#fscc-plan .fscc-plan .price-block .price .box .txt p{
	font-size: 18px;
}
#fscc-plan .fscc-plan .price-block .price .box .price-ttl{
	width: 90px;
	margin: 30px auto 50px auto;
	font-size: 17px;
	text-align: center;
	border: 1px solid #888888;
	padding: 5px 0 5px 15px;
	letter-spacing: 1em;
	box-sizing: border-box;
}
#fscc-plan .fscc-plan .price-block .price .box .price-ttl-a{
	width: 90px;
	margin: 30px auto 35px auto;
	font-size: 17px;
	text-align: center;
	border: 1px solid #888888;
	padding: 5px 0 5px 15px;
	letter-spacing: 1em;
	box-sizing: border-box;
}
#fscc-plan .fscc-plan .price-block .price .box .yen{
	font-size: 28px;
	text-align: center;
	line-height: 1;
}
#fscc-plan .fscc-plan .price-block .price .box .yen span{
	font-size: 63px;
	font-weight: 700;
	color: #d14848;
	text-align: center;
}
#fscc-plan .fscc-plan .price-block .price .box .yen-hosyu{
	font-size: 21px;
	text-align: center;
	line-height: 1;
}
#fscc-plan .fscc-plan .price-block .price .box .yen-hosyu span.font-shoki{
	font-size: 59px;
	font-weight: 700;
	color: #d14848;
	text-align: center;
}
#fscc-plan .fscc-plan .price-block .price .box .yen-hosyu span{
	font-size: 44px;
	font-weight: 700;
	color: #d14848;
	text-align: center;
}
#fscc-plan .fscc-plan .price-block .price .box .yen-hosyu .font-s {
	font-size: 13px;
	color:#000000;
}

/*標準の移行内容*/
#fscc-plan .fscc-plan .price-block .details{
	width: 940px;
	margin: 10px auto;
	background: #fff;
	border-radius: 7px;
}
#fscc-plan .fscc-plan .price-block .details h5{
	width: 880px;
	margin: 0 auto;
	font-size: 30px;
	text-align: center;
	position: relative;
	padding: 50px 0;
	line-height: 1.8;
}
#fscc-plan .fscc-plan .price-block .details h5 span.att-details-heading{
	display: block;
	font-size: 17px;
}
#fscc-plan .fscc-plan .price-block .details h5::after{
	content: url("../images/border-dot-l.png");
	position: absolute;
	bottom: 0;
	left: 0;
}
#fscc-plan .fscc-plan .price-block .details .box{
	width: 850px;
	margin: 35px auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner{
	width:425px;
	background: #fff;
	border-radius: 7px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding-bottom: 40px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .ikou{
	margin-bottom: 30px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .ikou h6{
	font-size: 21px;
	font-weight: 700;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;	
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .ikou h6::before{
	content: "";
	width: 8px;
	height: 15px;
	display: inline-block;
	background-color: #4b7495;
	margin-right: 5px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .ikou h6 span{
	font-size: 13px;
	font-weight: 500;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .ikou h6.txt-recommend{
	margin-bottom: 5px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .ikou .txt-taishou{
	font-size: 13px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .ikou ul{
	font-size: 17px;	
}
/*有料追加オプション*/
#fscc-plan .fscc-plan .price-block .details .box .box-inner .option{
	width: 100%;
	background: #dee8f0;
	border-radius: 10px;
	margin-top: 30px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .option h6{
	background: #4d759b;
	color:#fff;
	font-size: 17px;
	font-weight: 700;
	text-align: center;
	padding: 5px;
	margin-top: 15px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .option ul{
	font-size: 15px;
	margin: 10px 20px;
}
#fscc-plan .fscc-plan .price-block .details .box .box-inner .option ul li::before{
	content: "";
	width: 10px;
	height: 10px;
	display: inline-block;
	background-color: #4b7495;
	border-radius: 50%;
	margin-right: 3px;
}




/*--------------------------------------------------------------------
サービスフロー
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .flow-block{
	width: 940px;
	margin:75px auto;
}
#fscc-plan .fscc-plan .flow-block h3{
	width:320px;
	margin:0 auto;
}
#fscc-plan .fscc-plan .flow-block .flow{
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 45px;
}
#fscc-plan .fscc-plan .flow-block .flow .box{
	width: 940px;
	border: 1px solid #000;
	box-shadow: inset 0 5px 10px 0 rgba(0, 0, 0, .2);
	border-radius: 7px;
	padding: 30px 20px;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: center;
	margin-bottom: 15px;
	position: relative;
}
#fscc-plan .fscc-plan .flow-block .flow .box::after{
	content: '';
	display: inline-block;
	width: 65px;
	height: 80px;
	background-image: url("../images/flow-icon-arrow.png");
	background-repeat: no-repeat;
	background-size: contain;
	position: absolute;
	bottom: -65px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 100;
}
#fscc-plan .fscc-plan .flow-block .flow .box:last-child::after {
	content: none;
}
#fscc-plan .fscc-plan .flow-block .flow .box .step1{
	background: url("../images/flow-icon01.png") no-repeat;
}
#fscc-plan .fscc-plan .flow-block .flow .box .step2{
	background: url("../images/flow-icon02.png") no-repeat;
}
#fscc-plan .fscc-plan .flow-block .flow .box .step3{
	background: url("../images/flow-icon03.png") no-repeat;
}
#fscc-plan .fscc-plan .flow-block .flow .box .step4{
	background: url("../images/flow-icon04.png") no-repeat;
}
#fscc-plan .fscc-plan .flow-block .flow .box .step5{
	background: url("../images/flow-icon05.png") no-repeat;
}
#fscc-plan .fscc-plan .flow-block .flow .box .step6{
	background: url("../images/flow-icon06.png") no-repeat;
}
#fscc-plan .fscc-plan .flow-block .flow .box .step7{
	background: url("../images/flow-icon07.png") no-repeat;
}
#fscc-plan .fscc-plan .flow-block .flow .box .img{
	width:88px;
	background-size:contain;
	background-position: center;
	display: flex;
	justify-content: center;
}
#fscc-plan .fscc-plan .flow-block .flow .box .img p{
	font-size: 33px;
	font-weight: 700;
	color: #f07d32;
	display: flex;
	align-items: center;
}
#fscc-plan .fscc-plan .flow-block .flow .box .img span{
	font-size: 45px;
	font-weight: 700;
	color: #f07d32;
}
#fscc-plan .fscc-plan .flow-block .flow .box .txt{
	width:715px;
}
#fscc-plan .fscc-plan .flow-block .flow .box .txt h4{
	font-size: 23px;
	font-weight: 700;
	color: #f07d32;
}
#fscc-plan .fscc-plan .flow-block .flow .box .txt p{
	font-size: 17px;
}



/*--------------------------------------------------------------------
よくあるご質問
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .faq-block{
	background: #ece9e9;
	margin:0 auto;
	padding: 70px 0 50px 0;
}
#fscc-plan .fscc-plan .faq-block h3{
	width:310px;
	margin:0 auto;
}
#fscc-plan .fscc-plan .faq-block .faq{
	width: 940px;
	margin: 60px auto 15px auto;
}
#fscc-plan .fscc-plan .faq-block .faq .box{
	width:860px;
	margin: 50px 0 0 auto;
	position: relative;	
}
#fscc-plan .fscc-plan .faq-block .faq .box::after{
	content: '';
	display: inline-block;
	background: url("../images/border-dot-l.png") no-repeat;
	width:860px;
	height: 5px;
	background-size:cover;
}
#fscc-plan .fscc-plan .faq-block .faq .box h4{
	font-size:25px;
	font-weight: 700;
	color: #1f4e79;
	margin-bottom: 20px;
}
#fscc-plan .fscc-plan .faq-block .faq .box h4::before{
	content: url("../images/faq-icon.png");
	transform: scale(0.65);
	position: absolute;
	top: -40px;
	left: -105px;
}
#fscc-plan .fscc-plan .faq-block .faq .box p{
	font-size:17px;
	padding-bottom: 30px;
}



/*--------------------------------------------------------------------
サービス注意事項
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .service-block{
	width: 940px;
	margin:0 auto;
	padding: 70px 0 50px 0;
}
#fscc-plan .fscc-plan .service-block h4{
	width: 190px;
	font-size: 17px;
	text-align: center;
	padding: 10px 0;
	border: 1px solid #000;
}
#fscc-plan .fscc-plan .service-block .service{
	width: 940px;
	margin: 30px auto 15px auto;
}
#fscc-plan .fscc-plan .service-block .service .box{
	margin-bottom: 30px;
}
#fscc-plan .fscc-plan .service-block .service .box h6{
	font-size:16px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
	margin-bottom: 5px;
}
#fscc-plan .fscc-plan .service-block .service .box h6::before{
content: "";
	width: 4px;
	height: 9px;
	display: inline-block;
	background-color: #000000;
	margin-right: 5px;
}
#fscc-plan .fscc-plan .service-block .service .box ul{
	font-size: 13px;
}



/*--------------------------------------------------------------------
お電話でのお問い合わせ・お申込みはこちら
---------------------------------------------------------------------*/
#fscc-plan .fscc-plan .tel-block{
	padding: 40px 0 40px;
	background: #f07d32;
}
#fscc-plan .fscc-plan .tel-block h3{
	display: flex;
	justify-content: center;
	margin: 0 auto 2px;
	
	line-height: 1;
	font-size: 43px;
	font-weight: 700;
	color:#fff;
}
#fscc-plan .fscc-plan .tel-block .tel-num-hours{
	position: relative;
	
	width: 900px;
	height: 148px;
	margin: 0 auto;
	padding: 0 0 0 150px;
	
	line-height: 1;
	background: url("../images/tel-icon.png") no-repeat 15px 0;
	box-sizing: border-box;
}
#fscc-plan .fscc-plan .tel-block .tel-num-hours .txt-tel{
	padding: 10px 0 0;
	font-size: 99px;
	font-weight: bold;
	letter-spacing: 0.05em;
}
#fscc-plan .fscc-plan .tel-block .tel-num-hours .txt-tel a{
	color: #f5ea70;
}
#fscc-plan .fscc-plan .tel-block .tel-num-hours .txt-hours{
	padding: 0 0 0 3px;
	letter-spacing: 0.05em;
	font-size: 33px;
	font-weight: bold;
	color: #fff;
}


@media (min-width: 768px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}


/*--------------------------------------------------------------------
お問い合わせフォーム
---------------------------------------------------------------------*/
#fscc-plan .contact-form{
	width: 940px;
	margin: 0 auto;
}
#fscc-plan .contact-form h3{
	display: flex;
	justify-content: center;
	padding: 67px 0 35px;
}

/********** フォーム **********/
#fscc-plan .contact-form table{
	width: 100%;
	margin: 0 0 45px;
}
#fscc-plan .contact-form tr {
	border-bottom: dotted 2px #3c658a;
}
#fscc-plan .contact-form th {
	padding: 35px 0;
	text-align: left;
	vertical-align: top;
	font-size: 19px;
	font-weight: normal;
}
#fscc-plan .contact-form th:nth-of-type(1) {
	width: 255px;
}
#fscc-plan .contact-form th:nth-of-type(2) {
	width: 110px;
}
#fscc-plan .contact-form th .any {
	width: 65px;
	padding: 5px 0;
	border-radius: 3px;
	text-align: center;
	font-size: 17px;
	color: #fff;
	background: #a9bfd3;
}
#fscc-plan .contact-form th .need {
	width: 65px;
	padding: 5px 0;
	border-radius: 3px;
	text-align: center;
	font-size: 17px;
	color: #fff;
	background: #f07d32;
}
#fscc-plan .contact-form th:nth-of-type(3) {
	width: calc(100% - 255px - 110px);
}
#fscc-plan .contact-form td {
	padding: 35px 0;
	vertical-align: top;
	font-size: 19px;
}
#fscc-plan .contact-form td input {
	display: block;
	width: 100%;
	padding: 5px;
	border-radius: 3px;
	border: solid 2px #a9bfd3;
	font-size: 19px;
	box-sizing: border-box;
}
#fscc-plan .contact-form td input.input-item {
	display: inline-block;
	width: 175px;
	margin: 0 5px 0 0;
}
#fscc-plan .contact-form td textarea {
	display: block;
	width: 100%;
	padding: 5px;
	border-radius: 3px;
	border: solid 2px #a9bfd3;
	font-size: 19px;
	box-sizing: border-box;
}
#fscc-plan .contact-form .input-url-1,
#fscc-plan .contact-form .input-url-2,
#fscc-plan .contact-form .input-url-3{
	margin: 0 0 15px;
}
#fscc-plan .contact-form .btn-submit{
	display: flex;
	justify-content: center;
}