@charset "utf-8";


/* ==========================================================================
	main
========================================================================== */

#main{
	width:100%;
	height:450px;
	background:url("../image/main.jpg") center center no-repeat;
	background-size:cover;
	margin-bottom:61px;
	position:relative;
	box-sizing:border-box;
}

#main h1{padding-top:160px;
	text-align:center;
	letter-spacing:0.025em;
	font-size:62px;
	font-weight:700;
	color:#ead83a;
	-webkit-text-shadow: 0px 0px 5px #747474; /* Safari, Chrome用 */
	-moz-text-shadow: 0px 0px 5px #747474; /* Safari, Chrome用 */
	text-shadow:  0px 0px 5px #747474; /* Safari, Chrome用 */
	}

#main h1 span{
	-webkit-text-shadow: 0 0 9px #ddd; /* Safari, Chrome用 */
	-moz-text-shadow: 0 0 9px #ddd; /* Firefox用 */
	text-shadow: 0 0 9px #ddd; /* CSS3 */
	
	}
	
	
	
#main h2{
	margin-top:13px;
	color:#fff;
	font-weight:bold;
	font-size:22.5px;
	text-align:center;
	letter-spacing:0.05em;
	-webkit-text-shadow: 0px 0px 7px #747474; /* Safari, Chrome用 */
	-moz-text-shadow: 0px 0px 7px #747474; /* Safari, Chrome用 */
	text-shadow:  0px 0px 7px #747474; /* Safari, Chrome用 */
	
	}
@media screen and ( max-width: 1020px ) {
	
#main{
	margin-bottom:60px;
	}
	}
@media screen and ( max-width: 720px ) {
	

#main{
	width:100%;
	height:170px;
	background:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/main_sp.jpg") center center no-repeat;
	background-size:cover;
	margin-bottom:32px;
}
#main h1{
	padding-top:52px;
	font-size:30px;
	}

#main h2{
	margin-top:3px;
	color:#fff;
	font-weight:bold;
	font-size:12px;
	text-align:center;
	letter-spacing:0.05em;
	
	}
	}

	
	



/* ==========================================================================
	about
========================================================================== */
#top_about{
	width:100%;
	background:#fff;
}
#about_bg{
	width:100%;
	height:450px;
	background:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/about_main.jpg") center center no-repeat;
	background-size:cover;
	margin-bottom:50px;
}


#top_about h1{
	font-size:41px;
	color:#b9ab27;
	text-align:center;
	font-weight:700;
	}

#top_about h2{
	font-size:15px;
	line-height:15px;
	text-align:center;
	margin:9px 0 35px;
	font-weight:bold;
	letter-spacing:0.025rem;
	}
#top_about h3{
	font-size:25px;
	line-height:40px;
	text-align:center;
	font-weight:bold;
	letter-spacing:0;
	color:#424242;
	letter-spacing:-0.025rem;
	margin-bottom:21px;
	}
#top_about p{
	font-size:14px;
	font-weight:bold;
	line-height:30px;
	text-align:center;
	margin:0 0 15px;
	}

#top_about .shosai_btn1{
	margin:0 auto 57px;
	}
	

/*ループスライダーの設定*/

.loopslider {
	margin: 50px auto 0;
	width: 100%;
	height: 217px;
	text-align: left;
	position: relative;
	overflow: hidden;
}
.loopslider ul {
	width: 100%;
	height: 217px; 
	float: left;
	display: inline;
	overflow: hidden;
}
.loopslider ul li {
	width: 217px;
	height: 217px;
	float: left;
	display: inline;
}

.loopslider ul li img{
	width: 217px;
	height: 217px;
	}
.loopslider .loopslider_wrap{
	height:217px !important;
	}	

/*	ClearFixElements */
.loopslider ul:after {
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
}

.loopslider ul {
	display: inline-block;
	overflow: hidden;
}

@media screen and ( max-width: 720px ) {
	

#top_about h3{
	font-size:16px;
	line-height:22px;
	color:#424242;
	margin-bottom:10px;
	}
