@charset "UTF-8";
/** -----------------------------------------------
  共通
------------------------------------------------**/
body {
	/*下記のCSSはご自身のデザインに合わせて書き換えてください。*/
	width: 100%;
	font-size: 20px;
	line-height: 1.6;
	color: #4d4d4d;
	background-color:#fff;
	font-family: "Noto Sans JP", "游ゴシック", "YuGothic", "游ゴシック体", "Osaka", "Verdana", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: 500;
}

/** -----------------------------------------------
  PC :  画面の横幅が641px以上
------------------------------------------------**/


img {
  max-width: 100%;
}

section{
	padding: 130px 0px;
}

h2.section-title{
	font-weight: 38px;
	text-align: center;
	padding-bottom: 80px;
}

.section-description{
	text-align: center;
	padding-bottom: 80px;
}

.gnav-pc-wrap{
	/* display: block; */
	width: 52%;
}


.gnav-sp, .gnav-sp-wrap{
	display: none;
}


#menu-button{
	display: none;
}


/** -----------------------------------
    ボタン
-------------------------------------**/

.button-entry-small{
	margin: 30px 54px 30px 0px;
	display: flex;
	align-items: center;
	width: 210px;
	line-height: 114px;
}

.button-entry-small a{
	background: #e1715b;
	border-radius: 9999px;
	position: relative;
	margin: 0 auto;
	max-width: 210px;
	padding: 0px 60px 0px 45px;
	color: #ffffff;
	line-height: 59px;
	text-decoration: none;
	transition: 0.3s ease-in-out;
	font-size: 18px;
	border:#e1715b 2px solid;
	text-align: center;

}


.button-entry-small a:hover{
	background: #ffffff;
	color: #e1715b;
}

.button-entry-small a::after{
	content: '';
	width: 15px;
	height: 15px;
	background-image: url(../images/entory_small_square.png);
	background-size: contain;
	position: absolute;
	top: 50%;
	bottom: 50%;
	right: 20%;
	margin: auto;
}

.button-entry-small a:hover::after{
	background-image: url(../images/entory_small_square_hover.png);
}

.button-more{
	margin: 30px 0px;
	display: flex;
	/* align-items: center; */
	position: relative;
	/* transition: transform 0.3s ease; */
}

.button-more a{
	/* background: #f58986; */
	/* border-radius: 9999px; */

	/* display: flex; */
	/* justify-content: space-around; */
	align-items: center;
	margin: 0 auto;
	max-width: 210px;
	/* padding: 0px 75px 0px 45px; */
	color: #a8ccf9;
	line-height: 3;
	text-decoration: none;
	/* transition: 0.3s ease-in-out; */
	font-size: 20px;
	/* border:#f58986 2px solid; */

}

.button-more img{
	position: absolute;
	text-align: center;
	width: 96px;
	top: 76%;
	left: 50%;
	transform: rotate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
	object-fit: cover;
	transition: transform 0.7s linear;


}


/* .button-more a:hover{
	transform: translateX(3px);

} */


.button-more img:hover{
  /* transform: scale(0.9); */
  cursor: pointer;
  /* transform: translateX(-10px); これを削除して*/
  transform: translate(calc(-50% + 10px), -50%); /* こっちを追加しました */
}



/* .button-more a::after{
	content: '';
	width: 15px;
	height: 15px;
	background-image: url(../images/more_square.png);
	background-size: contain;
	position: absolute;
	top: 50%;
	bottom: 50%;
	right: 20%;
	margin: auto;
} */

.button-more a:hover::after{
	background-image: url(../images/more_small_hover.png);

}



.button-entry-large{
	/* margin: 30px 54px 30px 0px; */
	display: flex;
	align-items: center;
}

.button-entry-large a{
	background: #e1715b;
	border-radius: 9999px;
	position: relative;
	/* display: flex; 
	justify-content: space-around;
	align-items: center; */
	margin: 0 auto;
	/* max-width: 210px; */
	width: 100%;
	padding: 0px 80px 0px 45px;
	color: #ffffff;
	line-height: 3;
	text-decoration: none;
	transition: 0.3s ease-in-out;
	font-size: 25px;
	text-align: center;
	border:#e1715b 2px solid;

}

.button-entry-large a:hover{
	background: #ffffff;
	color: #e1715b;
}

