@charset "shift_jis";

/* CSS Document charm2/style.css
ランディングページのcssは全てここで設定
 */


/* -------------------------------------------------------------------
基本設定
------------------------------------------------------------------- */

* {
	margin: 0px;
	padding: 0px;
}


/* 基本フォント */

body,td,th,p,address,h1,h2,h3,h4,h5,h6,li,dt,dd {
	color: #000000;
	font: normal normal normal 14px/1.45em "ＭＳ Ｐゴシック", Osaka, sans-serif;
	letter-spacing: 0.1em;
}

body,div,table,td,th,p,address,h1,h2,h3,h4,h5,h6,li,dt,dd,form,select,input,img {
	margin: 0px;
	padding: 0px;
}

/* 基本タグ */

body {
	text-align: center;
	margin: 0;
	padding: 0;
}

img,table {
	border: none;
}

ul {
	list-style: none;
}

table td {
	vertical-align: top;
}

.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block; }
/*\*/
* html .clearfix { height:1%; }
.clearfix { display:block; }
/**/

/* 基本テキストリンク */

a:link {
	color: #000000;
	text-decoration: underline;
}
a:visited {
	color: #000000;
	text-decoration: underline;
}
a:hover {
	color: #000000;
	text-decoration: underline;
}
a:active {
	color: #000000;
	text-decoration: underline;
}

.idt {
	text-indent: -9999px;
	color: #FFFFFF;
	font-size: 1px;
}

/* カラーテキスト */

p span {
	color:#835300;
	font-weight: bold;
}

#box05 p span {
	color:#c58025;
	font-weight: bold;
}

/* -------------------------------------------------------------------
レイアウト
------------------------------------------------------------------- */

.wrap,
#hd .container,
#ft .container {
	width: 840px;
	margin: 0 auto;
	text-align: left;
	clear: both;
}

#main,
#btn,
#box01,
#box02,
#box03,
#box04,
#box05 {
	width: 840px;
	text-align: left;
	clear: both;
}


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

#hd {
	background: #f5ebd9;
}

#hd .left {
	width: 329px;
	float: left;
}

#hd .right {
	width: 341px;
	float: right;
}

/* -------------------------------------------------------------------
メイン
------------------------------------------------------------------- */

#main {
	background: url(../images/main_bg.jpg) no-repeat left top;
	position: relative;
	height: 468px;
}

#main .txt01 {
	position: absolute;
	left: 112px;
	top: 28px;
}

#main .txt02 {
	position: absolute;
	right: 0px;
	top: 22px;
}

#main .txt03 {
	position: absolute;
	left: 100px;
	top: 182px;
}

#main .txt04 {
	position: absolute;
	right: 99px;
	top: 182px;
}

#main .txt05 {
	position: absolute;
	left: 0px;
	top: 267px;
	background: url(../images/main_txt05.png) no-repeat 0 0;
	width: 840px;
	height: 80px;
}

#main .txt06 {
	position: absolute;
	left: 118px;
	bottom: 0px;
}

/* -------------------------------------------------------------------
メインボタン
------------------------------------------------------------------- */

#mainbtn {
	background: url(../images/main_btn_bg.gif) no-repeat left top;
	padding: 0 0 31px 0;
}

#mainbtn .container {
	width: 665px;
	margin: 0 auto;
}

#mainbtn .container a {
	background: url(../images/main_btn.jpg) no-repeat left top;
	width: 665px;
	height: 113px;
	display: block;
	overflow: hidden;
}

#mainbtn .container a:hover {
	background: url(../images/main_btn.jpg) no-repeat left bottom;
}


/* -------------------------------------------------------------------
BOX01
------------------------------------------------------------------- */

#box01 {
	margin: 0 0 50px 0;
}

#box01 h2 {
	background:url(../../../charm3/common/images/120919/box01_ttl.jpg);
	width: 840pd;
	height: 50px;
}

#box01 .container {
	padding: 31px 0px 0px 0px;
}

#box01 .container div.bg {
	background: url(../../../charm3/common/images/120704/box01_bg.jpg) no-repeat left top;
	padding: 0 0 30px 429px;
	height:282px;
}

#box01 .container div table {
	margin: 15px 0 0px 0;
}

#box01 .container div table td.right {
	padding: 0 0 0 11px;
}

