@charset "utf-8";  
/*------------------------------------------------------------ 
    course css
------------------------------------------------------------*/  

#visual{
	width:100%;
	background:url(../img/visual.jpg) no-repeat 50% 50%;
	background-size:cover;
}

#visual div{
	width:auto;
	min-height:76px;
	max-width:860px;
	margin:0 auto;
	padding:55px 10px 60px 100px;
	color:#fff;
	position:relative;
	background:url(../img/icon-hd.png) no-repeat 10px 50px;
}

#visual div:before{
	display:block;
	content:"";
	width:228px;
	height:124px;
	position:absolute;
	right:65px;
	bottom:0;
	background:url(../img/visual-deco.png) no-repeat;
}

#visual strong{
	display:block;
	font-size:40px;
	letter-spacing:2px;
	font-weight:normal;
}

#visual span{
	display:block;
	font-family:Arial, Helvetica, sans-serif;
	font-size:134%;
	letter-spacing:2px;
}

#detailHd{
	width:100%;
	margin-top:60px;
	color:#F569A1;
	text-align:center;
}

#detailHd h2{
	font-size:42px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	letter-spacing:3px;
	position:relative;
}

#detailHd h2:before{
	display:block;
	content:"";
	width:100%;
	height:5px;
	background:#FF7FB1;
	position:absolute;
	top:50%;
	left:0;
	margin-top:-2px;
	z-index:-2;
}

#detailHd h2:after{
	display:block;
	content:"";
	width:274px;
	height:5px;
	background:#fff;
	position:absolute;
	top:50%;
	left:50%;
	margin:-2px 0 0 -137px;
	z-index:-2;
}

#detailHd p{
	font-size:134%;
	letter-spacing:2px;
}

.sectionHd{
	width:100%;
	margin:40px 0 30px;
	padding-bottom:10px;
	background:url(../img/bg-sectionHd.png) repeat-x bottom;
	overflow:hidden;
}

.sectionHd h3{
	color:#4BBDFA;
	font-size:217%;
	font-weight:bold;
	float:left;
	line-height:36px;
}

.sectionHd p{
	float:right;
	line-height:36px;
	margin-left:5px;
	font-size:125%;
}

.sectionHd .point1{
	color:#F569A1;
	line-height:30px;
	padding:0 20px;
	border:3px solid #F569A1;
}

.sectionHd .point2{
	color:#1B95D7;
	line-height:30px;
	padding:0 20px;
	border:3px solid #4BBDFB;
}

.sectionHd .point3{
	color:#333333;
	line-height:30px;
	padding:0 20px;
	border:3px solid #919090;
}

.info1{
	width:60.4166667%;
	float:left;
}

.img1{
	width:39.583333%;
	float:right;
}

.info2{
	width:63.02083334%;
	float:left;
}

.img2{
	width:36.97916666%;
	float:right;
}

.info3{
	width:62.60416667%;
	float:left;
}

.img3{
	width:37.39583333%;
	float:right;
}

.img4{
	width:31%;
	float:left;
	margin: 1%;
}

.lead{
	color:#F569A1;
	font-size:167%;
	font-weight:bold;
	line-height:1.5;
}


.column01{
	width:100%;
	padding:60px 0;
	text-align:center;
	margin-top:30px;
	background:url(../img/bg-column01.png) repeat;
}

#columnHd{
	width:100%;
	margin-bottom:10px;
	background:url(../img/bg-columnhd.png) no-repeat 50% top;
}

#columnHd h3{
	color:#1E9FDF;
	font-size:30px;
	font-weight:bold;
	margin:12px 0;
}

.hdTxt{
	color:#333;
	font-weight:bold;
	font-size:150%;
}
.txt01{
	color:#333;
	font-size:125%;
	line-height:1.8;
}

.tbl{
	width:100%;
	font-size:100%;
	margin-bottom:20px;
}

.tbl th{
	width:182px;
	height:50px;
	color:#fff;
	padding:0 5px;
	vertical-align:middle;
	background:#1D9EDF;
	border:1px solid #1D8CC5;
	border-right:1px solid #fff;
}

.tbl th:last-child{ border-right-color:#1D8CC5;}

.tbl br{ display:none;}

.tbl td{
	height:50px;
	color:#333;
	background:#fff;
	text-align:center;
	vertical-align:middle;
	border:1px solid #1D8CC5;
}

.tbl .thead{
	color:#1E9FDF;
	font-weight:bold;
}

#flow dt{
	color:#333;
	font-size:134%;
	margin:25px 0 10px;
	font-weight:bold;
}

#flow li{
	color:#5D5D5D;
	font-size:125%;
	line-height:1.8;
}

#s-training{
	width:auto;
	padding:20px;
	margin-top:15px;
	background:#FAFBAD;
	border-radius:10px;
}

#s-training h4{
	width:auto;
	min-height:24px;
	margin:0 40px;
	padding:10px 10px 10px 60px;
	line-height:24px;
	border-radius:22px;
	color:#fff;
	font-size:134%;
	font-weight:bold;
	background:#F68AB5 url(../img/icon-straining.png) no-repeat 25px 50%;
}

#s-training h4 br{ display:none;}

#s-training p{
	margin-top:15px;
	font-size:125%;
	color:#333;
	line-height:1.5;
}

#s-training p strong{
	color:#F569A1;
	font-size:16px;
}

#timetableHd{
	display:inline-block;
	line-height:34px;
	padding-left:50px;
	margin-bottom:20px;
	color:#333;
	font-weight:bold;
	font-size:150%;
	background:url(../img/icon-time.png) no-repeat left 50%;
}

