/* CSS Document */


/*- page style -*/

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

* all

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

/* screen width 768px未満
---------------------------------------------------------------------*/
header h1 {
	padding: 7px 10px !important;
    display: flex;
    justify-content: center;
}

header h1 img {
	height: 9vw !important;
    max-height: 60px;
	width: auto !important;
}

footer {
	background: #006934;
}





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

@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) {
	header h1 {
		padding: 10px 0px !important;
	}	
}

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

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







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

* mainimage

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

/* screen width 768px未満
---------------------------------------------------------------------*/
#mainimage {
	background: url("../img/fv_bg_sp.png") no-repeat center center / cover;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5px 5px 15px 14px;
}

#mainimage img {
	/*position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);*/
	margin: 0 auto;
	max-width: 1040px;
}




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

@media (orientation: landscape) {
}




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

@media print,screen and (min-width: 768px) {
	
	#mainimage{
		background: url("../img/fv_bg_pc.png") no-repeat center center / cover;
		height: 630px;
	}
	
	#mainimage img{
		/*margin: 0 auto;*/
		max-width: 1040px;
	}
	
}




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

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




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

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







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

* message

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

/* screen width 768px未満
---------------------------------------------------------------------*/
.contentsinfo{
    background: url("../img/bg.png") repeat center center / 250px;
}
#message{
	padding: 1.5rem 1rem;
}

#message *{
	color: #431c03;
}

#message h4{
	margin-top: 2rem;
}

#message p{
	text-align: center;
	font-weight: 500;
	margin-top: 1rem;
}

#message p strong{
	display: block;
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.6;
	margin-bottom: 5px;
}

#message .package{
	margin-top: 2rem;
}



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

@media (orientation: landscape) {
}




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

@media print,screen and (min-width: 768px) {
	.contentsinfo{
    background-size: 500px;
}
	#message {
		
	}

	#message p > br{
		display: none;
	}
    
    #message img{
		max-width: 960px;
        margin-left: auto;
        margin-right: auto;
	}
	
    #message img[src*="title"]{
        max-width: 700px;
    }
    
	#message p strong .sp{
		display: none;
	}
	
}


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

@media print,screen and (min-width: 1024px) {
	
	#message{
		padding: 35px 1rem 30px;
	}
	
	#message h3{
		margin: 0 auto;
		max-width: 900px;
	}

    #message h4,
    #message .package{
        margin-top: 40px;
    }
    
	#message p{
		margin-top: 1em;
	}

	#message p strong{
		font-size: 20px;
	}
	
}




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

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


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

* btn_store

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


#btn_store{
	overflow: hidden;
	border-radius: 10px;
	margin-right: 1rem;
	margin-left: 1rem;
    max-width: 1040px;
    padding-bottom: 20px;
}

#btn_store ul li + li{
    margin-top: 10px;
}

#btn_store ul a{
    display: block;
    border: 1px solid #b3b3b3;
    background: #fff;
    border-radius: 100px;
    text-align: center;
    padding: 0.5rem 1rem;
    font-weight: bold;
}

@media print,screen and (min-width: 768px) {
    #btn_store{
        padding-bottom: 50px;
        padding-top: 20px;
    }
    
    #btn_store ul{
    display: flex;
    justify-content: space-between;
}

#btn_store ul li{
    width: calc(100% / 3 - 15px);
    margin-top: 0 !important;
}
}

@media print,screen and (min-width: 1040px) {
    #btn_store{
        margin-right: auto;
        margin-left: auto;
    }
    
    #btn_store ul a{
        padding: 1rem;
        font-size: 20px;
        transition: 0.7s;
    }
    
    #btn_store li.btn_fuji a:hover{
        background: #00A73C;
        color: #fff;
    }
    
    #btn_store li.btn_mv a:hover{
        background: #C60057;
        color: #fff;
    }
    
    #btn_store li.btn_marunaka a:hover{
        background: #E50019;
        color: #fff;
    }
}


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

* select

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

/* screen width 768px未満
---------------------------------------------------------------------*/
#select{
	background: url("../img/bg.png") repeat center center / 250px;
	padding-bottom: 22px;
}

#select .inner{
	overflow: hidden;
	border-radius: 10px;
	margin-right: 1rem;
	margin-left: 1rem;
}

#select .btn{
	position: relative;
	background: #006934;
	text-align: center;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
	color: #FFFFFF;
	padding: 10px 0;
}

#select .btn + div{
	background: #FFFFFF;
	padding: 1.5rem 1.3rem;
}

#select .tabLables{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#select .tabLables > li{
	width: calc(50% - 10px);
}

#select .tabLables > li:nth-of-type(2) ~ li{
	margin-top: 15px;
}

#select .tabLabel span{
	display: block;
	position: relative;
	border: 1px solid #b3b3b3;
	border-radius: 99px;
	text-align: center;
	line-height: 1;
	padding: 1rem;
	cursor: pointer;
	transition: 0.5s;
}

#select .tabLabel span::after{
	content: "";
	display: block;
	border-right: 2px solid #006934;
	border-top: 2px solid #006934;
	transform: translateY(-50%) rotate(45deg);
	position: absolute;
	height: 5px;
	width: 5px;
	right: 15px;
	top: 50%;
}

#select .tabLabel span:hover,
#select .tabLabel.active span{
	border-color: #6FBA2C;
	background: #6FBA2C;
	color: #FFFFFF;
}

