@charset "utf-8";""

/*===============
	base
=================*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
form,input,p,blockquote,th,td {
	margin:0;
	padding:0;
} 
 
img{
	border:0;
	vertical-align: top;
}

body {
	color:#333;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	background:#fff;
    margin: 0;
    padding: 0;
    }
	
.wrap{
	width:980px;
	margin:0px auto;
	text-align:left;
	overflow: hidden;
}

a:hover img {
	-moz-opacity:0.5;
	opacity:0.5;
	filter:alpha(opacity=50);
}
	
/*==========================
	layout関連
==========================*/

header h1{
	float:left;
	margin:0 0 0 0;}

.subnavi{
    float:right;
	margin: 0;
	padding-right: 10px;}

.mainphoto2{
	clear:both;
	margin:10px 0 0 0;
    
}

.content{
	float:left;
	width:680px;
	margin:0;
}
	
.sidebar{
	float:right;
	width:270px;
	margin:10px 0 10px 20px;}
	
footer{
	clear:both;
	color:#fff;
	background-image:url(../images/bottombar.png);
	margin:0px;
	padding:5px;
	text-align:center;}

.pankuzu{
	margin:5px 0 5px 15px;
	font-size:80%;
}


/*-----------------------------
	サブナビゲーションの指定
------------------------------*/

.subnavi li{
	padding-left: 90px;
	margin:0 20px 5px 0;
	list-style:none;}

.subnavi li a{
	background:url(../images/bg_sbunavi.png) no-repeat 0 50%;
	padding-left:10px;
	color:#069;
	text-decoration:none;}

.subnavi li a:hover{
	color:#f60;
	text-decoration:underline;}



/*----------------------------
	グローバルナビゲーション
-----------------------------*/

ul.menu{clear:both;
	margin:0px;
	padding:0px;
	list-style:none;}
	
ul.menu li{float:left;
	position: relative;
	line-height: 30px;
}
	
ul.menu li a{
	text-align: center;
	padding: 0.5em 0;
	width:160px;
	height:30px;
	display:block;
	text-decoration: none;
	font-weight: bold;
	color: #fff;
	background-color: #2ee68a;}
	
ul.menu a:hover{
	background-color: #12b051;}

ul.submenu{
	z-index: 100;
	display: none;
	position: absolute;
	padding: 0;
	list-style:none;}

ul.submenu li a{
    display: block;
    color: #fff;
}

ul.submenu li a:hover{
	background-color: #12b051;}



/*================================
 	メインエリア
 =================================*/

h2{color:#fff;
	background-image:url(../images/bar.png);
	background-repeat:repeat-x;
	width:680px;
	margin-top:10px;
	padding:20px 0 10px 20px;
	font-size:120%;
	}
	

/*---------------------------------
 topページ用
 --------------------------------*/

.header-logo{
    color: #ffffff;
}

/*--新着情報--*/
.frame_wrap{
    width: 660px;
    height: 500px;
    margin: 20px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    display: inline-block;
    margin: 10px;
}

.frame{
    width: 100%;
    height: 100%;
    border: none;
    display:block;
}

/*--募集中の訓練--*/

td p{text-align: center;
	margin: 8px;}

	
/*------------------------
 会社概要用
 -----------------------*/

.aisatu{
	line-height: 200%;
	margin:20px;
}

.aisatu p{
	text-indent: 1em;
}

.name{
	text-align: right;
}


.table{
	margin-left: auto;
	margin-right: auto;
	margin-top:20px;
	margin-bottom:20px;
	border: 1px solid #000;
	border-collapse: collapse;
	}

.th{
	width:100px;
	padding:10px;
	background-color:#ccc;
	}

.td{
	padding:10px;	
}


/*-------------------------
 職業訓練
 -------------------------*/

.midasi{
	color:#333333;
	background-image: url(../images/kunren/h3.gif);
	background-repeat:no-repeat;
	width: 680px;
	height: 50px;
	padding: 15px 0 0 45px;
}


/*----------------------------------
講座・資格試験
 -----------------------------------*/

.th2{
	padding:10px;
	background-color: #6495ED;
	text-align: center;
	color: #ffffff;
	}

.td2{
	padding:10px;
	background-color: #F0F8FF;
}

.td3{
	padding:10px;
	background-color: #E6E6FA;
}


/*=========================
 	sidebar
 =========================*/

.barbox{margin:10px 0 5px 10px;}


.kanri{
	color:#ffffff;
}
.sidebar a{
	text-decoration:none;
}


/*=========================
 	footer
  ======================= */

footer ul{list-style:none;}

footer li{display: inline;
	padding-left:5px;
	padding-right:5px;
	border-right: 1px solid #ffffff;
	font-size:80%;}

footer li a{color:#fff;}

footer li a:hover{color: #0000CD;}

footer address{color:#fff;
	margin-bottom:30px;
	text-decoration: none;
	font-style: normal;}
	
/*============================
 	サイトマップ用
 ===========================*/

.sitemap{
	width: 950px;
	height: auto;
	float: left;
	padding-top: 0px;
}

.sitemap h2{
	color:#fff;
	background-image:url(../images/bar.gif);
	background-repeat:repeat-x;
	width:940px;
	margin-top:10px;
	padding:20px 0 10px 20px;
	font-size:13pt;
}

.sitemapbox{
	width: 450px;
	height: auto;
	float: left;
	padding-top: 10px;
	padding-left:50px;}

.sitemapbox p{
	margin: 10px 0 10px 0;
	font-weight: bold;
}

.sitemapbox ul{
	padding-left: 30px;
	font-size: 90%;
}

.sitemapbox2{
	width: 420px;
	height: auto;
	float: left;
	padding-top: 10px;
	padding-left:15px;}

.sitemapbox2 p{
	margin: 10px 0 10px 0;
	font-weight: bold;
}

.sitemapbox2 ul{
	padding-left: 30px;
	font-size: 90%;
}



/*============================
 	メディアクエリ
 ===========================*/
/*960px以下の場合*/

@media screen and (max-width:960px){
    
    body{
        margin: 0px;
        text-align: center;
    }
    
    header h1{
        float: none;
    }
   img{
        max-width:  100%;
       height: auto;
    }
    table img{
        max-width: 100%;
        height: auto;
    }
    h2{
	max-width: 100%;
      }
    
    .subnavi{
        float: none;
        max-width:  100%;
	margin: 0;
    }
    
    nav ul{
        text-align: left;
        padding: 0;
    }
    
    
    .article img{
        max-width: 100%;
    }

    .mainphoto ul li img{
        max-width: 100%;
    }
    
     .sidebar img{
        max-width: 100%;
    }
    
    .mainphoto2 img{
		max-width: 100%;
    }
    
    .wrap{
        width: auto;
    }
    
    section p img{
        float: none;
        max-width: 100%;
    }
    
    .content{
	   max-width: 100%;
        clear: both;
    }
    
    .sidebar{
	   max-width: 100%;
        float: left;     
    }
        
    .swiper-container{
        max-width: 100%;
    }
}

/*600px以下の場合*/

@media screen and (max-width:600px){
    
    body{
        font-size: 80%;
    }

    .subnavi{
    display:none;
}

    img {
        width:100%;
        max-width: 100%;
        height: auto;
    }


    
    ul.menu li a{
        max-width: 100px;
        height: auto;
    }
    
    .frame_wrap{
    max-width: 90%;
    font-size: 75%;
    }
    
    
    footer{
        max-width: 100%;
        font-size: 70%;
    }
}