.button-entry-large a::after{
	content: '';
	width: 15px;
	height: 15px;
	background-image: url(../images/entory_large_square.png);
	background-size: contain;
	position: absolute;
	top: 50%;
	bottom: 50%;
	right: 18%;
	margin: auto;
}

.button-entry-large a:hover::after{
	background-image: url(../images/entory_large_square_hover.png);
}


/** -----------------------------------
    ヘッダー
-------------------------------------**/
.header{
	background-color: #f4f1ef;
	width: 100%;
	height: 114px;
	display: flex;
	justify-content: space-between;
	/* padding-right: 45px; */
	position: fixed;
	top: 0;
	z-index: 1;
}

.header-logo {
	text-align: center;
	width: 276px;
	line-height: 20px;
	padding: 30px 0px 30px 0px;
	margin-left: 54px;
}


nav {
	/* width: 1011px; */
	text-align: center;
	/* padding: 50px 0px 50px 0; */
}

nav ul{
	display: flex;
	justify-content: space-between;
	gap: 1.9rem;


}

.gnav-pc-wrap ul li a{
	text-decoration: none;
	color:inherit;
	line-height: 114px;
}

nav ul li a:hover{
	color: #909090;
}


ul.gnav-pc li {
	display: inline;
	font-size: 1rem;

}


/** -----------------------------------
    メインビジュアル
-------------------------------------**/
.mainvisual{
	background-image: url(../images/main-visual.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	height: 100vh;
	margin-top: 114px;
	position: relative;
	width: 100%;
	margin-top: 114px;
	background-position: center top;

}


.mainvisual-title{
	/* background-color: #fffcf1;
	text-align: center;
	color: #7ab5ff; */
	position: absolute;
	width: 723px;
	right: 0;
	bottom: 150px;
	/* height: 159px; */
}

/* .mainvisual-title h1{
	line-height: 140px;
} */

	/* .mainvisual-text{
	font-size: 60px;
	} */


/** -----------------------------------
    私たちについて
-------------------------------------**/

#about{
	/* background-image: url(../images/about-back.png); */
	/* height: calc(100vh - 114px); */
	/* background-repeat: no-repeat;
	background-size: cover;
	background-position: center; */
	background-color: #f4f1ef;

}

.col-2-about{
	display: flex;
	justify-content: center;
	padding: 0 129px;
	gap: 70px;

}

#about .col-2-about .item-about {
	margin: auto 0;
}

/* .col-2-about .item-about{
	width: calc((100% - 70px)/2);
} */

.item-about{
	display: flex;
	justify-content: flex-end;

}

.item-about img{
	max-width: 100%;
	/* width: 565px;
	height: 565px; */
}

.about-text{
	width: 565px;
}


/** -----------------------------------
    NEWS
-------------------------------------**/
#news{
	background-color: #fffcf1;
	text-align: center;
	padding: 113px 0 62px 0;
	
}

.news-sectioninner{
	width: 652px;
	margin: 0 auto;

}


hr{
	margin: auto;
	height: 3px;
	background-color: #4d4d4d;
}

#news .section-title{
	padding-bottom: 37px;

}


.news-sp{
	display: flex;
	justify-content: center;
	position: relative;

}

.news-sp a{
	text-decoration: none;
	color:inherit
}

.news-sp a::after{
	content: '';
	width: 15px;
	height: 15px;
	background-image: url(../images/news_square.png);
	background-size: contain;
	position: absolute;
	top: 50%;
	bottom: 50%;
	right: 8%;
	margin: auto;
	align-items: center;
}

.news-contents{
	/* margin: 0 445px; */
	gap: 62px;
	line-height: 63px;
	font-size: 20px;
	width: 652px;
	display: flex;
	padding: 0 49px;

}


/** -----------------------------------
    事業について
-------------------------------------**/
/* .col-3{
	height: 896px;
} */

#business{
	background-image: url(../images/business-background.png);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	text-align: center;
	background-attachment: fixed;
}


.business-item-baby,.business-item-photobook{
	/* height: 260px; */
	margin-bottom: 57px;

}

.business-card{
	display: flex;
	justify-content: center;
}

.business-content-baby{
	background-color: #fffcf1;
	border-radius: 0px 60px 60px 0px;
	text-align: center;
	display: flex;
	flex-direction: column;
	/* align-items: center; */
	justify-content: center;
	gap: 12px;
	padding: 0 30px;
	width: 424px;
	height: 260px;


}

