@charset "UTF-8";
.top_img {
	position: relative;
}
.top_img img{
	width: 100%;
}

.swiper {
	position   : relative;
	width: 100%;
	height: 700px;
}
@media screen and (max-width:599px) {
.swiper {
	height: 400px;
}
}
#main {
  position   : relative;
	height: 700px;
  width      : 100%;
  background : #DEDEDE;
/*  overflow   : hidden;
  margin     : auto;
*/
}
.swiper-slide img {
	width: 100%;
	object-fit: cover;
}
@media screen and (max-width:599px) {
.swiper-slide img {
	height: 400px;
}
}
#main img {
	position   : absolute;
	width: 100%;
	object-fit: cover;
}
 
 /*=== 画像の設定 ======================================= */
.main img {
	position   : absolute; /* 画像のサイズを表示エリアに合せる */
	width: 100%;
	height: 700px;
/*	object-fit: cover;
	opacity    : 0;
	animation  : slideAnime 21s ease-in-out infinite;
*/
}
.main_message {
	position: absolute;
/*    font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
*/
	font-family:"HG行書体","HGP行書体",cursive;
	font-family: ten-mincho-text, "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif, "游ゴシック体", "游ゴシック", sans-serif;
	text-align: center;
	color: #FFFFFF;
	width: 60vw;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	font-size: 3.6rem;
	background: rgba(90,90,90,0.2);
	z-index: 10;
}
@media screen and (max-width:599px) {
.main_message {
	width: 90vw;
	}
}
.main_message img {
	width: 50vw;
	padding-top: 10px;
}
@media screen and (max-width:599px) {
.main_message img {
	width: 85vw;
	padding-top: 10px;
}
}
.story_wrap  {
	margin-bottom: 100px;
	height: auto;
}

.about_wrap  {
	margin-bottom: 100px;
	height: auto;
}
.story_content,
.about_content,
.product_content,
.company_content,
.contact_content {
	position: relative;
}

.story_text,
.about_text,
.product_text,
.company_text,
.contact_text {
	position: relative;
	padding-left: 6vw;
	font-size: 2rem;
	z-index: 10;
}

.story_text h2,
.about_text h2,
.product_text h2,
.company_text h2,
.contact_text h2 {
	position: relative;
	width: auto;
	padding-top: 40px;
	font-size: 4rem;
}

.story_text h2, .about_text h2, .product_text h2, .contact_text h2 {
	margin-top: 0;
	padding-top: 0;
}

.story_text h2::after,
.about_text h2::after,
.product_text h2::after,
.company_text h2::after,
.contact_text h2::after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 150px;
	height: 4px;
	content: '';
	border-radius: 3px;
	background-image: -webkit-linear-gradient(20deg, yellow, orange, green, red);
	background-image: linear-gradient(70deg, yellow, orange, green, red);
}
@media screen and (max-width:599px) {
.story_text h2::after,
.about_text h2::after,
.product_text h2::after,
.company_text h2::after,
.contact_text h2::after {
	width: 90px;
}
}
p.about_text_list {
	font-size: 1.5rem;
}

.story_text_container,
.about_text_container,
.product_text_container,
.contact_text_container {
	border: 1px solid rgba(255,255,255,0.50);
	width: 60vw;
	background-color: rgba(255,255,255,0.80);
	padding: 0 10px;
	font-size: 2.5rem;
}
.h3_midashi01{
	position: relative;
	padding: 1rem 2rem;
/*	padding: 1rem 2rem calc(1rem + 10px);*/
	background: #017200;
}
/*
.h3_midashi01:before {
	position: absolute;
	top: -7px;
	left: -7px;
	width: 100%;
	height: 100%;
	content: '';
	border: #C11B1B solid;
}
*/
.product_announce_container {
	border: 1px solid rgba(255,255,255,0.10);
	width: 60vw;
	background-color: rgba(46,46,46,0.60);
	padding: 0 10px;
	margin-bottom: 10px;
}
@media screen and (max-width:599px) {
.story_text_container,
.about_text_container,
.product_text_container,
.contact_text_container {
	width: 87vw;
	padding: 0 5px;
}
.product_announce_container {
	width: 87vw;
	padding: 0 5px;
}
}
p.sub_title01 {
	font-size: 1.5rem;
	margin-bottom: -1rem;
	padding-top: 30px;
}
@media screen and (max-width:599px) {
p.sub_title01 {
	margin-bottom: -8px;
}
}
.sub_title02 {
	font-size: 1.8rem;
	margin-top: -2.3rem;
	padding-top: 0px;
}

