@charset "utf-8";

/* about header */

/*  about-visual-container  */
.about-visual-container{
	overflow: hidden;
	position: relative;
	min-height:990px;
	padding-bottom:130px;
	background: #bbd9b3 ;
}
.about-visual-container > div{
	width:100%;
	max-width: 980px;
}
.about-visual-container > div div{
	position: relative;
}
.about-visual-container h1{
	margin-bottom:40px;
	font-size: 2.9rem;
	font-weight:600;
}
.about-visual-container .txt-message{
	position: relative;
	top:200px;
	left: 0;
	z-index:2;
	width: auto;
}
.about-visual-container  p{
	line-height:32px;
	font-size:1.6rem;
}
.about-visual-container figure{
	position:absolute;
	left:calc( 50% - 285px);
	top: -2px;
	z-index:1;
}

/*  about-concept-container  */
.about-concept-container{
	background-color: #f2f2f2;
}
.about-concept-container > div{
	padding: 115px 0 120px;
}
.about-concept-container h2{
	text-align: center;
	font-size:2.4rem;
}
.about-concept-container > div div{
}
.about-concept-container .txt-summary img{
	width: 536px;
}
.about-concept-container .box-for-pict{
	position: relative;
	width: 672px;
	margin: 85px auto 0;
	padding: 0 0 0 72px;
}
.about-concept-container .box-for-pict:before{
	position: absolute;
	top:0;
	left: 35px;
	width: 1px;
	height: 100%;
	background-color: #997b67;
	content: "";
}
.about-concept-container .box-for-pict:after{
	position: absolute;
	top:0;
	left:0;
	width: 50px;
	height: 200px;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: 21px auto ;
	content: "";
}
.about-concept-container .box-for-pict.item-name:after{
	background-image: url(../img/txt-about-name.svg) ;
}
.about-concept-container .box-for-pict.item-logo:after{
	background-image: url(../img/txt-about-logo.svg) ;
}
.about-concept-container .box-for-pict.item-color:after{
	background-image: url(../img/txt-about-color.svg) ;
}



.about-concept-container .box-for-pict figure{
	padding: 0 0 15px;
	text-align: center;
}
.about-concept-container .box-for-pict.item-name figure img{
	width: 580px;
}
.about-concept-container .box-for-pict.item-logo figure img{
	width: 628px;
}
.about-concept-container .box-for-pict .box-sub{
	margin-top: 15px;
	text-align: center;
}
.about-concept-container .box-for-pict .box-sub img{
	width: 600px;
}


/*  about-tgcom-txt-container  */
.about-tgcom-txt-container{
	padding: 80px 0;
	background-color: #957b67;
	color: #fff;
	text-align: center;
}
.about-tgcom-txt-container h3{
	font-size:2.4rem;
	margin-bottom:40px;
}
.about-tgcom-txt-container  p{
	margin-bottom:40px;
	line-height:2.2;
	font-size:1.6rem;
}
.about-tgcom-txt-container  a{
	
	display:flex;
	justify-content: center;
	align-items:center;
	height:34px;
	width:384px;
	margin: 0 auto;
	border:solid 1px #fff;
	border-radius: 17px;
	color: #fff;
	font-size:1.3rem;
	font-weight: 600;
}
.about-tgcom-txt-container a::after{
	width:8px;
	height:8px;
	margin-left:8px;
	border-right:solid 1px #fff;
	border-top:solid 1px #fff;
	transform:rotate(45deg);
	content:"";
}
.about-tgcom-txt-container  a:hover{
	opacity:0.7;
	cursor:pointer;
	text-decoration:none;
}

/* .about-contents-container */
.about-contents-container{
	display: block;
	padding-top:98px;
	padding-bottom:140px;
}
.about-contents-container > div{
	max-width:960px;
	margin: 0 auto;
}
.about-contents-container > div > div{
	position:relative;
	display:flex;

}
.about-contents-container h2{
	margin-bottom:30px;
	padding-top:70px;
	text-align:center;
	font-size: 1.8rem;
}
.about-contents-container .box-recipe h2{
	background: url('/img/txt-g-recipe.svg') no-repeat center 0 scroll;	
    background-size:242px auto;
}
.about-contents-container .box-column h2{
	background: url('/img/txt-g-column.svg') no-repeat center 0 scroll;	
    background-size:257px auto;
}
.about-contents-container p{
	margin-bottom:25px;
	line-height:2.0;
	font-size: 1.6rem;
}
.about-contents-container > div > div div{
	width:calc(100% - 505px);
}
.about-contents-container figure{
	width:450px;
}
.box-recipe{
	margin-bottom:110px;
}
.box-recipe figure{
	margin-right:65px;
}
.about-contents-container img{
	width:100%;
}
.box-column{
	height:325px;
}
.box-column figure{
	position:absolute;
	right:0;
	top:0;
}
.about-contents-container a{
	
	display:flex;
	justify-content: center;
	align-items:center;
	height:34px;
	width:384px;
	margin: 0 auto;
	border:solid 1px #957b67;
	border-radius: 17px;
	font-size:1.3rem;
	font-weight:600;
}
.about-contents-container  a:hover{
	opacity: 0.7;
	text-decoration: none;
}
.about-contents-container a::after{
	width:8px;
	height:8px;
	margin-left:8px;
	border-right:solid 1px #957b67;
	border-top:solid 1px #957b67;
	transform:rotate(45deg);
	content:"";
}


/* .box-about-theme */
.box-about-theme{
	height:660px;
	padding-top:250px;
	background: #bbd9b3 url('/img/bg-about-theme.svg') no-repeat center  0 scroll;
	background-size:100% auto;
}
.box-about-theme > div{
	position:relative;
	max-width:960px;
	margin: 0 auto;
}
.box-about-theme h2{
	margin-bottom:50px;
	padding-top:75px;
	background:  url('/img/txt-theme.svg') no-repeat 0 0 scroll;
	background-size:237px;
	color:#fff;
	font-size:1.8rem;
}
.box-about-theme p{
	color:#fff;
	font-size:1.6rem;
}
.box-about-theme figure{
	position:absolute;
	top: -110px;
	left:480px;

	width:491px;
}
.box-about-theme figure img{
	width:100%;
}