.business-content-baby-sp,.business-content-photobook-sp,.business-content-community-sp{
	display: none;
}

.business-content-photobook{
	background-color: #fffcf1;
	/* width: 429px; */
	/* height: 260px; */
	border-radius: 60px 0px 0px 60px;
	/* height: 260px; */
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 0 30px;
	width: 424px;
	height: 260px;
}

.business-content-community{
	background-color: #fffcf1;
	border-radius: 0px 60px 60px 0px;
	text-align: center;
	display: flex;
	flex-direction: column;
	/* align-items: center; */
	justify-content: center;
	gap: 12px;
	padding: 0 30px;
	width: 430px;
	height: 260px;


}


.business-card-img-baby{
	display: block; 
	 vertical-align: bottom;
}

/* .business-card-img-baby-sp,.business-card-img-photobook-sp,.business-card-img-community-sp{
	display: grid;
	gap: 0;
} */


.business-card-img-baby-sp,.business-card-img-photobook-sp,.business-card-img-community-sp{
	display: none;
}

.business-card-img-baby,.business-card-img-photobook,.business-card-img-community{
	display: block;

}



/** -----------------------------------
    メンバーについて
-------------------------------------**/
#member{
	background-image: url(../images/member-back.png);
	background-repeat: no-repeat;
	background-position: center;
	background-color: #f4f1ef;
	padding-bottom: 130px;
}

/* #member{
	padding-bottom: 0px;
} */

.section-inner{
	padding: auto;
	margin: auto;
	width: 1416px;
	}

.col-4{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	/* padding-left: 120px;
	padding-right: 120px; */
	/* gap: 50px; */
	justify-content: space-between;
	/* width: 95%; */
	margin: auto;

}

.item{
	/* margin-bottom: 57px; */

}

.card-img{
	margin-bottom: -10px;
	/* width: calc(25% - 13.33px); */

}
.card-text{
	/* background-color: #efd6dd;
	width: 268px;
	border-radius: 0px 0px 60px 60px;
	height: 164px;
	width: calc(25% - 13.33px);
	border: 2px solid #a8ccf9; */
	text-align: center;

}

.member-name{
	font-size: 20px;
	margin-bottom: 9px;
	padding-top: 18px;
}

.job-type{
	font-size: 18px;
	line-height: 20px;
	margin-bottom: 36px;
}


/** -----------------------------------
    募集職種について
-------------------------------------**/
#work{
	background-image: url(../images/work-back.png);
	background-repeat: no-repeat;
	/* background-size: cover; */
	background-position: center;
	text-align: center;
	background-color: #fffcf1;
}


/* .upper-row{
	display: flex;
	justify-content: center;
	gap: 50px;
	padding-bottom: 30px;
}

.engineer,.director,.marketer,.customersupport,.UIUXdesiner{
	width: 298px;
}
.lower-row{
	display: flex;
	justify-content: center;
	gap: 50px;
}


.work-name{
	text-align: center;
	font-size: 24px;
} */

.work-container{
	display: flex;
	flex-wrap: wrap;
	/* margin: calc(-30px / 2);
	padding: 50px 190px; */
	/* margin: 0 80px; */
	justify-content: center;
	gap: 50px;
	width: 997px;
	margin: auto;
}

.engineer .director .marketer .customersupport .UIUXdesiner{
	width: calc(100% / 3 - 30px);
	margin: calc(30px / 2);
	height: 138px;

}
.work-name{
	text-align: center;
}

/** -----------------------------------
    働く環境について
-------------------------------------**/
#environment{
	/* background-image: url(../images/environment-back.png);
	background-repeat: no-repeat;
	background-size: cover; */
	background-color: #f4f1ef;
}

.section-inner-environment{
	/* margin: auto; */
}

.col-2-environment{
	display: flex	;
	justify-content: center	;
	gap: 100px;
	width: 80%;
	margin: auto;
}

img,.photo-enviroment{
	width: 120%;
}

.item-environment{
	/* text-align: center; */
	width: 40%;
	justify-content: center;
	position: relative;
	margin: auto 0px;


}

.item-environment-text{
	background-color: #ffffff;
	border: 2px solid #909090;
	padding: 20px;
	margin: 30px 0;
	text-align: center;
}

.section-description-environment{
	padding-bottom: 24px;
	font-size: 20px;
	
}

.section-description-environment,ul,li{
	font-size: 18px;

}