#top_about p{
	font-size:11px;
	font-weight:bold;
	line-height:22px;
	text-align:center;
	margin:0 0 14px;
	}

.loopslider {
	height: 125px;
	margin:33px auto 0;
}
.loopslider ul {
	width: 100%;
	height: 125px;
}
.loopslider ul li {
	width: 125px;
	height: 125px;
}

.loopslider ul li img{
	width: 125px;
	height: 125px;
	}
.loopslider .loopslider_wrap{
	height:125px !important;
	}	

	}

	
/* ==========================================================================
	staff紹介
========================================================================== */

#staff{
	background:#faf8f5;
	width:100%;
	padding:30px 0 10px;
	box-sizing:border-box;
	}

.staff_box,
.shokunin_box{
	width:830px;
	position:relative;
	}
.staff_box{
	margin:0 auto 30px;
	}
.shokunin_box{
	margin:0 auto;
	
	}
.staff_box h1,
.shokunin_box h1{
	font-size:41px;
	text-align:center;
	font-weight:700;
	}

.staff_box h1{
	color:#D3C203;
	}
	
.shokunin_box h1{
	color:#b9ab27;
	}
.staff_box h2,
.shokunin_box h2{
	font-size:15px;
	line-height:15px;
	text-align:center;
	margin:9px 0 50px;
	font-weight:bold;
	letter-spacing:0.025rem;
	}


.staff_box ul,
.shokunin_box ul{
	width:100%;
	-js-display: flex;
	display:-webkit-box;
	display: -webkit-flex;
	display:-moz-box;
	display:-ms-flexbox;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
	-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	}


.staff_box ul:after,
.shokunin_box ul:after{
  content:' '; 
	width:250px;
  display: block;	
	}
.staff_box ul li,
.shokunin_box ul li{
	width:250px;
	margin-bottom:38px;
	text-align:center;
	}
	
/*
.staff_box ul li img{
	width:250px;
	}
	
.staff_box ul li img:before {
  content:"";
  display: block;
  padding-top:116%;

}*/
.staff_box li p,
.shokunin_box li p{
	font-size:16px;
	font-weight:bold;
	padding:18px 0 8px;
	color:#1b1b1b;
	text-align:center;
	}
.staff_box li span,
.shokunin_box li span{
	font-size:12px;
	font-weight:700;
	color:#999999;
	text-align:center;
	}

.shokunin_box li p span{
	font-size:14px;
	font-weight:bold;
	color:#1b1b1b;
}
	
.shokunin_bnr{
	display:block;
	width:100%;
	height:160px;
	padding:28px 0 0 40px;
	box-sizing:border-box;
	position:relative;
	overflow: hidden;
	margin-top:17px;
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/shokunin_bnr_bg_ie.jpg")\9;
	background-size:cover\9;
	z-index:100\9;
	}

.shokunin_bnr:hover{
filter: alpha(opacity=100);
-moz-opacity:1;
opacity:1;
}
.shokunin_bnr h3,
.shokunin_bnr p,
.shokunin_bnr div{
	z-index:100; !important
	}
.shokunin_bnr h3{
	font-size:24px;
	color:#fff;
	font-weight:bold;
	}
	
.shokunin_bnr h3:after{
    content: "";
    display: block;
	width:120px;
	height:3px;
	background:#fff;
	margin:12px 0 20px;
	
	}
.shokunin_bnr p{
	color:#fff;
	font-size:16px;
	line-height:24px;
	font-weight:bold;
}
.shokunin_bnr .shokunin_bnr_btn{
	width:166px;
	height:42px;
	font-size:13px; 
	padding-top:12px;
	color:#fff;
	font-weight:bold;
	box-sizing:border-box;
	text-align:center;
	border:2px solid #fff;
	-webkit-transition: background 0.4s ease,color 0.4s ease;
    -moz-transition: background 0.4s ease,color 0.4s ease;
    -o-transition: background 0.4s ease,color 0.4s ease;
    transition: background 0.4s ease,color 0.4s ease;
	position:absolute;
	right:40px;
	top:0;
	bottom:0;
	margin: auto;
	}