#select .tabLabel span:hover::after,
#select .tabLabel.active span::after{
	border-right: 2px solid #FFFFFF;
	border-top: 2px solid #FFFFFF;
}




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

@media (orientation: landscape) {
}




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

@media print,screen and (min-width: 768px) {
	
	#select {
		background-size: 500px;
		padding-bottom: 66px;
	}

	#select .inner{
		border-radius: 20px;
	}

	#select .btn{
		font-size: 24px;
		padding: 15px 0;
	}

	#select .btn::after{
		right: 18px;
	}

	#select .btn + div{
		padding: 1.5rem 1.3rem;
	}

	#select .tabLables{
		justify-content: flex-start;
	}

	#select .tabLables > li{
		margin-right: 15px;
		width: calc((100% - (15px * 2)) / 3);
	}

	#select .tabLables > li:nth-of-type(2) ~ li{
		margin-top: 0;
	}
	
	#select .tabLables > li:nth-of-type(3n){
		margin-right: 0;
	}
	
	#select .tabLables > li:nth-of-type(3) ~ li{
		margin-top: 10px;
	}

	#select .tabLabel span::after{
		right: 20px;
	}
	
}




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

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

	#select .btn + div{
		padding: 40px;
	}

	#select .tabLables > li{
		margin-right: 30px;
		width: calc((100% - (30px * 2)) / 3);
	}
	
	#select .tabLables > li:nth-of-type(3) ~ li{
		margin-top: 25px;
	}
	
	#select .tabLabel span{
		font-size: 20px;
		padding: 20px;
	}

	#select .tabLabel span::after{
		height: 14px;
		width: 14px;
	}
	
}




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

@media print,screen and (min-width: 1280px){
	
	#select .inner{
		margin-right: auto;
		margin-left: auto;
		max-width: 1040px;
	}
	
}







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

* tabContents

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

/* screen width 768px未満
---------------------------------------------------------------------*/
.tabContents{
	padding: 0 1rem;
	margin-top: 1.5rem;
}

.tabContents .tabContent{
	display: none;
}

.tabContents .tabContent h3{
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	font-weight: 700;
	color: #006934;
}

.tabContents .tabContent h3::after{
	content: "";
	display: block;
	background: url(../img/icon.png) no-repeat center;
	background-size: contain;
	min-width: calc(49px * 0.8);
	height: 49px;
}

.tabContents .tabContent ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 1.8rem;
}

.tabContents .tabContent ul > li{
	width: calc(50% - 0.5rem);
}

.tabContents .tabContent ul > li:nth-of-type(2) ~ li{
	margin-top: 1.2rem;
}

.tabContents .image img{
	margin: 0 auto;
	height: 15rem;
	width: auto;
}

.tabContents .text{
	text-align: center;
	margin-top: 0.8rem;
}

.tabContents .text span{
	display: inline-block;
	border-radius: 99px;
	background: #6FBA2C;
	font-size: 0.8rem;
	font-weight: 500;
	line-height: 1.2;
	color: #FFFFFF;
	padding: 5px 15px;
}

.tabContents .text p{
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.2;
	margin-top: 1rem;
}

.tabContents .tabContent.active{
	display: block;
}




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

@media (orientation: landscape) {
}




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

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

	.tabContents .tabContent ul{
		justify-content: flex-start;
	}

	.tabContents .tabContent ul > li{
		width: calc((100% - (15px * 2)) / 3);
		margin-right: 15px;
	}
	
	.tabContents .tabContent ul > li:nth-of-type(3n){
		margin-right: 0;
	}

	.tabContents .tabContent ul > li:nth-of-type(3){
		margin-top: 0 !important;
	}
	
}




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

@media print,screen and (min-width: 1024px) {
	
	.tabContents {
		margin-top: 50px;
	}
	
	.tabContents .tabContent{
		margin: 0 auto;
		max-width: 1040px;
	}
	
	.tabContents .tabContent h3{
		font-size: 30px;
	}

	.tabContents .tabContent h3::after{
		min-width: 30px;
		height: 52px;
	}

	.tabContents .tabContent ul{
		margin-top: 50px;
	}
	
	.tabContents .tabContent ul > li{
		width: calc((100% - (15px * 3)) / 4);
	}

	.tabContents .tabContent ul > li:nth-of-type(2) ~ li{
		margin-top: 30px;
	}
	
	.tabContents .tabContent ul > li:nth-of-type(3n){
		margin-right: 15px;
	}
	
	.tabContents .tabContent ul > li:nth-of-type(4n){
		margin-right: 0;
	}

	.tabContents .tabContent ul > li:nth-of-type(4){
		margin-top: 0 !important;
	}

	.tabContents .image img{
		height: 220px;
	}

	.tabContents .text{
		margin-top: 25px;
	}

	.tabContents .text span{
		font-size: 1rem;
	}

	.tabContents .text p{
		font-size: 16px;
	}
	
}




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

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







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

* btmContents

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

/* screen width 768px未満
---------------------------------------------------------------------*/
#btmContents {
	background: #6FBA2C;
}

#btmContents ul{
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    max-width: 1040px;
    margin-left: auto;
    margin-right: auto;
}

#btmContents li{
    display: block;
    width: 70%;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
    
}


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

@media (orientation: landscape) {
}




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

@media print,screen and (min-width: 768px) {
    #btmContents ul{
        display: flex;
        justify-content: center;
    }
    
    #btmContents li{
        margin: 0;
    }
    
    #btmContents li + li{
        margin-left: 30px;
    }
}




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

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




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

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