.item-environment,.section-description,ul{
	list-style-type: none;
	/* margin-top: 24px; */
}


/** -----------------------------------
    採用フローについて
-------------------------------------**/
#saiyou{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-color: #fffcf1;
}

.section-inner{
	padding: auto;
	margin: auto;
	width: 1416px;

}

.saiyou-yajirushi-pc{
	display: block;
}

.saiyou-yajirushi-sp{
	display: none;
	padding-bottom: 0px;
}

.saiyou-img-sp{
	display: none;
}


.col-4-saiyou{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	/* padding-left: 120px;
	padding-right: 120px; */
	/* gap: 50px; */
	justify-content: space-between;
	/* width: 95%; */
	margin: auto;

}

.item{
	/* margin-bottom: 57px; */

}

.card-img{
	/* margin-bottom: -10px; */
	/* width: calc(25% - 13.33px); */

}
.card-text{
	/* background-color: #efd6dd;
	width: 268px;
	border-radius: 0px 0px 60px 60px;
	height: 164px;
	width: calc(25% - 13.33px);
	border: 2px solid #a8ccf9; */
	text-align: center;

}

.member-name{
	font-size: 20px;
	margin-bottom: 9px;
	padding-top: 18px;
}

.job-type{
	font-size: 18px;
	line-height: 20px;
	margin-bottom: 36px;
}

p.saiyou{
	margin: 0 auto;
	font-size: 18px;
	margin-top: 17px;
}

.saiyou-img{
	/* width: 30%; */
	padding-bottom: 10px;
}

.saiyou-yajirushi-pc{
	display: block;
}




/** -----------------------------------
    エントリー
-------------------------------------**/

.entry{
	background-image: url(../images/environment-back.png);
	background-repeat: no-repeat;
	background-size: cover;

}

.col-2-entry{
	display: flex;
	justify-content: center;
	gap: 20%;
	/* width: 50%; */
	margin: auto;
}

.message-entry{
	font-size: 30px	;
}

.item-entry{
	justify-content: center;
	display: flex;
	align-items: center;

}

.text-entry{
	justify-content: center;
	display: flex;
	align-items: center;
	display: block;

	text-align: center;
}

.button-entry-large,a{
	font-size: 16px;
	/* text-decoration: none; */
}

.recruit-faq{
	font-size: 18px;
}

.recruit-faq a{
	text-decoration: none;
	color:inherit
}

.recruit-faq a:hover{
	color: #909090;
}


.pc-br{
	display: block;
}

/** -----------------------------------
    フッター
-------------------------------------**/
#footer{
	background-color: #ffff;
	width: 100%;
	height: 114px;
	text-align: center;
	display: block;
}

.footer{
	/* display: flex;
	justify-content: center; */
	gap: 15%;
	padding: 20px 0px 20px 0px;

}

.footer-container{
	display: flex;
	justify-content: space-around;


}

.footer-link{
	display: flex;
	justify-content: center;
	gap: 50px;
	font-size: 16px;
}

.footer-link a{
	text-decoration: none;
	color:inherit
}

.footer-link a:hover{
	color: #909090;
}

.copyright{
	text-align: center;
	font-size: 18px;
}

.footer-logo{
	display: block;
}

.footer-logo-sp{
	display: none;
}

.under-entry{
	display: none;
}




/*ここからメディアクエリで各デバイスサイズに書き分けます。
今回の課題で考慮するのはPCとスマホのみでOKですが、タブレットサイズでのスタイルを書いてもOK！
また、CSSは上から下に継承されるので、変化させたいところだけ書けばOKです*/