.shokunin_bnr:hover div{
	background:#fff;
    color: #99CCCC;

	}


.shokunin_bnr:after{
    content: "";
	z-index:-2;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/shokunin_bnr_bg.jpg");
	background-size:cover;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    transition: all .3s ease-out;
	
	}
.shokunin_bnr:hover:after{
	
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
	}
.shokunin_bnr:before {
    z-index: -1;
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #99CCCC;
}

@media screen and ( max-width: 860px ) {
	

.staff_box,
.shokunin_box{
	width:100%;
	padding:0 20px;
	box-sizing:border-box;
	}
.staff_box ul::after,
.shokunin_box ul::after{
	width:30%;
  content:"";
  display: block;	
	}
.staff_box ul li,
.shokunin_box ul li{
	width:30%;
	}
}


@media screen and ( max-width: 720px ) {
#staff{
	padding:52px 0;
	}
.staff_box h1,
.shokunin_box h1{
	font-size:30px;
	}
	
.shokunin_box .en{
	letter-spacing:-0.025em !important;
	}

.staff_box h2,
.shokunin_box h2{
	font-size:11px;
	line-height:11px;
	margin:5px 0 20px;
	}
	
.staff_box,
.shokunin_box{
	padding:0 15px;
	}
.staff_box{
	margin:0 auto 20px;
	}
.staff_box ul::after,
.shokunin_box ul::after{
  display:none;	
	}
.staff_box ul li,
.shokunin_box ul li{
	width:48%;
	margin-bottom:20px;
	}
.staff_box li p,
.shokunin_box li p{
	font-size:12px;
	padding:8px 0 4px;
	}
.staff_box li span,
.shokunin_box li span{
	font-size:10px;
	letter-spacing:-0.025em;
}
.shokunin_box li p span{
	font-size:10px;
}
.shokunin_bnr{
	display:block;
	width:100%;
	height:140px;
	padding:15px 0 0 0;
	margin-top:12px;
	}

.shokunin_bnr h3{
	font-size:14px;
	color:#fff;
	font-weight:bold;
	text-align:center;
	}
	
.shokunin_bnr h3:after{
    content: "";
    display: block;
	width:70px;
	height:2px;
	background:#fff;
	margin:8px auto 10px;
	
	}
.shokunin_bnr p{
	color:#fff;
	font-size:10px;
	line-height:17px;
	font-weight:bold;
	text-align:center;
}
.shokunin_bnr .shokunin_bnr_btn{
	position:absolute;
	top:80px;
	left:0;
	right:0;
	margin:auto;
	display:block;
	width:88px;
	height:30px;
	font-size:11px; 
	padding-top:7px;
	font-weight:bold;
	border:2px solid #fff;
	}
.shokunin_bnr:after{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/shokunin_bnr_bg_sp.jpg");
	
	}
	

	}
	
	
/* ==========================================================================
	Activities
========================================================================== */
	
#activities{
	width:100%;
	background:#fff;
	padding:80px 0 60px;
	}
	
#activities h1{
	font-size:41px;
	text-align:center;
	font-weight:700;
	color:#7cb7ae;
	}
#activities h2{
	font-size:15px;
	line-height:15px;
	text-align:center;
	margin:9px 0 50px;
	font-weight:bold;
	letter-spacing:0.025rem;
	}


#activities .l_box,
#activities .r_box{
	width:1080px;
	margin:0 auto 60px;
	}
#activities .l_box h1,
#activities .r_box h1{
	width:66px;
	}


#activities .l_box h1:after,
#activities .r_box h1:after{
    content: "";
    display: block;
	height:3px;
	background:#7cb7ae;
	margin:10px 0 12px;
	}
#activities .l_box h2,
#activities .r_box h2{
	font-size:24px;
	line-height:35px;
	text-align:left;
	margin:0;
	color:#424242;
	font-weight:bold;
	letter-spacing:0.025rem;
	}
	
	
