@charset "UTF-8";
html,body {
	font: 100%/1.4;
	font-family: Georgia, 'Hoefler Text', 'Times New Roman', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	height: 100%;
	min-height: 100%;
	width: 100%;
	margin: 0 auto;
	position: relative;
	background-color: #fff;
	height:auto;
/*	background: #42413C;*/
}

/*div#wrapperBox {
	padding-bottom: 50px; /*フッタ分
}
*/
body > #container {
    height: auto;
}


/*-------------------- ヘッダとナビメニュー --------------------*/
div#headerBox {
	position:relative;
	width: 100%;
	height: 100px;
	background-color: #ffcfe1;
	z-index: 10000;
	/*影を落とす*/
	box-shadow:0px 0px 3px 3px #cccccc;
	-moz-box-shadow:0px 0px 3px 3px #cccccc;
	-webkit-box-shadow:0px 0px 3px 3px #cccccc;
} 
div.NaviBox {
	position:relative;
	width: 100%;
    background-image: url("../img/common/strp.png");
	padding: 0px;
	margin: 0 auto;
	z-index: 9999;
/*影を落とす*/
	box-shadow:0px 0px 3px 3px #cccccc;
	-moz-box-shadow:0px 0px 3px 3px #cccccc;
	-webkit-box-shadow:0px 0px 3px 3px #cccccc;
}

/*　index.html以外のナビメニュー　*/
div.NaviBox2 {
	position:fixed;
	width: 100%;
    background-image: url("../img/common/strp.png");
	margin: 0 auto;
	z-index: 9999;
/*影を落とす*/
	box-shadow:0px 0px 3px 3px #cccccc;
	-moz-box-shadow:0px 0px 3px 3px #cccccc;
	-webkit-box-shadow:0px 0px 3px 3px #cccccc;
}


/* HEADER CSS ヘッダ固定用　*/
.nav {
  width: 100%;
}
body.is-fixed .nav--typeA {
	position: fixed;
	top: 0;
	left: 0;
	background-image: url("../img/common/strp.png");
	/*影を落とす*/
	box-shadow:0px 0px 3px 3px #cccccc;
	-moz-box-shadow:0px 0px 3px 3px #cccccc;
	-webkit-box-shadow:0px 0px 3px 3px #cccccc;
	z-index:9999;
}

body.is-fixed .header {
  margin-bottom: 30px;
}

/* logo-ss CSS スクロールでlogo_ssを出現させる　*/
#logo-ss {
	width: 96px;
    position: relative;
    top: 0px;
	margin: 0;
	visibility:hidden;
}



/*-------------------- page-topへを出現させる --------------------*/
#page-top {
    position: fixed;
    bottom: 300px;
    right: -30px;
	z-index:999;
}
#page-top a {
    background: #ffcfe1;
    width: 60px;
    padding: 30px 5px;
    display: block;
    border-radius: 5px;
}
#page-top a:hover {
    background: #fab5d2;
}

/*ul.menuarea {
	display:table;
	width:960px;
	height:30px;
	margin:0 auto;
}
ul.menuarea li {
	display:table-cell;
	height:30px;text-align:center;
	vertical-align:middle;
}
*/


/*-------------------- common --------------------*/
/* コンテンツエリアのベースコンテナ */
.container {
/*	float:none;*/
	width: 960px;
	margin: 0 auto;
	z-index:997;
	padding-bottom: 50px; /*フッタ分*/
}

/*0は汎用、1はindexページ専用でwidthが700、2はnewsページ専用でwidthが600*/

.content1 {
	color: #666;
	width: 700px;
	margin-top: 16px;
	padding-top: 10px;
}
.content2 {
	color: #666;
	width: 600px;
	float: center;
	padding: 50px 0;
}
.content0 {
	color: #666;
	width: 960px;
	padding: 50px 0;
	margin: 0 auto;
}



/*
.content ul, .content ol { 
	padding: 0 15px 15px 40px;
}
*/


/*-------------------- index --------------------*/
/* スライダーエリア */
.topslider {
	width: 840px;
	height: 408px;
	margin: 0 auto;
}

/* サイドエリア */
.sidebar1 {
	float: right;
	width: 240px;
	margin-top: 10px;
}

/* snsエリア */
ul.snsarea {
	display:table;
	width:238px;
	height:32px;
	margin-top:0px;
	margin-bottom:8px;	
}
ul.snsarea li {
	display:table-cell;
	width:34px;
	height:32px;
	text-align:center;
}