.read_more_container {
	margin-top: 40px;
}
a.read_more01 {
	display: inline-block;
	width: 180px;
	height:50px;
	text-align: center;
	background-color: #9ec34b;
	font-size: 16px;
	line-height: 52px;
	color: #FFF;
	border-radius: 25px;
	text-decoration: none;
	font-weight: bold;
	border: 2px solid #9ec34b;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
@media screen and (max-width:599px) {
a.read_more01 {
	width: 100px;
	height:30px;
	font-size: 1.6rem;
	line-height: 27px;
	border-radius: 25px;
	border: 2px solid #9ec34b;
}
}

a.read_more01::after {
	width: 100%;
	height: 0;
	content:"";
	position: absolute;
	top: 50%;
	left: 50%;
	background : #FFF;
	opacity: 0;
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transition: .2s;
	z-index: -1;
}
a.read_more01:hover{
  color: #9ec34b;
}
a.read_more01:hover::after{
  height: 240%;
  opacity: 1;
}
a.read_more01:active::after{
  height: 340%;
  opacity: 1;
}

/**/
.contact_link {
	margin-top: 20px;
}
a.contact01 {
	display: inline-block;
	width: 280px;
	height:50px;
	text-align: center;
	background-color: #001063;
	font-size: 2.1rem;
	line-height: 52px;
	color: #FFF;
	border-radius: 5px;
	text-decoration: none;
	font-weight: bold;
	border: 2px solid #1D24AF;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
@media screen and (max-width:599px) {
a.contact01 {
	width: 180px;
	height:30px;
	font-size: 2.2rem;
	line-height: 27px;
	border-radius: 5px;
	border: 2px solid #1D24AF;
}
}

a.contact01::after {
	width: 100%;
	height: 0;
	content:"";
	position: absolute;
	top: 50%;
	left: 50%;
	background : #FFF;
	opacity: 0;
	transform: translateX(-50%) translateY(-50%) rotate(20deg);
	transition: .2s;
	z-index: -1;
}
a.contact01:hover{
  color: #001063;
}
a.contact01:hover::after{
  height: 240%;
  opacity: 1;
}
a.contact01:active::after{
  height: 340%;
  opacity: 1;
}
/**/

.story_photo,
.about_photo,
.product_photo,
.contact_photo {
	position: absolute;
	text-align: right;
	right: 0;
	top: 0;
}
.product_photo{
	padding-top: 150px;
}
.story_photo img,
.about_photo img,
.product_photo img,
.contact_photo img {
	width: 60vw;
	height: 500px;
	object-fit: cover;
}

@media screen and (max-width:599px) {
.product_photo img,.contact_photo img {
	height: 400px;
}
}
.space_content {
	text-align: left;
	margin-top: 20px;
}
.space_content img {
	width: 100%;
	height: 200px;
	object-fit: cover;	
}

.product_wrap {
	margin-bottom: 100px;
	height: auto;
}
.power_title01:after,
.power_title02:after,
.power_title03:after {
	position: relative;
	display: block;
	font-size: 0.5em;
	top: -0.6rem;
	left: 5rem;
}
.power_title01:after {
	content: 'エンデュランス系';
}
.power_title02:after {
	content: 'インターミッテント系';
}
.power_title03:after {
	content: 'パワー系';
}

.company_wrap {
	margin-bottom: 100px;
	height: auto;
}

.company_container_wrap {
	width: 50vw;
	margin-top: 70px;
}
@media screen and (max-width:599px) {
.company_text {
	padding: 0 4vw;
}

.company_container_wrap {
	width: 100%;
	margin-top: 40px;
}
}
.company_container {
	display: flex;
	/*border-bottom: 1px solid #B6B6B6;*/
	padding-top: 20px;
}
@media screen and (max-width:599px) {
.company_container {
	padding-top: 10px;
}
}
.company_title {
	width: 30%;
}
.company_name {
	width: 70%;
}
@media screen and (max-width:599px) {
.company_title {
	width: 18%;
}
.company_name {
	width: 82%;
}
}

.contact_wrap {
	margin-bottom: 100px;
	height: auto;
}

.fix_btn {
	position:fixed;
	display: inline-block;
	padding: 0.01em 0.1em;
	text-align:center;
	width: 300px;
	height:40px;
	bottom: 10px;
	left: 10px;
	z-index: 99999;
	box-shadow: 0 4px 0 #AA0000;
	background-color: #CF0000;
	border-radius: 0px;
/*
	border-radius: 60px;
*/
	cursor: pointer;
}
a.fix_btn {
	font-size: 3rem;
	color: #FFFFFF;	
}
.fix_btn:hover {
	box-shadow: none;
	transform: translateY(4px);
}
@media screen and (min-width:960px) and (max-width:1279px) {
.fix_btn {
	width: 270px;
	height:35px;
}
}
@media screen and (min-width:600px) and (max-width:959px) {
.fix_btn {
	width: 240px;
	height:35px;
}
}
@media screen and (max-width:599px) {
.fix_btn {
	width: 180px;
	height:30px;
}
}

.img_soup {
	width: 100%;
	margin: 0 auto;
}

.img_soup img {
	display: block;
	width: 20vw;
	margin: 0 auto;
}

.img_crunch {
	width: 100%;
	margin: 0 auto;	
}
.img_crunch img {
	display: block;
	width: 10vw;
	margin: 0 auto;
}
.img_clense {
	width: 100%;
	margin: 0 auto;		
}
.img_clense img {
	display: block;
	width: 40vw;
	margin: 0 auto;
}
@media screen and (min-width:960px) and (max-width:1279px) {
.img_soup img {
	width: 20vw;
}
.img_crunch img {
	width: 10vw;
}
.img_clense img {
	width: 40vw;
}
}
@media screen and (min-width:600px) and (max-width:959px) {
.img_soup img {
	width: 25vw;
}
.img_crunch img {
	width: 12vw;
}
.img_clense img {
	width: 50vw;
}
}
@media screen and (max-width:599px) {
.img_soup img {
	width: 50vw;
}
.img_crunch img {
	width: 20vw;
}
.img_clense img {
	width: 80vw;
}
}