@charset "utf-8";
/* CSS Document */

/* ==========================================================================
  職業実践専門課程 LP
   ========================================================================== */

/* コンテンツ設定
---------------------------------------------*/

#Container section {
	margin: auto;
	padding: 1.5rem 0;
	position: relative;
}

@media (min-width: 800px) {
	#Container section {
		padding: 2rem 0;
	}
}

#Container .s-section {
	padding:0 0 1rem 0;
}

@media (min-width: 800px) {
	#Container .s-section {
		padding:0 0 2rem 0;
	}
}

#main_contents{ margin:0 0 2rem 0; }

section > .pd-container.w_s{ max-width:960px }	


.color01{	color:#60C044; /* 緑 */ }
.color02{	color:#F15C73;　/* 赤 */ }
.color03{	color:#5E8ECA;　/* 青 */ }
.color04{	color:#E9446C;　/* ピンク */ }
.color05{	color:#FD9344;　/* オレンジ */ }

.font_l{	font-size:128.6%; /* 18px */ }
.font_m{	font-size:1em;}
.font_s{	font-size:85.7%; /* 12px */}	 
	
hr{
	border: 0;
	height: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(255, 255, 255, 0.8);
	margin:0.5rem 0;
	padding:0;
}

@media (min-width: 640px) {
	hr{
		border: 0;
		height: 0;
		border-top: 1px solid rgba(0, 0, 0, 0.1);
		border-bottom: 1px solid rgba(255, 255, 255, 0.8);
		margin:1.0rem 0;
		padding:0;
	}
}

.pc_contents{	display:none !important;}

@media (min-width: 800px) {
	.pc_contents{
		display:block !important;　/* 0～799pxは消える */
	}
}

.sp_contents{ display:none !important;}

@media (max-width: 799px) {
	.sp_contents{
		display:block !important; /* 800px～は消える */
	}
}

/* ヘッダー
---------------------------------------------*/

#Header {
	width:100%;
	margin: auto;
	background-color:#fff;
}

#HeaderInner{
	width:100%;
	margin:0 auto;
	text-align:left;
	position:relative;
	background:url(../imgs/shared/h_bg.gif) no-repeat top left;
	background-size:100% 4px;
	padding:12px 0 13px 0;
	/*border-bottom:1px dotted #ccc;*/
}

h1{
	margin:0;
	padding:0;
	text-align:center;
	font-size:10px;
	font-weight:normal;
}

h1 img{
	width:260px;
	height:auto;
	margin-top:5px;
}

@media (min-width: 960px) {
	#Header {
		/*background-color:#FEE8EB;*/
	}
	
	#HeaderInner{
		background:none;
		max-width:960px;
		padding:20px 0;
		border-bottom:none;
	}	
	
	h1{margin:0;
		margin:0 auto;
		
		float:none;
		width:260px;
	}
	
	h1 img{
		width:100%;
		margin:0;
		height:auto;
	}
	
}

/* タイトル
---------------------------------------------*/

.jissen_title{
	background:#E63462 url(../imgs/jissen/bg.png);
	padding:1.5rem;
	text-align:center;
}

.jissen_title img{
	width:90%;
	height:auto;
	margin:0 auto;
}

@media (min-width: 800px) {
	.jissen_title{
		padding:2.5rem 0;
		text-align:center;
	}
	
	.jissen_title img{
		width:auto;
		height:auto;
		margin:0 auto;
	}
}

/**/

#title{
	background:#FFF url(../imgs/shared/bg02.png);
	padding:3rem 0 2.9rem 0;
	text-align:center;
}

.titleInner{
	margin:0 auto;
	
}

.titleInner h2{
	font-size:20px;
	font-weight:bold;
	margin:0;
	line-height:1.3em;
}

@media (min-width: 800px) {
	#title{
		background:#FFF url(../imgs/shared/bg02.png);
		padding:3rem 0 2.9rem 0;
	}
	
	.titleInner h2{
		max-width:930px;
		font-size:28px;
		line-height:1.4em;
		margin:0 auto;
		padding:12px 0 10px 25px;
		text-align:left;
		border-left:4px solid #F9597E;
		line-height:1;
	}
}
 
ul.curriculum{
	display:flex;
	flex-wrap:wrap;
	margin:-0.5rem;
}

ul.curriculum li{
	width:calc(100% / 3);
	text-align:center;
	font-size:16px;
	font-weight: bold;
	padding:0.5rem;
}

@media (max-width: 640px) {
	ul.curriculum{
		display:flex;
		flex-wrap:wrap;
		margin:0;
	}
	
	ul.curriculum li{
		width:100%;
		margin-bottom:20px;
		padding:0;
	}
	ul.curriculum li:last-child{
		margin-bottom:0;
	}	
}

ul.curriculum li img{
	margin-bottom:10px;
}

ul.curriculum li small {
	display: block;
	font-size: 12px;
}

.catch{
	font-size:20px;
	font-weight:bold;
	text-align:left;
	text-decoration:underline;
	color:#E63462
}

@media (min-width: 768px) {
	.catch{
		font-size:28px;
		font-weight:bold;
		text-align:center;
	}	
}

.catch span{
/*	border-bottom:3px dotted #ccc;
	margin-bottom:10px;
	line-height:2.1;
	padding-bottom:3px;*/
}

h3{
	font-weight:bold;
	font-size:18px;
	background:url(../imgs/jissen/icon.png) no-repeat left center;
	background-size:14px;
	padding-left:22px;
	margin-bottom:0.75rem;
}

@media (min-width: 768px) {
	h3{
		margin-bottom:1rem;
		font-size:20px;
	}
}

.jissen_box{
	border:5px solid #ddd;
	padding:0.75rem;
	border-radius:3px;
}

@media (min-width: 768px) {
	.jissen_box{
		border:5px solid #ddd;
		padding:1.5rem;
	}
}

.jissen_box p{
	margin-bottom:5px;
}

.jissen_box p{
	font-size:16px;
	font-weight:bold;
}

@media (min-width: 768px) {
	.jissen_box p{
		font-size:18px;
	}
}

.jissen_box ul{
	margin:0 0 0 3rem;
	padding:0;
}

.jissen_box li{
	list-style:disc;
	margin:0;
	padding:0;
}

.jissen_box02{
	background:#295bb9;
	border-radius:3px;
	padding:1rem;
	text-align:left;
	margin-bottom:2rem;
	color:#FFF; 
}

.jissen_box02 span{
	font-size:16px;
	font-weight:bold;
}

@media (min-width: 768px) {
	.jissen_box02{
		padding:1.5rem 1.5rem 1.4rem 1.5rem;
		text-align:center;
	}
	
	.jissen_box02 span{
		font-size:20px;
		font-weight:bold;
	}
}

.jissen_box03 > div{
	width:100%;
}

.jissen_box03 >div:first-child{
	margin-bottom:1.5rem;
}

@media (min-width: 768px) {
	.jissen_box03{
		display:flex;
		justify-content:space-between;
	}	
	
	.jissen_box03 >div{
		width:50%;
	}	
	
	.jissen_box03 >div:first-child{
		border-right:2px dotted #ccc;
		padding-right:2rem;
		margin-bottom:0;
		box-sizing:border-box;
	}
	
	.jissen_box03 >div:last-child{
		padding-left:2rem;
		box-sizing:border-box;
	}	
	
}

.jissen_box03 strong{font-size:16px;}

#copyright{
	background-color:#F9597E;
	color:#fff;
	padding:10px;
	margin:0 auto;
	text-align:center;
}

#copyright p{
	font-size:11px;
	margin:0 auto;
	padding:0;
}