@charset "UTF-8";

/*文字の設定*/
.strong {
  background:linear-gradient(transparent 60%, #fff878 60%) !important;
}

.underlinewhite{
  background:linear-gradient(transparent 60%, #ffffff 60%) !important;
}

h1, h2, h3, h4, h5{
	font-family: 'Jost', sans-serif;
}

h1, h2, h3, h4, h5{
	font-weight:500;
}

p, ul li, ol li, a, dt, dd{
	font-family: 'Noto Sans JP', sans-serif;
}

h1{
	letter-spacing:3px;
	line-height:1.8;
	font-size:40px;
	color:#000;
}

p{
	font-size:13px;
	color:#333333;
}

.moji-bg{
	background-color:#b8d200;
}

.bold{
	font-weight:bold;
	font-size:14px;
}

.top-caption p:first-of-type{
	margin-bottom:20px;
}

.big-wrapper{
	width:100%;
}

.mid-wrapper, .first-wrapper{
	width:900px;
	margin:auto;
	padding:70px 0;
}

.second-wrapper{
	width:900px;
	margin:auto;
	padding:70px 0 40px;
}


/*文字が横から出る*/
.slide-moji{
	overflow: hidden;
}

.slide-in-moji {
  overflow: hidden;
  position: relative;
  width: 100%;
  -webkit-transform: translate3d(-100.5%,0,0);
  transform: translate3d(-100.5%,0,0);
  -webkit-transform-origin: left;
  transform-origin: left;
  -webkit-transition-duration: 1s;
  transition-duration: 1s;
  -webkit-transition-timing-function: cubic-bezier(.075,.82,.165,1);
  transition-timing-function: cubic-bezier(.075,.82,.165,1);
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
.slide-moji.isShow .slide-in-moji {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.slide-in-moji h1:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transform-origin: right;
  transform-origin: right;
  -webkit-transition-duration: 1s;
  transition-duration: 1s;
  -webkit-transition-timing-function: cubic-bezier(.075,.82,.165,1);
  transition-timing-function: cubic-bezier(.075,.82,.165,1);
  -webkit-transition-delay: .4s;
  transition-delay: .4s;
}
.slide-moji.isShow .slide-in-moji:before {
  -webkit-transform: scale(0,1);
  transform: scale(0,1);
}
.slide-in-moji h1 {
  width: 100%;
  transition-duration: 4s;
  -webkit-transition-timing-function: cubic-bezier(.075,.82,.165,1);
  transition-timing-function: cubic-bezier(.075,.82,.165,1);
}



.about-flex, .styling-flex, .item-flex{
	display:flex;
	height: auto;
}

.about-flex{
	align-items: center;
	justify-content: space-around;
	margin-top:30px;
	padding-top:30px;
}

.n-logo{
	width:22%;
}

.about-caption{
	width:65%;
}

.styling-box{
	margin:40px 0;
	padding:30px 0;
}

.styling-box:first-of-type{
	margin:20px 0;
	padding:20px 0;
}

.styling-flex{
	margin-top:30px;
	align-items: flex-start;
	justify-content: space-around;
}

.style-img{
	width:60%;
}

.staff-data{
	width:31%;
}

.item-list{
	width:100%!important;
	margin-top:10px;
}

.item-list li a:after{
	font-size:14px;
	margin-left:4px;
}

.comment-box{
	margin-top:20px;
}

.st-comment {
    position: relative;
    padding:20px 30px;
	margin:30px auto;
}

.st-comment:before, .st-comment:after{ 
    content:'';
    width: 50px;
    height: 50px;
    position: absolute;
    display: inline-block;
}

.st-comment:before{
    top:0;
    left: 0;
    border-left: solid 3px #ccc;
    border-top: solid 3px #ccc;
}

.st-comment:after{
    bottom:0;
    right: 0;
    border-right: solid 3px #ccc;
    border-bottom: solid 3px #ccc;
}

.st-comment p {
    margin: 0; 
    padding: 0;
}

.infor-wrapper{
	margin-top:30px;
	padding:40px 0;
}

.end-caption{
	margin-bottom:30px;
	padding-bottom:40px;
}

.item-information{
	margin-top:40px;
	padding:40px 0 0;
}

.item-flex{
	align-items: center;
	justify-content: space-around;
	margin-top:30px;
	padding-top:30px;
}

.item-img{
	width:48%;
}

.item-credit{
	width:48%;
}

.item-credit p{
	font-size:12px;
	text-align:left!important;
}

.pt-buy{
	margin-top:10px;
}

.pt-buy a{
	font-size:14px;
	font-weight:bold;
	text-decoration: underline;
	color:#000;
}

.pt-buy a:hover{
	color:#ff6600;
}

.jiko_soto{
	background-color:#e6e6e6;
}

.name h5{
	color:#6b8e23;
}

.sp-staff-data{
	display:none;
}

/*タブレット用*/
@media screen and (max-width: 768px){

	.mid-wrapper{
		width:600px;
	}
	
	.first-wrapper, .second-wrapper{
		width:650px;
	}

}

/*スマホ用*/
@media screen and (max-width:640px){

	.first-wrapper, .second-wrapper{
		width:350px;
		padding:0;
	}
	
	.mid-wrapper, .top-caption{
		width:300px!important;
	}
	
	.nd-setsumei, .st-sp-box{
		width:320px;
	}
	
	.nd-setsumei{
		margin:auto;
		padding-bottom:30px;
	}
	
	h1{
		font-size:38px;
	}
	
	.st-sp-box{
		margin:30px auto 0;
		padding-top:40px;
	}
	
	.styling-box{
		margin-top:10px;
	}
	
	.styling-flex:first-of-type{
		margin-top:0!important;
	}
	
	.staff-data{
		display:none;
	}
	
	.about-flex, .styling-flex, .item-flex, .sp-staff-data{
		display:block;
	}
	
	.sp-staff-data{
		padding:15px 0 10px;
	}
	
	.sp-staff-data p{
		font-size:11px;
		text-align: left;
	}
	
	.bold{
		font-size:12px!important;
	}
	
	.n-logo{
		width:40%;
		margin:0 auto 30px;
	}

	.style-img, .item-img, .item-credit{
		width:100%;
	}
	
	.about-caption{
		width:300px;
		margin:0 auto;
	}
	
	.item-credit{
		margin-top:20px;
	}
	
	.item-credit p{
		font-size:11px;
	}
	
	.pt-buy{
		text-align: center;
	}


}

/* CSS Document */