/** -----------------------------------------------
  Smartphone :  画面の横幅が640pxまで
------------------------------------------------**/
@media screen and (max-width:640px){
	/* 共通部分 */
	img {
	max-width: 100%;
	}

	section{
		padding: 0px 27px 62px 27px;
		text-align: center;
	}

	h2.section-title{
		font-weight: 38px;
		text-align: center;
		padding-bottom: 35px;
		padding-top: 80px;
	}

	.section-description{
		text-align: center;
		padding-bottom: 38px;
		font-size: 16px;

	}


	.gnav-pc,.gnav-pc-wrap{
		display: none;
	}


	.gnav-sp,.gnav-sp-wrap{
		display: block;
	}

	.gnav-sp-wrap.is-active {
  	display: block;
	}


	/** -----------------------------------
		ボタン
	-------------------------------------**/

	.button-entry-small{
		margin: 30px 54px 30px 0px;
		display: flex;
		align-items: center;
		height: 59px;
		width: 210px;
	}

	.button-entry-small a{
		background: #e1715b;
		border-radius: 9999px;
		position: relative;
		margin: 0 auto;
		max-width: 210px;
		padding: 0px 60px 0px 45px;
		color: #ffffff;
		line-height: 59px;
		text-decoration: none;
		transition: 0.3s ease-in-out;
		font-size: 18px;
		border:#e1715b 2px solid;
		text-align: center;

	}


	.button-entry-small a:hover{
		background: #ffffff;
		color: #e1715b;
	}

	.button-entry-small a::after{
		content: '';
		width: 15px;
		height: 15px;
		background-image: url(../images/entory_small_square.png);
		background-size: contain;
		position: absolute;
		top: 50%;
		bottom: 50%;
		right: 20%;
		margin: auto;
	}

	.button-entry-small a:hover::after{
		background-image: url(../images/entory_small_square_hover.png);
	}

	.button-more{
		padding: 37px 0px;
		margin: 0px;
		display: flex;
		/* align-items: center; */
	}

	.button-more a{
		/* background: #f58986;
		border-radius: 9999px; */
		position: relative;
		/* display: flex; */
		/* justify-content: space-around; */
		/* align-items: center; */
		align-items: center;
		margin: 0 auto;
		max-width: 210px;
		/* padding: 0px 75px 0px 45px; */
		color: #a8ccf9;
		line-height: 3;
		text-decoration: none;
		transition: 0.3s ease-in-out;
		font-size: 18px;
		/* border:#f58986 2px solid; */

	}

	.button-more img{
	position: absolute;
	text-align: center;
	width: 127px;
	top: 70%;
	left: 50%;
	transform: rotate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}


	/* .button-more a:hover{
		background: #ffffff;
		color: #f58986;
		border-style: solid;


	} */

	/* .button-more a::after{
		content: '';
		width: 15px;
		height: 15px;
		background-image: url(../images/more_square.png);
		background-size: contain;
		position: absolute;
		top: 50%;
		bottom: 50%;
		right: 20%;
		margin: auto;
	} */

	.button-more a:hover::after{
		background-image: url(../images/more_small_hover.png);

	}



	.button-entry-large{
		/* margin: 30px 54px 30px 0px; */
		display: flex;
		align-items: center;
	}

	.button-entry-large a{
		background: #e1715b;
		border-radius: 9999px;
		position: relative;
		/* display: flex; */
		/* justify-content: space-around; */
		/* align-items: center; */
		/* margin: 0 auto; */
		/* max-width: 210px; */
		padding: 0px 57px 0px 45px;
		color: #ffffff;
		line-height: 3;
		text-decoration: none;
		transition: 0.3s ease-in-out;
		font-size: 16px;
		text-align: center;
		border:#e1715b 2px solid;
		width: 190px;
		height: 54px;
		margin: 29px auto;
	}

	.button-entry-large a:hover{
		background: #ffffff;
		color: #e1715b;
	}

	.button-entry-large a::after{
		content: '';
		width: 15px;
		height: 15px;
		background-image: url(../images/entory_large_square.png);
		background-size: contain;
		position: absolute;
		top: 50%;
		bottom: 50%;
		right: 18%;
		margin: auto;
	}

	.button-entry-large a:hover::after{
		background-image: url(../images/entory_large_square_hover.png);
	}



	/* ヘッダーここから */
	.header{
		height: 80px;
		padding: 0px;
		position: fixed;
		margin-bottom: 80px;
	}

	.header-logo{
		padding: 14px 0px 30px 0px;
		margin-left: 21px;
	}

	.header-logo-text{
		font-size: 15px;
	}

	.gnav-pc-wrap,.button-entry-small{
		display: none;
	}

	.gnav-sp-wrap{
		position: fixed;
		display: none;
		width: 100vw;
		/* height: 100vh; */
		background-color: #f4f1ef;
		z-index: 100;
		padding-top: 40px;
		padding-bottom: 40px;
	}

	.gnav-sp-wrap ul{
		display: flex;
		flex-direction: column;
		align-items: center;
		list-style: none;
		gap: 20px;
	}

	.gnav-sp-wrap ul li a{
		text-decoration: none;
		color:inherit;
		line-height: 0;
	}


	.gnav-sp-wrap ul li a:hover{
		color: #909090;
	}


	.gnav-sp-wrap ul li {
		display: inline;
		font-size: 1rem;

	}





	/* ヘッダーここまで */

	/* ハンバーガーメニュー　ここから  */
	#menu-button{
		display: block;
		width: 30px;
		height: 30px;
		margin-top: 26px;
		margin-right: 21px;
	}

	.menu-button-inner{
		position: relative;
		display: block;
		width: 100%;
		height: 100%;
		z-index: 100;
	}

	.menu-button-inner span{
		position: absolute;
		display: block;
		width: 100%;
		height: 2px;
		background-color: #e1715b;
		transition: transform 0.3s, opacity 0.3s;
	}

	.menu-button-inner span:nth-child(1){
		top: 0;
		
	}

	.menu-button-inner span:nth-child(2){
		top: 0;
		bottom: 0;
		margin: auto;
	
	}

	.menu-button-inner span:nth-child(3){
		bottom: 0;
	}

	#menu-button.is-active .menu-button-inner span:nth-of-type(1){
		top: 5;
		transform: translateY(15px) rotate(45deg)!important;
		
	}

	#menu-button.is-active .menu-button-inner span:nth-of-type(2){
		opacity: 0!important;
		
	}

	#menu-button.is-active .menu-button-inner span:nth-of-type(3){
		bottom: 5;
		transform: translateY(-15px) rotate(-45deg)!important;
		
	}


	/* #menu-button.is-active .line-middle{
		opacity: 0;
	} */



	/* ハンバーガーメニュー　ここまで  */

	/* メインビジュアル　ここから  */
	.mainvisual{
		width: 100%;
		height: 100vh;
		background-image: url(../images/main-visual-sp.png);
		margin-top: 80px;
		/* margin-bottom: 30px; */
		/* margin: 0 auto; */
		position: relative;
		/* background-attachment:fixed ; */
		padding-top: 80px;

	}

	.mainvisual-title{
		height: 52px;
		position: absolute;
		right: 0;
		bottom: 26px;
		width: 260px;
		text-align: center;
	}

	.mainvisual-text{
		font-size: 22px;
		text-align: center;
		line-height: 52px;
	}


	/** -----------------------------------
		私たちについて
	-------------------------------------**/

	#about{
		/* background-image: url(../images/about-back-sp.png); */
		width: 100%;
		height: 100%;

	}

	.col-2-about{
		display: block;
		padding: 0px 


	}

	#about .col-2-about .item-about {
		width: 100%;
	}

	.about-text{
		font-size: 16px;	
	}




	/** -----------------------------------
		NEWS
	-------------------------------------**/
	#news{
		/* background-color: #f4f1ef; */
		/* padding: 0px; */

	}

	.news-sectioninner{
		/* padding: 0 auto; */
		/* flex-direction: column;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		align-items: center; */
		/* display: none; */
		width: auto;
	}


	hr{
		width: 380px;
		/* margin: auto; */
	}

	#news .section-title{
		/* padding-bottom: 37px; */
	}

	.news-sp{
		padding-top: 26px;
		padding-bottom: 26px;
		position: relative;
	}



	.news-contents{
		display: inline;
		/* margin: 20px 0px; */
		line-height: 2;
		padding: 0px;
	}

	.news-text{
		line-height: 1.5;

	}
	.news-sp a::after{
		content: '';
		width: 15px;
		height: 15px;
		background-image: url(../images/news_square.png);
		background-size: contain;
		position: absolute;
		top: 50%;
		bottom: 50%;
		right: 21%;
		margin: auto;
		align-items: center;
	}


	/** -----------------------------------
		事業について
	-------------------------------------**/
	.col-3{

	}

	#business{
		background-image: url(../images/business-background-sp.png);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
		text-align: center;
		width: 100vw;
		/* height: 2330px; */
		background-attachment: fixed;
		/* flex-direction: column; */

	}

	.business-item-baby,.business-item-photobook,.business-item-community{
		/* height: 260px;
		margin-bottom: 57px; */
		width: 100%;
		/* display: flex;
		justify-content: center; */

	}

	.business-card{
		/* height: 100%; */
		/* display: flex;
		justify-content: center; */
		width: 100%;
		flex-direction: column;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		align-items: center;

	}

	.business-card-img-baby{
		order: 1;
	}

	.business-content-baby{
		order: 2;
	}


	.business-content-baby,.business-content-community,.business-content-photobook{
		display: none;
	
	}

	.business-content-baby-sp, .business-content-community-sp{
		background-color: #fffcf1;
		/* width: 100%; */
		border-radius: 0px 0px 60px 60px;
		/* text-align: center; */
		display: flex;
		justify-content: center;
		gap: 12px;
		margin-top: -8px;
		/* width: 410px;
		height: 305px; */
		width: 323px;
		height: 234px;	
		padding: 0 30px;
		flex-wrap: wrap;
		align-content: center;
	}
	

	.business-card-img-photobook-sp{
		order: 3;
	}
	.business-card-img-baby-sp,.business-card-img-photobook-sp,.business-card-img-community-sp{
		display: grid;
		gap: 0;
		/* width: 410px;
		height: 305px; */

}


	.business-content-photobook-sp{
		background-color: #fffcf1;
		/* width: 100%; */
		/* height: 323px; */
		border-radius: 0px 0px 60px 60px;
		/* height: 260px; */
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 12px; 
		order: 4;
		margin-top: -8px;
		/* width: 410px;
		height: 305px; */
		width: 323px;
		height: 234px;	
		padding: 0 30px;
		
	}

	.business-text{
		font-size: 16px;
	}
	
	.business-card-img-community{
		order: 5;
	}

	.business-content-community{
		order: 6;
	}

	.business-card-img-baby-sp,.business-card-img-photobook-sp,.business-card-img-community-sp{
		display: block;
		padding-bottom: 0px;
	}

	.business-card-img-baby,.business-card-img-photobook,.business-card-img-community{
		display: none;
	}

	/** -----------------------------------
		メンバーについて
	-------------------------------------**/
	#member{
		background-image: url(../images/member-back-sp.png); 
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center; 
		background-color: #f4f1ef;
		width: 100%;
		display: block;
		

	}
	.member-pc{
		/* display: none; */
	}

	.section-inner{
		width: 100%;

	}

	.col-4{
		display: flex;
		align-items: center;
		/* padding-left: 120px;
		padding-right: 120px; */
		gap: 30px	;
		justify-content: space-between;
		width: 95%;
		margin: auto;
		justify-content: center;


	}


	.item{
		/* margin-bottom: 57px; */
		text-align: center;
		/* display: flex;
		justify-content: flex-start; */
		/* display: block; */

	}

	.card{
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	.card-img{
		margin-bottom: -10px;
		width: 75%;
		/* height: 460px; */

	}

	.card-text{
		/* background-color: #efd6dd; */
		/* width: 100%; */
		/* border-radius: 0px 0px 60px 60px; */
		text-align: center;
		/* height: 164px; */
		width: 410px;
		height: 200px;

	}

	.member-name{
		font-size: 20px;
		margin-bottom: 28px;
		padding-top: 36px;
	}

	.job-type{
		font-size: 18px;
		line-height: 20px;
		margin-bottom: 36px;
	}


	/** -----------------------------------
		募集職種について
	-------------------------------------**/
	#work{
		/* background-image: url(../images/work-back-sp.png);
		background-repeat: no-repeat; */
	}

	/* .upper-row{
		gap: 50px;
		padding-bottom: 30px;
	}

	.lower-row{
		gap: 50px;
	} */

	.work-container{
		display: flex;
		justify-content: center;
		/* width: 340px; */
		width: 100%;
		margin: 0 auto;
	}

	.engineer img,.director img,.marketer img,.customersupport img,.UIUXdesiner img{
		width: 200px;
		height: 200px;
	}

	.engineer p,.director p,.marketer p,.customersupport p,.UIUXdesiner p{
		font-size: 14px;
	}


	.engineer .director .marketer .customersupport .UIUXdesiner{
		width: calc(100% / 2 - 50px);
		gap: 20px;

	}

	/** -----------------------------------
		働く環境について
	-------------------------------------**/
	#environment{
		/* background-image: url(../images/environment-back-sp.png); */
		width: 100%;
		height: 100%;
	}

	.section-inner-environment{
		/* margin: auto; */
	}

	.col-2-environment{
		/* display: flex	;
		justify-content: center	;
		gap: 30px;
		width: 80%;
		margin: auto; */
		display: block;
		padding: auto;
		width: 100%;
	}

	img,.photo-enviroment{
		width: 120%;
	}

	.item-environment{
		/* text-align: center; */
		width: 100%;
		justify-content: center;
		/* position: relative; */
	}


	.section-description-environment{
		padding-bottom: 20px;
		margin: auto 0px;
		text-align: left;
	}

	.section-description-environment,ul,li{
		font-size: 16px;
		text-align: left;

	}


	.item-environment,.section-description,ul{
		list-style-type: none;
	}


	/** -----------------------------------
		採用について
	-------------------------------------**/
	#saiyou{
		/* background-image: url(../images/member-back.png);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center; */
		width: 100%;
	}

	.section-inner{
	}

	.col-4-saiyou{
		/* display: flex; */
		align-items: center;
		/* padding-left: 120px;
		padding-right: 120px; */
		/* gap: 30px	; */
		/* justify-content: space-between; */
		width: 95%;
		margin: auto;
		/* justify-content: flex-start; */
		display: block;
		/* justify-content: center; */

	}

	.saiyou-yajirushi-pc{
		display: none;
	}

	.saiyou-yajirushi-sp{
		display: block;
		width: 20%;
		margin:  20px auto;
		vertical-align: bottom;
	}

	.saiyou-yajirushi-sp img{
		vertical-align: bottom;

	}


	.item{
		/* margin-bottom: 57px; */
		/* text-align: center; */


	}

	.saiyou-img{
		display: none;
	}

	.saiyou-img-sp{
		/* width: 27%; */
		display: flex;
		justify-content: center;
		text-align: center;

		/* width: 460px;
		height: 460px; */
		width: 67%;


	}



	/* .card{
		display: flex;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	} */

	.card-saiyou{
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	/* .saiyou-img{
		margin-bottom: -10px;
		width: 460px;
		height: 460px;

	}
 */




	/* .card-img{
		margin-bottom: -10px;
		width: 410px;
		height: 378px;

	} */

	.card-text{
		/* background-color: #efd6dd; */
		/* width: 100%; */
		/* border-radius: 0px 0px 60px 60px; */
		text-align: center;
		/* height: 164px; */
		/* width: 410px;
		height: 200px; */

	}

	/** -----------------------------------
		エントリー
	-------------------------------------**/

	.entry{
		background-image: url(../images/entory_back-sp.png);
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
		display: block;
		width: 100%;
		height: 100%;
		padding: 41px 27px;
		text-align: center;

	}

	.col-2-entry{
		/* display: flex;
		justify-content: center;
		gap: 20%;
		width: 50%; */
		margin: auto;
		display: block;
	}

	.message-entry{
		font-size: 18px	;
		margin: 0px;
		text-align: left;
		text-align: center;
	}

	.item-entry{
		display: flex;
		justify-content: center;
		align-items: center;
		display: block;
		width: 100%;

	}

	.text-entry{
		text-align: center;
	}

	.button-entry-large,a{
		font-size: 16px;
		/* text-decoration: none; */
	}

	.recruit-faq{
		font-size: 16px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: -20px;
	}

	.recruit-faq a{
		text-decoration: none;
		text-align: center;
		display: flex;
		justify-content: center;
		align-items: center;

	}

	.pc-br{
		display: none;
	}

	/** -----------------------------------
		フッター
	-------------------------------------**/
	#footer{
		background-color: #ffff;
		width: 100%;
		height: 114px;
		/* display: block; */
		display: flex;
		justify-content: center;
		align-items: center;
		height: 239px;
		width: 100%;
		margin: 43px 0px;
	}

	.footer-container{
		display: flex;
		justify-content: center;
		gap: 15%;
		/* margin: 43px 0px; */
		display: block;
		text-align: center;
		padding: 0px;

	}

	.footer-logo{
		display: none;
	}

	.footer-logo-sp{
		display: block;
		width: 184px;
		height: 63px;
		margin: 0px auto;
	}

	.footer-link{
		display: block;
		padding-bottom: 23px;
		margin-bottom: 0px;

	}

	ul.footer-link li{
		/* display: flex;
		justify-content: center;
		gap: 50px; */
		font-size: 16px;
		margin-bottom: 0px;
		text-align: center;

	}

	.copyright{
		text-align: center;
		font-size: 12px;
		margin-top: 0px;
	}

	/** -----------------------------------
		下部のエントリー
	-------------------------------------**/

	.under-entry{
		position: fixed;
		bottom: 0;
		z-index: 1000;
		margin: 0 auto;
		width: 100%;
		display: block;
	}

}