/* CSS Document */


/*- menu -*

変更領域, fv

* filetop *
------------------------------------------------------------------------------------------------------------------------------------------*/

/*- File name [ style.css ] -*/

/*------------------------------------------------------------------------------------------------------------------------------------------

* 変更領域

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/

.m-plus-rounded-1c{
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-style: normal;
}

.m-plus-1c{
	font-family: "M PLUS 1p", sans-serif;
  	font-style: normal;
}

/*- body -*/
body, body *{
	font-family: "Noto Sans JP", sans-serif;
  	font-optical-sizing: auto;
  	font-style: normal;
    color: #000000;
}

/*- footer -*/
footer .inner{
    background: #b31e31;
}

footer .inner p{
	color: #FFFFFF;
}

/*- main -*/
main{
	background: url("../img/bg.jpg") repeat center;
}

/*- title -*/
h3.title span{
	border-color: #000000;
	font-weight: 700;
}

/*- Box -*/
.Box{
	padding: 0 clamp(12px, 3.125vw, 24px);
}

.Box > *{
}

/*- obi -*/
.obi::after,
.obi::before{
	width: clamp(35px, 10.15625vw, 130px);
}

.obi::before{
	background-image: url("../../22271217_testsample_cp/img/index/pattern.png");
}

.obi::after{
	background-image: url("../../22271217_testsample_cp/img/index/pattern.png");
}

/* line_marker */
.line_marker{
	background: linear-gradient(transparent 60%, #FFF765 60%);
}

/*- top -*/
#top{
}

/*- btm -*/
#btm{
}

/*- method -*/
#method img{
}

/* insta */
#insta .inner #insta_f_link{
	background-image: linear-gradient(to right, #f6416c, #b210ff);
}

* + #insta{
	margin-top: clamp(48px, 6.25vw, 80px);
}

/*- rule -*/
#rule{
}

#rule *{
	font-family: "メイリオ", sans-serif;
	color: #000000;
}

#rule > *{
	max-width: 1040px;
}

#rule > * article{
	box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.25);
	background-color: #FFFFFF;
	border-radius: 40px;
	padding: clamp(72px, 6.25vw, 80px) clamp(20px, 3.125vw, 40px); 
}

#rule .itemLists > dt{
	border-color: #000000;
}

#rule .itemLists > dd{
	padding: 32px clamp(16px, 2.1875vw, 28px);
}

#rule .itemLists > *:last-child{
	padding-bottom: 0;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	/*- rule -*/
	
	/*- method -*/
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* fv

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
.fv{
	background: url("../img/index/fv/sp_bg.png") no-repeat center top;
	background-size: 100% auto;
	margin-bottom: clamp(50px, 7.8125vw, 100px);
}

.fv .fv_box{
	background: none;
}

.fv #about{
	padding-inline: clamp(10px, 2.666vw, 20px);
}

.fv #about .inner{
	margin-inline: auto;
	max-width: 960px;
}

.fv #about .inner article *{
	background-size: 100% auto !important;
}

.fv #about .inner article h3{
	background: url("../img/index/about/bg_top_sp.png") no-repeat center top;
}

.fv #about .inner article h3 img{
	margin-inline: auto;
}

.fv #about .inner article p{
	background: url("../img/index/about/bg_center_sp.png") repeat-y center;
	text-align: center;
	font-size: clamp(1.4rem, 1.25vw, 1.6rem);
	padding-inline: clamp(30px, 7.4666vw, 56px);
}

.fv #about .inner article p strong{
	font-weight: bold;
}

.fv #about .inner article::after{
	content: "";
	display: block;
	background: url("../img/index/about/bg_btm_sp.png") no-repeat center bottom;
	background-size: 100% auto;
	aspect-ratio: 1 / 0.107;
	width: 100%;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	.fv{
		background-image: url("../img/index/fv/pc_bg.png");
		background-size: auto;
	}
	
	.fv #about .inner article h3{
		background-image: url("../img/index/about/bg_top_pc.png");
	}

	.fv #about .inner article p{
		background-image: url("../img/index/about/bg_center_pc.png");
	}

	.fv #about .inner article::after{
		background-image: url("../img/index/about/bg_btm_pc.png");
		aspect-ratio: 1 / 0.073;
	}
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* products

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
#products{
	padding-inline: clamp(10px, 2.666vw, 20px);
	margin-bottom: clamp(48px, 4.375vw, 56px);
}

#products .inner img{
	margin-inline: auto;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

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




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* Add Sample Code

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

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




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}