﻿body{
	font-family:"Source Sans Pro", "FP-こぶりなゴシック StdN W1";
	font-weight: normal;
}

h1,h2,h3,h4,h5,h6,strong,b,dt{
	font-family:"Source Sans Pro", "FP-こぶりなゴシック StdN W3";
	font-weight: normal;
}

p.sentence{
	line-height: 2;
}

.sns-box li i{
	font-size: 220%;
}

.sns-box li i.fa-instagram{
	font-size: 234%;
}

.nav.is-open .mainNav .navItem{
	position: relative;
	padding-left: 20px;
}

.nav.is-open .mainNav .navItem:before{
	content: "●";
	position: absolute;
	left:0;
	top: 0;
	font-size: 10px;
}
.nav.is-open .mainNav .navItem > a{
	font-family:"Source Sans Pro", "FP-こぶりなゴシック StdN W3";
}

.nav.is-open .mainNav .navItem .treeview{
	margin-left: -20px;
}

.nav.is-open .mainNav .navItem.boxLinkWrap , .nav.is-open .mainNav .navItem.noListStyle{
	position: inherit;
	padding-left: 0;
}

.nav.is-open .mainNav .navItem.boxLinkWrap:before , .nav.is-open .mainNav .navItem.noListStyle:before{
	content:none;
	position: inherit;
}


.nav.is-open .mainNav .navItem.boxLinkWrap > a div.boxLink {
	border: 3px double #333;
	padding:5px 10px;
	display: inline-block;
	line-height: 1;
	border-radius: 2px;
}

.nav.is-open .mainNav .navItem.boxLinkWrap > a div.boxLink-bk {
	border: 1px solid #333;
	padding:0;
	display: inline-block;
	line-height: 1;
	border-radius: 2px;
	background: #333;
}

.nav.is-open .mainNav .navItem.boxLinkWrap > a div.boxLink-bk .boxLink-bk-inner{
	border: 1px solid #fff;
	padding:5px 10px;
	display: inline-block;
	line-height: 1;
	color: #fff;
}

.nav.is-open .mainNav .navItem.boxLinkWrap > a div.boxLink-bk:hover {
	border: 1px solid #777;
	background: #777;
}

nav li span.iconNew{
	border-radius: 2px;
	margin-left: 10px;
	margin-top: -3px;
}

.nav li span {
    display: inline-block;
    margin-top:0;
	padding-left: 10px;
	font-size: 60%;
}


.nav.is-open .mainNav .navItem.noListStyle{
	margin-top: 40px;
}

.footer .pagetop a{
	border: 1px solid #333;
	border-radius: 2px;
	color: #333;
	line-height: 1;
	padding: 0 10px 6px;
}
.footer .pagetop a:hover{
	background: none;
	opacity: .6;
	color: #333;
}

.headingDescription{
	max-width: 650px;
	text-align: justify;
	margin-left: auto;
	margin-right: auto;
}

#manufacturing p{
	max-width: 650px;
	text-align: justify;
	margin-left: auto;
	margin-right: auto;
}

.btn.btnBorder2{
	border-radius: 2px;
}

@media screen and (min-width: 768px){

	footer .sns-box li i.fa-instagram{
		font-size: 310%;
	}
}
.footer .note{
	max-width: 650px;
	text-align: justify;
	margin-left: auto;
	margin-right: auto;
}



input,textarea {
  -webkit-appearance: none;
}

input.btn{
	color: #000;
}

.footer{
	padding-bottom: 20px;
}

.footer #policy{
	margin-top: 100px;
}

.footer #policy h3{
	font-size: 16px;
	margin-bottom: 10px;
}

@media screen and (min-width: 768px){
	.footer #policy h3{
	font-size: 16px;
	margin-bottom: 20px;
}
	.section.worksDetail .detailWrap .data dl dd p{
	display: inline-block;
    vertical-align: top;
		margin-bottom: 0;
}

}

.nav.is-open .mainNav .navItem{
	transform:none!important;
}


.flow-inner{
	text-align: center;
	margin-top: 40px;
}

.flow-inner .flow-step-wrap{
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: flex-start;
	gap:10px;
	padding-bottom: 20px;
	margin-top: 10px;
}

.flow-inner .flow-step-wrap:not(:last-of-type){
	position: relative;
}

.flow-inner .flow-step-wrap:not(:last-of-type):after{
	content: '↓';
	position: absolute;
	bottom: 0;
	width: 100%;
	text-align: center;
	font-size: 20px;
}


.flow-inner .flow-step-wrap .flow-step-img{
	width: 30%;
}

.flow-inner .flow-step-wrap .flow-step-img img{
	width: 100%;
	height: auto;
}

.flow-inner .flow-step-wrap .flow-step-text{
	width: 70%;
	text-align: left;
}

.flow-inner .flow-step-wrap p{
	text-align: left;
}

.flow-inner .flow-step-wrap span.step{
	display: inline-block;
	border: 1px solid #333;
	border-radius: 50px;
	padding: 2px 10px;
	margin-bottom: 10px;
}

.flow-inner .flow-step-wrap h3{
	font-size: 16px;
}

.flow-inner .flow-step-wrap h3 span.textS{
	font-size: 80%;
}


#flow {
	text-align: right;
}
#flow .btn {
	border: 1px solid #333;
	padding:0;
	display: inline-block;
	line-height: 1;
	border-radius: 2px;
	background: #333;
}

#flow .btn a{
	border: 1px solid #fff;
	padding:5px 10px;
	display: inline-block;
	line-height: 1;
	color: #fff;
}

#flow .btn:hover {
	border: 1px solid #777;
	background: #777;
}




.faq-wrap{
	margin-bottom: 20px;
	padding-bottom:0;
	border-bottom: 1px solid #333;
}

.faq-wrap h3{
	font-size: 13px;
	line-height: 1.5;
}

.faq-wrap h3 span{
	font-size: 16px;
	padding-right: .5rem;
} 

.faq-wrap p{
	padding-left: 10px;
}

.faq-wrap p span{
	font-size: 15px;
	padding-right: .5rem;
}



@media screen and (min-width: 768px){
	.flow-inner .flow-step-wrap{
		width: 600px;
		margin-left: auto;
		margin-right: auto;
		gap:20px;
		padding-bottom:0;
		margin-top: 20px;
	}
	
	.flow-inner .flow-step-wrap:not(:last-of-type):after{
		font-size: 30px;
		font-weight: 200;
	}

	.flow-inner .flow-step-wrap .flow-step-img{
		width: 35%;
	}
	.flow-inner .flow-step-wrap .flow-step-text{
		width: 60%;
	}
	
	.flow-inner .flow-step-wrap h3{
		font-size: 22px;
		margin-bottom: 10px;
	}
	.flow-inner .flow-step-wrap span.step{
		margin-bottom: 20px;
	}
	#flow .btn {
		margin-right: 100px;
	}
	
	.faq-wrap{
		width: 640px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.faq-wrap h3{
	font-size: 18px;
	}

	.faq-wrap h3 span{
		font-size: 25px;
	} 
	.faq-wrap p{
		padding-left: 40px;
	}
	
	.faq-wrap{
	margin-bottom: 30px;
		padding-bottom: 10px;
	}

}