.tweetBox {
	margin-top: 6px;
	padding-top: 3px;
	border-radius: 6px;
	border: solid #ccc 1px;
	height: 600px;
}


/* メインエリア */
/*.content {
	padding-top: 10px;
	width: 700px;
}
*/


/*-------------------- news --------------------*/
.sidebar2 {
	float: right;
	padding: 80px 0 0 0;
	width: 360px;
}
.contentNews {
	color: #666;
	float: center;
	padding: 40px 0 0 0;
	width: 600px;
}




/*　aboutページ　*/
.contentAbout {
	margin: 0 auto;
	color: #666;
	padding: 40px 0 0 0;
	width: 960px;
}
.aboutTable {
	margin: 0 auto;
	width: 800px;
	font-size:15px;
}
.Frame {
	float: left;
	margin: 0px 20px;
	padding-right: 20px;
	display: inline-block;
	box-shadow: 0px 0px 20px -5px rgba(0, 0, 0, 0.8);
}
.message {
	transform: rotate(-3deg);
	font-size:13px;
	background-color:#FFFFCC;
	padding:15px;
	margin:5px 5px;
	width:350px;
	height:auto;
	float: left;
}



/*　staffページ　*/
.contentStaff {
	padding-top: 40px;
	padding-bottom: 50px;
	margin: 0 auto;
	color: #666;
	width: 960px;
}
.staffTable {
	margin: 0 auto;
	width: 800px;
	font-size:15px;
}

.mainPhoto {
	float:left;
	margin-right:24px;
	margin-left:8px;
	padding-bottom:24px;
}

