@charset "utf-8";


/*----------------------------------
	Main
----------------------------------*/
#main{
	margin-top:50px;
}
#main .images{
	width:53%;
	align-content: flex-start;
}
#main .image{
	background-position:center;
	background-size:cover;
}
#main .images .image01{
	width:100%;
	height:400px;
	margin-bottom:2px;
	background-image:url(../img/img_main_01_pc.jpg);
}
#main .images .image02{
	width:calc(40% - 2px);
	height:260px;
	margin-right:2px;
	background-image:url(../img/img_main_02_pc.jpg);
}
#main .images .image03{
	width:60%;
	height:260px;
	background-image:url(../img/img_main_03_pc.jpg);
}
#main .overview{
	background:var(--color_bg);
	width:50%;
	margin-left:-3%;
	margin-top:10rem;
	position:relative;
	z-index: -1;
	padding-left:calc(3% + 5%);
	padding-top:10rem;
	padding-bottom:10rem;
}
#main .overview .wrap{
	width:90%;
}
#main .overview h2{
	color:var(--color_an);
	font-size:4rem;
	align-items: center;
}
#main .overview h2:before{
	content:"";
	display: inline-block;
	background:url(/common/img/logo_fumonan.svg) no-repeat;
	width:60px;
	height:44px;
	margin-right:2rem;
}
#main .overview .roboto{
	color:var(--color_an);
	align-items: center;
	letter-spacing: 0.5rem;
	margin-top:2rem;
}
#main .overview .roboto:before{
	content:"";
	display: inline-block;
	background:var(--color_an);
	width:7rem;
	height:1px;
	margin-right:2rem;
}
#main .overview h4{
	margin-top:3rem;
	font-size:1.8rem;
	font-weight: normal;
	letter-spacing: 0.2rem;
}
#main .overview .text{
	margin-top:3rem;
	line-height:2.5;
}

@media screen and (min-width:1024px) {
    /*PC*/
}
@media screen and (max-width:1023px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
    /*SP*/
	#main{
		margin-top:0;
	}
	#main .images {
		width: 100%;
	}
	#main .images .image01{
		width: 100%;
		height: 0;
		padding-bottom: 53.5%;
	}
	#main .images .image02{
		width:calc(40% - 2px);
		height:0;
		margin-right:2px;
		padding-bottom: 33.8%;
	}
	#main .images .image03{
		width:60%;
		height:0;
		padding-bottom: 33.8%;

	}
	#main .overview {
		width: 100%;
		margin-left: 0%;
		margin-top: 0rem;
		padding-left: 0;
		padding-top: 5rem;
		padding-bottom: 5rem;
	}
	#main .overview .wrap {
		width: 90%;
		margin:0 auto;
	}
	#main .overview h2 {
		font-size: 2.4rem;
	}
	#main .overview h2:before {
		position: absolute;
		right: 0;
	}
}


/*----------------------------------
	Products
----------------------------------*/
#products{
	margin-top:15rem;
}
#products .title{
	color:var(--color_an);
}
#products .overview{
	background:var(--color_bg);
	width:60%;
	padding:8rem 0;
}
#products .kyo_france,
#products .klv{
	margin-top: 10rem;
}
#products .kyo_japone,
#products .kyo_tane{
	margin-top: 15rem;
}
#products .kyo_france > .flex,
#products .klv > .flex,
#products .kyo_japone > .flex,
#products .kyo_tane > .flex{
	align-items: center;
}
#products .kyo_japone .overview{
	order:2;
	margin-left:-10%;
}
#products .wrap{
	text-align: left;
}
#products .kyo_france .wrap,
#products .klv .wrap,
#products .kyo_tane .wrap{
    width: 450px;
    left: calc(83.333% - 500px);
    position: relative;
}
#products .kyo_japone .wrap{
    width: 450px;
	left: calc(16.666% + 50px);
    position: relative;
}
#products .kyo_france img.logo,
#products .klv img.logo{
	width:485px;
}
#products .kyo_japone img.logo{
	width:391px;
}
#products .kyo_tane img.logo{
	width:300px;
	display: inherit;
	margin: 0 auto;
}
#products h3{
	font-size:2.4rem;
	letter-spacing: 0.2rem;
	text-indent: 0.2rem;
	margin-top:4rem;
	line-height: 1.52;
}
#products .text{
	margin-top:3rem;
	color:var(--color_text);
	line-height: 2;
}
#products .more{
	color:var(--color_an);
	float:right;
	margin-top: 2rem;
}
#products .kyo_france .product_image{
	width:50%;
	height:520px;
	margin-left:-10%;
	background-image:url(../img/img_kyo-france.jpg);
	background-size:cover;
	background-position: center;
	
	
}
#products .klv .product_image{
	width:50%;
	height:520px;
	margin-left:-10%;
	background-image:url(../img/img_klv.jpg);
	background-size:cover;
	background-position: center;

}
#products .kyo_japone .product_image{
	width:50%;
	height:400px;
	background-image:url(../img/img_kyo-japone.jpg);
	background-size:cover;
	background-position: center;
	z-index: 1;
	order:1;
}
#products .kyo_tane .product_image{
	width:50%;
	height:430px;
	margin-left:-10%;
	background-image:url(../img/img_kyo-tane.jpg);
	background-size:cover;
	background-position: center;
}
#products .lineup{
	color:var(--color_text);
	margin-top:10rem;
}
#products .lineup .package{
	width:50%;
	text-align: right;
	padding-right:5rem;
}
#products .kyo_france .lineup img{
	width:346px;
	
}
#products .klv .lineup img{
	width:346px;	
	
	
}
#products .kyo_japone .lineup img{
	width:370px;
}
#products .kyo_tane .lineup img {
    width: 155px;
}
#products .lineup dl{
	text-align: left;
}
#products .lineup dt{
	color:var(--color_an);
	font-size:2.4rem;
	font-weight: bold;
	margin-bottom:2rem;
}
#products .lineup dd{
	font-size:1.6rem;
	margin-top:1rem;
}
#products .lineup dd span{
	font-size:1.2rem;
}
#products .btn_shopping{
    margin: 8rem auto 0;
}