/* -------------------------------------------------------------------
BOX02
------------------------------------------------------------------- */

#box02 {
	margin: 0 0 30px 0;
}

#box02 h2 {
	background: url(../../../charm3/common/images/120919/box02_ttl.jpg) no-repeat left top;
	width: 840pd;
	height: 50px;
}

#box02 .container {
	padding: 0px 0px 0px 0px;
}

#box02 .container div.bg {
	background: url(../../../charm3/common/images/120704/box02_bg.jpg) no-repeat center 175px;
}

#box02 .container p.sub {
	text-align: center;
	margin: 0 0 7px 0;
}

#box02 .container p.txt {
	padding: 0 0 521px 0;
	margin: 0 0 33px;
}

#box02 .container .nfd {
	margin: 0 0 20px 0;
}

#box02 .container .nfd .line {
	border: 1px solid #edd7b2;
	padding: 18px 30px 18px 29px;
}

#box02 .container .nfd td.txt p {
	padding: 0 25px 0px 0;
}

#box02 .container .nfd td.txt p.prg {
	padding: 15px 25px 20px 0;	
}

/*ボタン*/
#box02 #btn .container,
#box05 #btn .container {
	width: 665px;
	margin: 0 auto;
	padding: 0;
}

#btn .container a {
	background: url(../images/btn.jpg) no-repeat left top;
	width: 665px;
	height: 113px;
	display: block;
	overflow: hidden;
}

#btn .container a:hover {
	background: url(../images/btn.jpg) no-repeat left bottom;
}

/* -------------------------------------------------------------------
BOX03
------------------------------------------------------------------- */

#box03 {
	margin: 0 0 75px 0;
}

#box03 h2 {
	background: url(../../../charm3/common/images/120919/box03_ttl.jpg) no-repeat left top;
	width: 840pd;
	height: 50px;
}

#box03 .container {
	padding: 30px 25px 0;
	text-align: center;
}

#box03 .container p.txt {
	margin: 0 0 20px 0;
	text-align: left;
}

#box03 .container div.bg {
	background: url(../../../charm3/common/images/box03_bg.jpg) no-repeat center top;
	height: 446px;
	width: 762px;
	text-align: left;
	position: relative;
	margin: 0 auto;
}

#box03 .container div.bg p.txt01 {
	position: absolute;
	left: 255px;
	top: 198px;
}

#box03 .container div.bg p.txt02 {
	position: absolute;
	right: 15px;
	top: 198px;
}

#box03 .container div.bg p.txt03 {
	position: absolute;
	left: 0px;
	bottom: 0px;
}

#box03 .container div.bg p.txt04 {
	position: absolute;
	left: 255px;
	bottom: 0px;
}

#box03 .container div.bg p.txt05 {
	position: absolute;
	right: 9px;
	bottom: 0px;
}

/* -------------------------------------------------------------------
BOX04
------------------------------------------------------------------- */

#box04 {
	margin: 0 0 70px 0;
}

#box04 h2 {
	background: url(../../../charm3/common/images/120919/box04_ttl.jpg) no-repeat left top;
	width: 840pd;
	height: 50px;
}

#box04 .container {
	padding: 30px 25px 0;
}

#box04 .container .name01 {
	background: url(../../../charm3/common/images/120704/box04_bg01.jpg) no-repeat left top;
	padding: 0 0 39px 223px;
	min-height:250px;
	height: auto !important;
	height: 250px;
}

#box04 .container p.txt {
	margin: 10px 0 0 0;
}

#box04 .container .line {
	background:url(../images/box04_line.gif) repeat-x left bottom;
}

#box04 .container .name02 {
	background: url(../../../charm3/common/images/box04_bg02.jpg) no-repeat right top;
	padding: 0 223px 0px 0;
	min-height:250px;
	height: auto !important;
	height: 250px;
	margin: 30px 0 0 0;
}

#box04 .container p.txt {
	margin: 10px 0 0 0;
}


/* -------------------------------------------------------------------
BOX05
------------------------------------------------------------------- */

#box05 {
	padding: 0 0 5px 0;
}

#box05 h2 {
	background: url(../images/box05_ttl.gif) no-repeat left top;
	width: 840pd;
	height: 50px;
}

#box05 .container {
	padding: 30px 25px 40px;
}