#activities .l_box p,
#activities .r_box p{
	font-size:14px;
	line-height:30px;
	margin-top:10px;
	font-weight:bold;
	}
	
#activities .l_box div,
#activities .r_box div,
#activities .r_box figure{
	float:left;
		}
#activities .l_box figure{
	float:right;
		}
		
#activities .r_box .tb2{
	margin-left:60px;
	}
	
		
#activities .l_box figure,
#activities .r_box figure{
	width:620px;
	height:290px;
	background-size:cover;
	}

#activities .ac01 div{
	padding-top:68px;
	}
#activities .ac01 h1:after{
    width:50px;
	}
#activities .ac01 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac01_img.jpg");
	}
	
#activities .ac02 div,
#activities .ac03 div{
	padding-top:30px;
	}
#activities .ac02 h1:after,
#activities .ac03 h1:after{
    width:60px;
	}
#activities .ac02 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac02_img.jpg");
	}
	
#activities .ac03 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac03_img.jpg");
	}
	
#activities .ac04 div,
#activities .ac05 div{
	padding-top:65px;
	}
#activities .ac04 h1:after{
    width:60px;
	}
#activities .ac04 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac04_img.jpg");
	}
	
#activities .ac05 h1:after{
    width:62px;
	}
#activities .ac05 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac05_img.jpg");
	}
	
	
#activities .ac06 div{
	padding-top:45px;
	}
#activities .ac06 h1:after{
    width:64px;
	}
#activities .ac06 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac06_img.jpg");
	}
	

#activities .ac07 div,
#activities .ac08 div,
#activities .ac09 div{
	padding-top:65px;
	}
#activities .ac07 h1:after{
    width:60px;
	}
#activities .ac07 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac07_img.jpg");
	}
	
#activities .ac08 h1:after{
    width:63px;
	}
#activities .ac08 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac08_img.jpg");
	}
	
	
#activities .ac09 h1:after{
    width:63px;
	}
#activities .ac09 figure{
	background-image:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/ac09_img.jpg");
	}
.b_txt{
	margin:0 auto 40px;
	width:1080px;
	font-size:14px;
	line-height:14px;
	font-weight:bold;
	}
@media screen and ( max-width: 1100px ) {
	
#activities .l_box,
#activities .r_box{
	width:100%;
	padding:0 20px;
	box-sizing:border-box;
	}
#activities .l_box figure,
#activities .r_box figure{
	width:55%;
	}

#activities .r_box div,
#activities .l_box div{
	width:40%;
	}
#activities .r_box .tb2{
	float:right;
	margin-left:0;
	}
#activities .ac02 div{
	padding-top:20px;
	}
	
#activities .break1{
	display:none;
	}
.b_txt{
	margin:0 auto 40px;
	width:100%;
	padding-left:20px;
	box-sizing:border-box;
	}
	}
@media screen and ( max-width: 720px ) {
	
	
#activities{
	padding:45px 0 19px;
	}
	
#activities h1{
	font-size:30px;
	}

#activities h2{
	font-size:11px;
	line-height:11px;
	margin:5px 0 20px;
	}
	
	
#activities .l_box,
#activities .r_box{
	padding:0 15px;
	box-sizing:border-box;
	margin-bottom:45px;
	}
#activities .l_box figure,
#activities .r_box figure,
#activities .r_box div,
#activities .l_box div{
	width:100%;
	float:none;
	}



#activities .l_box figure,
#activities .r_box figure{
	width:100%;
	height:auto;
	position:relative;
	background-size:cover;
	background-position:top center;
	
	}


#activities .l_box figure:before,
#activities .r_box figure:before{
  content:"";
  display: block;
  padding-top:40%;

}
#activities .ac01 div,
#activities .ac02 div,
#activities .ac03 div,
#activities .ac04 div,
#activities .ac05 div,
#activities .ac06 div,
#activities .ac07 div,
#activities .ac08 div,
#activities .ac09 div{
	padding-top:10px;
	}