@media screen and (min-width:1024px) {
    /*PC*/
}
@media screen and (max-width:1023px) {
    /*SP-Tablet*/
	#products .overview {
		padding: 8rem 0 8rem 5%;
	}
	#products .kyo_france .wrap,
	#products .klv .wrap,
	#products .kyo_tane .wrap {
		width: 75%;
		left: 0;
	}
	#products .kyo_france img.logo ,
	#products .klv img.logo {
		width:100%;
	}
	#products .kyo_tane img.logo {
		width:80%;
	}
	#products .kyo_france .lineup img,
	#products .klv .lineup img{
		width: 80%;
	}
	#products .kyo_tane .lineup img {
		width: 40%;
	}
	#products .kyo_japone .wrap {
		width: 90%;
		left: 0%;
	}
	#products .kyo_japone img.logo {
		width: 100%;
	}
	#products .kyo_japone .overview {
		order: 2;
		margin-left: -10%;
		padding-left: 15%;
		width: 60%;
	}
	#products .kyo_japone .lineup img {
		width: 80%;
	}
	#products .kyo_tane .product_image{
		height: 300px;
	}
}
@media screen and (max-width:479px) {
    /*SP*/
	#products .kyo_france,
	#products .klv{
		margin-top: 5rem;
	}
	#products .kyo_japone{
		margin-top: 15rem;
	}
	#products .overview {
		width: 100%;
		padding: 5rem 0;
		padding-top: 15rem;
		margin-top: -10rem;
	}
	#products .kyo_france .overview,
	#products .klv .overview,
	#products .kyo_tane .overview {
		order:2;
	}
	#products .kyo_japone .overview {
		margin-left: 0;
		padding-left: 0%;
		width:100%;
	}
	#products .kyo_france .wrap,
	#products .klv .wrap,
	#products .kyo_japone .wrap,
	#products .kyo_tane .wrap{
		width: 90%;
		left: 0;
		margin-left: 5%;
	}
	#products .kyo_france img.logo,
	#products .klv img.logo{
		width:100%;
		margin-left: 5%;
	}
	#products .kyo_japone img.logo,
	#products .kyo_tane img.logo{
		width: 80%;
		margin-left: 10%;
	}
	#products .kyo_france .product_image,
	#products .klv .product_image,
	#products .kyo_tane .product_image{
		width: 95%;
		height: 100%;
		padding-bottom: 60%;
		margin-left: 5%;
		order: 1;
		z-index: 1;
	}
	#products .kyo_japone .product_image{
		width: 95%;
		height: 100%;
		padding-bottom: 60%;
		margin-right: 5%;
		order:1;
	}
	#products .lineup {
		margin-top: 5rem;
	}
	#products .lineup .package {
		width:80%;
		margin-left: auto;
		margin-right: auto;
		padding: 0;
		text-align: center;
	}
	#products .kyo_france .lineup img,
	#products .klv .lineup img,
	#products .kyo_japone .lineup img{
		width:100%;
	}
	#products .lineup .price {
		margin: 3rem auto 0;
	}
	#products .btn_shopping {
		margin: 5rem auto 0;
	}
}

/*----------------------------------
	Access
----------------------------------*/
#access .title{
	color:var(--color_chaya);
	margin-bottom: 0;
}

@media screen and (min-width:1024px) {
    /*PC*/
}
@media screen and (max-width:1023px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
    /*SP*/
}


/*----------------------------------
	Sample
----------------------------------*/

@media screen and (min-width:1024px) {
    /*PC*/
}
@media screen and (max-width:1023px) {
    /*SP-Tablet*/
}
@media screen and (max-width:479px) {
    /*SP*/
}