#box05 .container div.bg {
	background: url(../images/box05_bg.jpg) no-repeat left top;
	padding: 0 0 0 324px;
	min-height:418px;
	height: auto !important;
	height: 418px;
}

#box05 .container .line_w {
	width: 466px;
	margin: 0 0 26px 0;
}

#box05 .container .line {
	border: 1px solid #ecaa53;
	padding: 25px 21px 25px 13px;
}

#box05 .container p.txt {
	margin: 0 0 15px 0;
	padding: 0 10px;
}

#box05 #btn {
	margin: 0 0 20px;
}

.txtlink {
	/*
	text-align: right;
*/
}

.txtlink a {
	background: url(../images/icon.gif) no-repeat left .05em;
	padding: 0 0 0 8px;
	font-size: 12px;
}

/* -------------------------------------------------------------------
フッター
------------------------------------------------------------------- */

#ft {
	background: #f5ebd9;
	text-align: center;
}

/* -------------------------------------------------------------------
訓練基金バナー追加
------------------------------------------------------------------- */
div.banner_kikin{
	margin:10px 25px;
}


/* -------------------------------------------------------------------
charm3 index
------------------------------------------------------------------- */

#main02 {
	background: url(../../../charm3/common/images/main_bg.jpg) no-repeat left top;
	position: relative;
	height: 468px;
}

#main02 .txt01-2 {
	position: absolute;
	left: 193px;
	top: 44px;
}

#main02 .txt03-2 {
	position: absolute;
	left: 100px;
	top: 210px;
}


#main02 .txt04-2 {
	position: absolute;
	right: 99px;
	top: 210px;
}

#main02 .txt05-2 {
	position: absolute;
	left: 0px;
	top: 295px;
	background: url(../images/main_txt05.jpg) no-repeat 0 0;
	width: 840px;
	height: 80px;
}

/* -------------------------------------------------------------------
メインボタン charm3
------------------------------------------------------------------- */
/*
#mainbtn02 {
	padding: 0 0 0px 0;
}
*/

#mainbtn02 .container {
	width: 600px;
	margin: 0 auto;
}

#mainbtn02 .container a {
	background: url(../../../charm3/common/images/btn_request.gif) no-repeat left top;
	width: 600px;
	height: 60px;
	display: block;
	overflow: hidden;
}

/*
#mainbtn02 .container a:hover {
	background: url(../../../charm3/common/images/main_btn.jpg) no-repeat left bottom;
}
*/

/* -------------------------------------------------------------------
体験バナー charm3
------------------------------------------------------------------- */


div.bg_banner_taiken{
	padding: 30px 0 50px 0;
	background: url(../images/main_btn_bg.gif) no-repeat left top;
	}
	
div.bg_banner_taiken02{
	padding: 10px 0 10px 0;
	}
	
	
div.banner_taiken{
	width: 500px;
	margin: 0 auto;
}

div.banner_taiken02{
	width: 748px;
	margin: 0 auto;
}

div.banner_gekitoku{
	text-align:center;
	margin:20px;
}


/* -------------------------------------------------------------------
先生画像 charm3
------------------------------------------------------------------- */


#box05 .container div.bg02 {
	background: url(../../../charm3/common/images/box05_bg.jpg) no-repeat left top;
	padding: 0 0 0 324px;
	min-height:418px;
	height: auto !important;
	height: 418px;
}

/* -------------------------------------------------------------------
charm4
------------------------------------------------------------------- */
/*
#mainbtn02 {
	padding: 0 0 0px 0;
}
*/

div.btn-charm04{
	width: 600px;
	margin: 0 auto;
}


div.btn-charm04 a:hover
{

 opacity:0.8;
 filter:alpha(opacity=80);
 -ms-filter: “alpha( opacity=80 )”;
 }
 
div.mgb15{
	margin-bottom:15px;
}

div.mgb20{
	margin-bottom:20px;
} 

/* -------------------------------------------------------------------
体験バナー charm5
------------------------------------------------------------------- */


div.banner_taiken a:hover img{
 opacity:0.8;
 filter:alpha(opacity=80);
 -ms-filter: “alpha( opacity=80 )”;
 }

div.wd840{
	width:840px;
}

div.wd420{
	width:420px;
}


div.f-left{
	float:left;
}

div.f-right{
	float:right;
}