#activities .l_box h1,
#activities .r_box h1{
	width:37px;
	}
#activities .l_box h1:after,
#activities .r_box h1:after{
	height:2px;
	margin:5px 0 7px;
	}
	
#activities .l_box h2,
#activities .r_box h2{
	font-size:17px;
	line-height:26px;
	margin:0;
	letter-spacing:0.025rem;
	}
#activities .l_box p,
#activities .r_box p{
	font-size:11px;
	line-height:22px;
	margin-top:5px;
	font-weight:bold;
	}
#activities .ac01 h1:after{
    width:30px;
	}
	
#activities .ac02 h1:after,
#activities .ac03 h1:after{
    width:35px;
	}
	
#activities .ac04 h1:after{
    width:34px;
	}
#activities .ac05 h1:after{
    width:35px;
	}
#activities .ac06 h1:after{
    width:37px;
	}
#activities .ac07 h1:after{
    width:34px;
	}
	
#activities .ac08 h1:after{
    width:36px;
	}
#activities .ac09 h1:after{
    width:36px;
	}
.b_txt{
	margin:0 auto 20px;
	width:100%;
	padding:0 15px;
	box-sizing:border-box;
	font-size:11px;
	line-height:22px;
	}
	}
/* ==========================================================================
	What'sギンナンスタイル
========================================================================== */

#whats{
	position:relative;
	z-index:105;
	width:100%;
	background:url("https://sakurahp.or.jp/sakurahp-recruit/voice/image/whats_bg.jpg") bottom center no-repeat;
	padding:65px 0 0;
  box-sizing:border-box;
  
}

#whats h1{
	position:relative;
	width:386px;
	margin:0 auto;
	}

#whats h2{
	position:relative;
	width:700px;
	text-align:center;
	font-size:15.39px;
	font-weight:bold;
	margin:22px auto 40px;
	line-height:15.39px;
	}


#whats div{
	width:100%;
	margin:0 auto;
	max-width:1000px;
	}

#whats .shosai_btn1{
	width:145px;
	height:40px;
	font-size:14px;
	box-sizing:border-box;
	}
@media screen and ( max-width: 720px ) {
	
#whats{
	position:relative;
	z-index:105;
	width:100%;
	padding:10% 0 0 0;
	background:#F6F1F7;
  box-sizing:border-box;
}
#whats h1{
	width:65%;
	}
#whats h2{
	position:relative;
	width:100%;
	box-sliging:border-box;
	text-align:center;
	font-weight:bold;
	margin:4% auto 6.2%;
	line-height:10px;
	letter-spacing:0.025rem;
	}
#whats div{
	width:100%;
	}
	
#whats .shosai_btn1{
	position:relative;
	display:block;
	width:134px;
	height:34px;
	font-size:11px; 
	padding-top:9px;
	font-weight:bold;
	border:2px solid #333;
	}
	}

@media screen and ( max-width: 550px ) {
#whats h2{
	font-size:13px;
	font-weight:bold;
	margin:4% auto 6.2%;
	line-height:14px;
	}
	}

@media screen and ( max-width: 400px ) {
#whats h2{
	font-size:11px;
	font-weight:bold;
	margin:4% auto 6.2%;
	line-height:10px;
	}
	
	}
	
	
	


/* ==========================================================================
	フッターバナー
========================================================================== */
#hasei_ftbnr{
	position:relative;
	width:1000px;
	height:0;
	margin:0 auto;
	z-index:1000;
	}
.foot_bnr{
	width:221px;
	height:66px;
	position:absolute;
	border:2px solid #231d1f;
	bottom:-34px;
	left:-38px;
}

@media screen and ( max-width: 1080px ) {
#hasei_ftbnr{
width:100%;
}
	
.foot_bnr{
	left:10px;
	}

	}
@media screen and ( max-width: 720px ) {
#hasei_ftbnr{
	width:100%;
	height:96px;
	background:#f9f7f4;
}
.foot_bnr{
	width:130px;
	height:40px;
	position:absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	}

	
}