@charset "UTF-8";

/* CSS Document */



body {

	-webkit-text-size-adjust: 100%;

}



/*=========================================== 

スマホ向けのレイアウトの指定：～960px 

===========================================*/

@media only screen and (min-width: 0px) {

	

#container{

	margin:0 auto;

	width:100%;

	color: rgb(75,75,75);

}



/* メインビジュアル */

.mv_sp img{

	width:100%;

	height:auto;

	display: block;

}

	

.mv{

	display: none;

}

	

#wrapper{

	margin:0 auto;

	width:90%;

}



/* タイトル周り */

.head{

	margin:45px auto 36px;

	width:90%;

}



h2{

	font-size:24px;

	text-align: center;

}



h2 p{

	letter-spacing:3px;

	line-height: 1.5;

}



p.title_text{

	font-size: 14px;

	text-align: center;

	margin-top: 25px;

	line-height: 1.5;

}



br.pc{

	display: none;

}

	

/*研修　共通部分*/	

.training{

	margin: 0 auto 50px;

	overflow: hidden;

}

	

.training h3{

	font-size: 20px;

	border-bottom: 3px solid rgb(48,48,48);

}

	

.training h3 p{

	padding: 0 0 5px 0;

}

	

.training_inner{

	margin: 50px 0 0 ;	

	overflow: hidden;

}

	

.training_inner_1{

	margin: 30px 0 0 ;	

}

	

.training img{

	width: 100%;

	height: auto;

}

	

.inner_box{

	overflow: hidden;

}

	

.No{

	float: left;

	border: 1px solid rgb(76,76,76);

	font-size: 18px;

	width: 30px;

	height: 30px;

	line-height: 30px;

	text-align: center;

	margin: 20px 0 20px 10px;

	box-sizing: border-box;

}



.training_inner h4{

	font-size: 18px;

	text-align: center;

}



.training_inner h4 p{

	margin: 20px 0 20px 10px;

	float: left;

	height: 30px;

	line-height: 30px;

}

	

.training .text{

	float: left;

	text-align: justify;

	text-justify:inter-ideograph;

}

	

.text_inner{

	font-size: 14px;

	line-height: 1.5;

}

	

/*警備部の研修*/

.training_2 h3{

	border-bottom: 3px solid rgb(0,159,232);

	color: rgb(0,159,232);

}

	

.training_2 .No{

	border: none;

	background-color: rgb(0,159,232);

	color: rgb(255,255,255);

}

	

/*機械警備部の研修*/

.training_3 h3{

	border-bottom: 3px solid rgb(49,80,161);

	color: rgb(49,80,161);

}

	

.training_3 .No{

	border: none;

	background-color: rgb(49,80,161);

	color: rgb(255,255,255);

}

	

/*消防部の研修*/

.training_4{

	margin: 0 auto 30px;

}

	

.training_4 h3{

	border-bottom: 3px solid rgb(211,58,24);

	color: rgb(211,58,24);

}

	

.training_4 .No{

	border: none;

	background-color: rgb(211,58,24);

	color: rgb(255,255,255);

}

	

hr{

	border-bottom: 1px solid rgb(102,102,102);

}

	

/*福利厚生*/

.welfare{

	margin: 0 auto 50px;

	overflow: hidden;

}

	

.welfare_5{

	margin: 0 auto 45px;

}

	

.welfare img{

	width: 100%;

	height: auto;

}

	

.welfare h4{

	font-size: 18px;

}



.welfare h4 p{

	margin: 20px 0;

}

    

    

.welfare h4 p .small {

    display: inline-block;

    font-size: 14px;

    margin: 0 0 0 10px;

}

	

.welfare .text{

	float: left;

	font-size: 14px;

	line-height: 1.5;

	text-align: justify;

	text-justify:inter-ideograph;

}

	

	

/*ページトップ ボタン*/

#page_top{

	color:rgb(220,220,220);

	position:fixed;

	bottom:15px;

	right:15px;

	font-size:1.4rem;

	z-index: 9999;

}



#page_top a{

	background:rgb(100,100,100);

	color:rgb(255,255,255);

	width:50px;

	padding:15px 5px;

	text-align:center;

	display:block;

	border-radius:5px;

}



#page_top a:hover{

	background:rgba(100,100,100,0.7);

}

}



/*=========================================== 

PC向けのレイアウトの指定：961px〜

===========================================*/

@media only screen and (min-width: 960px) {



body{

overflow-x: hidden;

}

	

#container{

	margin:0 auto;

	max-width:100vw;

}

	

/* メインビジュアル */

.mv{

	width: 100vw;

	height:294px;

	background: url(../images/training_mv.jpg) no-repeat center top;

	background-size:cover;

	display: block;

}

	

.mv_sp{

	display: none;

}



/* タイトル周り */

.head{

	margin:90px auto;

	width:960px;

}



h2{

	font-size:45px;

}



h2 p{

	letter-spacing:5px;

}



p.title_text{

	margin-top: 50px;

	font-size: 16px;

}

	

br.pc{

	display:block;

}

	

#wrapper{

	margin:0 auto;

	width:960px;

}

	

/*研修　共通部分*/	

.training{

	margin: 0 auto 72px;

}

	

.training h3{

	font-size: 32px;

	border-bottom: 4px solid rgb(0,159,232);

}

	

.training h3 p{

	padding: 0 0 5px 0;

}

	

.training_inner,.training_inner_1{

	margin: 40px 0 0 ;	

}

	

.training img{

	float: left;

	width: 300px;

	height: auto;

}

	

.inner_box{

	float: left;

	width: 200px;

}

	

.No{

	float: none;

	font-size: 20px;

	margin: 0 0 0 20px;

}



.training_inner h4{

	font-size: 25px;

}



.training_inner h4 p{

	float: left;

	width: 200px;

	height: 153px;

	line-height: 153px;

	margin: 0;

}

	

.training .text{

	width: 459px;

	height: 185px;

	float: right;

	border-left: 1px solid rgb(191,191,191);	

}

	

.text_inner{

	margin: 0 0 0 20px;

	font-size: 16px;

}

	

.clear{

	clear: both;

}



/*警備部の研修*/

.training_2 h2{

	border-bottom: 4px solid rgb(0,159,232);

}



	

/*機械警備部の研修*/

.training_3 h3{

	border-bottom: 4px solid rgb(49,80,161);

}

	

/*消防部の研修*/

.training_4{

	margin: 0 auto 50px;

}

	

.training_4 h3{

	border-bottom: 4px solid rgb(211,58,24);

}



/*福利厚生*/

.welfare{

	margin: 0 auto 40px;

	overflow: hidden;

}

	

.welfare_5{

	margin: 0 auto 90px;

	overflow: hidden;

}

	

.welfare img{

	float: left;

	width: 300px;

	height: auto;

}

	

.welfare h4{

	font-size: 25px;

}



.welfare h4 p{

	float: left;

	margin: 0 0 20px 20px;

}

	

.welfare .text{

	float: left;

	width: 640px;

	margin: 0 0 0 20px;

	font-size: 16px;

	line-height: 2;

	text-align: justify;

}





/*ページトップ ボタン*/

#page_top{

	color:rgb(220,220,220);

	position:fixed;

	bottom:30px;

	right:30px;

	font-size:1.8rem;

}



#page_top a{

	background:rgb(100,100,100);

	color:rgb(255,255,255);

	width:120px;

	padding:30px 0;

	text-align:center;

	display:block;

	border-radius:5px;

}



#page_top a:hover{

	background:rgba(100,100,100,0.7);

}

}