p.flv {
	color:#ff9db6;
	font-weight:400;
	font-size:20px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
span.flv {
	color:#ff9db6;
	font-weight:400;
	font-size:20px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
span.flv2 {
	color:#999;
	font-size:12px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
span.flv3 {
	color:#CC3366;
}
.prf {
	float:right;
	width:490px;
	height:350px;
	color: #666;
	padding-top:16px;

}
.nameBox{
	margin-bottom: 20px;
	border: 2px solid #f8b5ba;
	border-radius: 12px;        /* CSS3草案 */  
    -webkit-border-radius: 12px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 12px;   /* Firefox用 */  
	background-color:#fbd4cf;
	padding: 10px 20px;
	width: 750px;
}

/*　プロフィールテーブル　*/
table.type06 {
	margin: 20px 10px;
	width: 400px;
	font-size:12px;
	border-collapse: collapse;
	text-align: left;
	line-height: 1;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
table.type06 th {
	font-size:12px;
	width: 100px;
	padding: 8px;
	vertical-align: top;
}
table.type06 td {
	font-size:12px;
	width: 300px;
	padding: 8px;
	vertical-align: top;
	font-weight: bold;
}
table.type06 .even {
	background: #efefef;
}

/*　スタッフインデックスページのテーブル　*/
table.idxPage {
	width: 680px;
	border-collapse: collapse;
	text-align: left;
}
table.idxPage td {
	font-size:12px;
	font-weight: bold;
	width: 180px;
	height: 180px;
	padding: 4px;
	vertical-align:middle;
}


/* メニュー　*/
.contentMenu {
	margin: 0 auto;
	color: #666;
	position: relative;
	padding-top: 40px;
	padding-bottom: 50px;
	width: 960px;
}
.menuTable {
	margin: 0 auto;
	width: 800px;
	font-size:15px;
}

/*3分割*/
.menuTable {
	margin: 0 auto;
	width: 800px;
	font-size:14px;
}


ul.menuTable {
	display:table;
	width:800px;
}
ul.menuTable li {
	display: table-cell;
	font-size: small;
	width: 266px;
	text-align:center;
	vertical-align: middle;
}


/*　accessページ　*/
.contentAccess {
	padding-top: 40px;
	padding-bottom: 50px;
	margin: 0 auto;
	color: #666;
	width: 960px;
}
.accessTable {
	margin: 0 auto;
	width: 800px;
	font-size:15px;
}
.navigation {
	width: 400px;
	float: right;
	font-size:12px;
}



/*　会社概要ページ　*/
.contentCompany {
	padding-top: 60px;
	padding-bottom: 50px;
	margin: 0 auto;
	color: #666;
	width: 960px;
}
.companyTable {
	font-size:14px;
	margin: 0 auto;
	width: 800px;
}

.tabletable {
	width:600px;
	margin: 0 auto;
	padding-top:10px;
	padding-bottom:50px;	
}

table.company {
	margin: o auto;
	border-collapse: collapse;
	width:600px;
	font-size:13px;
}
table.company th.t_top {
    border-top: #ffcfe1 4px solid;
	width:130px;
}
table.company th {
	border-bottom: #e3e3e3 1px dotted;
	text-align: left;
	padding: 10px;
	font-weight: normal;
}
table.company td.t_top {
	border-top: #ccc 4px solid;
}
table.company td {
	border-bottom: #e3e3e3 1px dotted;
	text-align: left;
	padding: 10px;
}
.callme {
	background-color:#eee;
	border: 1px solid #ccc;
	font-size:16px;
	width:350px;
	margin: 16px auto;
	padding:20px;
	text-align:center;
}

/*スタッフ募集*/
.hitsuyou {
	width:350px;
	background-color:#EEEEEE;
	margin-top:1em;
	margin-bottom:1em;
	padding:16px;
}
dl.recruit {
	color: #666;
}
dl.recruit dt {
	font-weight: bold;
}
.mailme {
	text-align:center;
	width:450px;
	background-color:#EEEEEE;
	margin-top:1em;
	margin-bottom:1em;
	padding:16px;
}

/*めいりっこ*/
.dot {
	border-bottom: 2px #ff9db6 dashed;
	padding-left: 16px;
	padding-bottom: 2px;
	padding-top: 1em;
}
dl.mai {
	color: #666;
}
dl.mai dt {
	paddin-top:1em;
	font-weight: bold;
}
dl.mai dd {
	margin-bottom: 0.3em;
}




/* ~~ エレメント / タグセレクター ~~ */
ul, ol, dl {
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4, h5, h6, p {
	font-family: Georgia, 'Hoefler Text', 'Times New Roman', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', sans-serif;
	margin-top: 0;	 /* 上マージンを削除すると、マージンを含む div からマージンがはみ出す場合があるという問題を回避できます。残った下マージンにより、後続のエレメントからは離されます。 */
	padding-right: 15px;
	padding-left: 15px; /* div 自体ではなく div 内でエレメントの両側に余白を追加すると、ボックスモデル計算が不要になります。代わりに、両側に余白を指定した div をネストして使用することもできます。 */
}
h2.title {
	border-bottom: 1px #ccc dashed;
	border-left: 8px #ff9db6 solid;
	padding-left: 16px;
	padding-bottom: 2px;
	padding-top: 2px;
}
h3.title {
	border-bottom: 1px #ccc dashed;
	border-left: 6px #cccccc solid;
	padding-left: 16px;
	padding-bottom: 1px;
	padding-top: 1px;
}
.note {
	border: 1px #C0C0C0 solid;
	margin: 5px 5px;
	padding: 2px 20px;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	width:auto;
	box-shadow:0px 0px 2px -2px #cccccc;
	-moz-box-shadow:0px 0px 2px -2px #cccccc;
	-webkit-box-shadow:0px 0px 2px -2px #cccccc;
	float: left;
}
.note1 {
	font-size:14px;
	border-bottom: 1px #ADD8E6 dashed;
	padding: 2px 8px;
	font-weight:bold;
}
.note2 {
	font-size:14px;
	border-bottom: 1px #ADD8E6 dashed;
	padding: 2px 8px;
}



a img {
	border: none;
}
a:link {
	color: #42413C;
	text-decoration: underline;
}
a:visited {
	color: #6E6C64;
	text-decoration: underline;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}

hr.m {
	width:400px;
    border: 0;
    border-bottom: 1px dashed #ccc;
	margin-top: 15px;
}
hr.cup {
	height: 50px;
	background: transparent url("../img/common/scup.png") repeat-x center center;
	border: none;
}




/* ~~ レイアウトに使用するカラムです。~~ 

1) 余白は、div の上部または下部にのみ配置されます。これらの div 内のエレメントには、それ自体に余白があるので、ボックスモデル計算を行う必要がありません。ただし、div 自体に両側の余白やボーダーを指定した場合、その値が加算されたものが合計幅になることに注意してください。div 内のエレメントの余白を削除し、さらにその div 内に、全体のデザインに必要な幅や余白を指定していない 2 つ目の div を追加することもできます。

2) カラムはすべてフロートしているため、マージンは指定されていません。マージンを追加する必要がある場合は、フロート方向には指定しないでください (例えば、右フロートに設定した div の右マージン)。多くの場合、代わりに余白を使用できます。このルールに従わない場合は、div のルールに「display:inline」宣言を追加し、一部のバージョンの Internet Explorer でマージンが 2 倍になるバグを回避する必要があります。

3) クラスはドキュメント内で複数回使用できるので (またエレメントには複数のクラスを適用できます)、カラムには ID ではなくクラス名が割り当てられます。例えば、必要に応じて 2 つのサイドバー div をスタックできます。クラスを各ドキュメントで一度しか使用しないのであれば、ユーザーの好みに応じて、クラス名を ID に変更することができます。

4) ナビゲーションを右ではなく左に配置したい場合、これらのカラムを反対方向にフロートさせると (すべて右方向にする代わりに、すべて左方向に設定)、反転してレンダリングされます。HTML ソース内で div を移動する必要はありません。

*/




/* ~~ その他の float/clear クラス ~~ */
.fltrt {  /* このクラスを使用すると、ページ内でエレメントを右にフローティングさせることができます。フローティングさせるエレメントは、ページ内で横に並べて表示するエレメントの前に指定する必要があります。 */
	float: right;
	margin: 0px 8px 0px 8px;
}
.fltlft { /* このクラスを使用すると、ページ内でエレメントを左にフローティングさせることができます。フローティングさせるエレメントは、ページ内で横に並べて表示するエレメントの前に指定する必要があります。 */
	float: left;
	margin: 0px 8px 0px 8px;
}


/* フロートクリアの呪文　*/
.clear { clear:both; }  
.clear hr { display:none;} 

.clearfloat { /* このクラスは、#footer が #container から削除されているか取り出されている場合に、<br /> または空の div で、フローティングさせる最後の div に続く最後のエレメントとして (#container 内に) 配置できます。 */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}


dl.info {
	color: #666;
	margin-top: 10px;
	margin-bottom: 2em;
}
dl.info dt {
	font-weight: bold;
	margin-bottom: 0.5em;
	margin-top:20px;
	font-size:15px;
}
dl.info dd {
	margin-bottom: 1em;
	font-size:14px;
}


dl.news {
	color: #666;
	margin-top: 10px;
	margin-bottom: 2em;
}
dl.news dt {
	font-weight: bold;
	margin-bottom: 0.5em;
	margin-top:20px;
	font-size:15px;
	margin-left: 20px;
	padding-top: 40px;
}
dl.news dd {
	margin-bottom: 1em;
	font-size:14px;
	margin-bottom: 0.5em;
}


dl.info2 {
	color: #666;
	margin-top: 10px;
	margin-bottom: 2em;
	font-size:13px;
}
dl.info2 dt {
	font-weight: bold;
	margin-bottom: 0.5em;
	margin-top:20px;
}
dl.info2 dd {
	margin-bottom: 1em;
}

.caption {
	width:auto;
	min-height:150px;
	margin:0;
}
.caption2 {
	width:auto;
/*	min-height:150px;*/
	margin:0;
}











div#containerBox    {  
    width: 580px;  
}  
div#containerBox:after  {  
    height: 0;  
    visibility: hidden;  
    content: ".";  
    display: block;  
    clear: both;  
}  
div#mainBox {  
    float: right;  
    width: 390px;  
    background: #FC9;  
    padding: 120px 5px;  
}  
div#subBox  {  
    float: left;  
    width: 150px;  
    background: #09F;  
    padding: 120px 5px;  
}  
div#footerBox   {  
    width: 550px;  
	padding: 10px 0;
	background-image: url("../img/common/strp.png");
	position: relative;/* IE6 に、適切にクリアするための hasLayout を指定します。 */
	clear: both; /* この clear プロパティにより .container は、カラムの範囲がどこまでかを認識してその範囲を含めるようになります。 */
}


div#carousel {
	width: 928px;
	height: auto;
	padding-top: 8px;
	padding-bottom: 8px;
	border: solid #EEE;
	border-width: 1px 16px;
}

div.footer-banner {
	padding: 10px 0;
	position: relative;
}
ul.footer-banner {
	display:table;
	width:960px;
	height:112px;
}
ul.footer-banner li {
	display:table-cell;
	width:316px;
	height:112px;
	text-align:center;
	vertical-align:middle;
}

.footer {
	padding: 10px 0;
	background-image: url("../img/common/strp.png");
	position: absolute;  /* フッターを絶対配置に指定する設定 */
    bottom: 0;           /* フッターを一番下に置くぜ！ */
    width: 100%;
    height: 20px; 
/*	position: relative;/* IE6 に、適切にクリアするための hasLayout を指定します。 */
/*	clear: both; /* この clear プロパティにより .container は、カラムの範囲がどこまでかを認識してその範囲を含めるようになります。 */
}