#timetable{
	width:auto;
	max-width:690px;
	padding:20px 0;
	margin:30px auto 20px;
	border:3px solid #1E9FE0;
	background:#fff;
}

#timetable dl{
	display:inline-block;
	padding:5px 15px;
}

#timetable dt{
	display:inline-block;
	color:#333;
	font-weight:bold;
	font-size:167%;
	margin-right:10px;
	vertical-align:middle;
}

#timetable dd{
	display:inline-block;
	vertical-align:middle;
	color:#1E9FDF;
	font-weight:bold;
	font-size:125%;
}

#timetable dd strong{
	font-size:125%;
	letter-spacing:1px;
}

.txt02{
	display:inline-block;
	text-align:left;
	color:#5D5D5D;
	font-size:125%;
	line-height:1.8;
}

/*------------------------------------------------------------ 
    MediaQuery 
------------------------------------------------------------*/  


/* TABLET */
@media screen and (max-width: 788px){

#visual div:before{
	width:171px;
	height:93px;
	background-size:171px 93px;
}

#detailHd h2{ font-size:30px;}

#detailHd h2:after{
	width:200px;
	margin:-2px 0 0 -100px;
}

.info1,
.info2,
.info3{
	width:100%;
	float:none;
	margin-bottom:20px;
}

.img1{
	width:190px;
	float:none;
	margin:0 auto;
}
.img2{
	width:177px;
	float:none;
	margin:0 auto;
}
.img3{
	width:100%;
	max-width:359px;
	float:none;
	margin:0 auto;
}

.img4{
	width:100%;
	max-width:260px;
	float:left;
	margin:2% ;
}

.sectionHd h3{ font-size:175%;}
.sectionHd p{ font-size:117%;}

.lead{ font-size:142%;}



}


/* SP */
@media screen and (max-width: 560px){

#visual div{
	padding:50px 10px 50px 58px;
	background-size:38px 38px;
}

#visual strong{ font-size:226%;}
#visual span{ font-size:109%;}

#visual div:before{
	width:114px;
	height:62px;
	right:30px;
	background-size:114px 62px;
}

.sectionHd h3{ float:none;}

.sectionHd p{
	display:inline-block;
	float:none;
	line-height:36px;
	margin:5px 5px 0 0;
}

.tbl{ font-size:109%;}

#s-training h4{
	margin:0;
	padding-left:45px;
	background-position:10px 50%;
	font-size:125%;
}

#s-training h4 br{ display:block;}

#timetable dl{
	display:block;
	padding:5px 0;
}

#timetable dt{ font-size:150%;}
#timetable dd,
#timetable dd strong{ font-size:117%;}

.tbl br{ display:block;}

.img4{
	width:100%;
	max-width:285px;
	float:left;
	margin-top: 2%;
	margin-bottom: 2%;
	margin-right: auto;
	margin-right: auto;
}
}



/*** レスポンシブテーブルデザイン ***/
.shokai{
	width:100%;
	border: 2px solid #d6ceb4;
	overflow: hidden;
	word-break: break-all;
	word-wrap: break-word;
	margin-bottom: 30px;
}
 
.shokai th{
  padding: 15px;
  border-top: solid 1px #ffffff;
  width: 30%;
  overflow: hidden;
  color: #13131e;
  font-style: normal;
  font-weight: bold;
  font-size: 100%;
  text-align: left;
  word-break: break-all;
  word-wrap: break-word;
  vertical-align: top;
  background-color: #eeece4;
}
 
.shokai td{
padding: 15px;
text-align: left;
vertical-align: top;
color: #595960;
background-color: #ffffff;
border-top: dotted 1px #e0dccc;
overflow: hidden;
word-break: break-all;
word-wrap: break-word;
}
 
@media (max-width: 400px){
.shokai th{
  width:100%;
  display:block;
  margin: 0 auto;
  border:none;
  border-radius: 3px;
}
.shokai td{
  display: list-item;
  width: 100%;
  border-top: none !important;
}
}
/*** レスポンシブテーブルデザイン　おわり ***/


/*** イメージリストレスポンシブ ***/
#guideList{
	width:100%;
	max-width:1220px;
	overflow:hidden;
	margin:0 auto;
}

#guideList li{
	width:25%;
	float:left;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding:0 10px 20px;
	margin-top:15px;
}

#guideList #mapArea{ width:50%;}

#guideList .thumb{ overflow:hidden;}
#guideList li img {
    -moz-transition: -moz-transform 0.5s linear;
    -webkit-transition: -webkit-transform 0.5s linear;
    -o-transition: -o-transform 0.5s linear;
    -ms-transition: -ms-transform 0.5s linear;
    transition: transform 0.5s linear;
}
#guideList li img:hover {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.ttl{
	color:#6F5133;
	font-size:117%;
	line-height:1.5;
	font-weight:bold;
	margin:15px 0 10px;
	text-align: center;
}
/*** イメージリストレスポンシブ　おわり ***/


/* menu */

#topMenu{
	width:100%;
	padding:50px 0;
	background:url(../img/bg-menu.png) repeat;
}

#topMenu li{
	width:25.10416%;
	float:left;
	margin-right:12.34376%;
}

#topMenu li:last-child{ margin:0;}

#topMenu p{
	color:#5D5D5D;
	font-size:125%;
	line-height:1.5;
	text-align:center;
	margin-top:10px;
}