@charset "utf-8";
/* ====================================================================== */
/* スインクハート　CSS                                                    */
/* ====================================================================== */

/* ---------------------------------------------------------------------- */
/* HTML5新要素でブロックボックスとしてレンダリングさせる要素に対する指定  */
/* ---------------------------------------------------------------------- */
article,aside,canvas,details,figcaption,figure,header,footer,hgroup,menu,nav,section,summary {
	display: block
}

/* ---------------------------------------------------------------------- */
/* 基本設定                                                               */
/* ---------------------------------------------------------------------- */
* {
	margin:0;
	padding:0;
}

body {
	color:#333;
	background:#EEEEEE;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:0.8em;
	font-weight: bold;
	/* tion-count: 5; */
	
}


/* テキスト */
p {
	line-height:160%;
}

/* リンク */
a:link {
	color:#0e1bbb;
}

a:visited {
  color:#660099;
}

a:active {
	color:#0e1bbb;
}

a:hover {
  color:#0066FF;
}

a {
	outline:none;
}

a img {
	border:0;
	animation-name: fade;
  animation-duration: 5s;
  
}


/* ---------------------------------------------------------------------- */
/* 構成                                                                   */
/* ---------------------------------------------------------------------- */

/* ヘッダー ------------------------------------------------------------- */
header {
	width:100%;
	background:#333333;
}

header #site_header {
	width:950px;
	margin:0 auto;
	padding:10px 0 10px 0;
}


/* BODY ----------------------------------------------------------------- */
#main {
	width:950px;
	margin:0 auto;
}

#main #contents {
	width:400px;
	margin:0 auto;
	float:center;
}

#main #menu {
	width:230px;
	float:left;
	margin:-37px 0 0 0;
}






/* フッター ------------------------------------------------------------- */
footer {
	clear:both;
	width:100%;
}

footer #site_footer {
	width:950px;
	margin:0 auto;
}




/* ---------------------------------------------------------------------- */
/* ヘッダー                                                               */
/* ---------------------------------------------------------------------- */
#site_header h1 {
	color:#FFF;
	font-size:0.85em;
	font-weight:normal;
	margin:0 0 0 250px;
}




/* ---------------------------------------------------------------------- */
/* フッター                                                               */
/* ---------------------------------------------------------------------- */
#site_footer {
	clear:both;
	width:700px;
	margin:30px 0 0 0;
	padding:20px 0 0 0;
	background:url(../img/footer_line.gif) top left no-repeat;
}

/* 社名 */
#site_footer .company_name {
	width:430px;
	margin:0 0 10px 0;
	float:left;
	font-size:0.85em;
}

#site_footer .company_name p {
	margin:0 0 10px 0;
}

#site_footer .company_name .name {
	font-weight:bold;
}

/* グループロゴ */
#site_footer .mtlgroup {
	width:500px;
	float:right;
}

#site_footer .mtlgroup img {
	margin:0;
}

#site_footer .mtlgroup ul {
	width:500px;
	margin:0;
}

#site_footer .mtlgroup ul li {
	float:left;
	border:none;
	margin:0 5px 0 0;
	list-style:none;
}

/* プライバシーポリシー */
#site_footer .privacy {
	clear:both;
	width:400px;
	margin:0 0 20px 0;
	float:left;
	font-size:0.85em;
}

/* コピーライト */
#site_footer address {
	width:400px;
	margin:0 0 20px 0;
	float:right;
	text-align:right;
	font-style:normal;
	font-size:0.85em;
}



/* ---------------------------------------------------------------------- */
/* コンテンツ：右部分                                                     */
/* ---------------------------------------------------------------------- */
/* ページタイトル */
#contents h2 {
	width:700px;
	padding:40px 0;
	background:url(../img/pgtitle_line.gif) bottom left no-repeat;
	text-align:right;
}

/* 見出し */
#contents h3 {
	clear:both;
	width:685px;
	background:url(../img/tit_back.gif) top left no-repeat;
	border-bottom:solid 1px #CCCCCC;
	padding:10px 0 5px 15px;
	margin:30px 0 20px 0;
}

/* 文字おおきく */
#contents .txtbig {
	font-size:1.3em;
}

/* 太文字 */
#contents .txtbold {
	font-weight:bold;
}

/* 赤字 */
#contents .red {
	color:#DF1748;
}

/* リスト */
#contents ul {
	margin:0 10px;
}

#contents ul li {
	list-style:none;
	background:url(../img/ico02.gif) 0px 7px no-repeat;
	padding:0 0 0 13px;
	margin:0 0 10px 0;
	line-height:160%;
}

/* 左寄せ */
#contents .left {
	float:left;
	margin:0 15px 15px 0;
}

/* 右寄せ */
#contents .right {
	float:right;
	margin:0 0 15px 15px;
}

/* パンくずリスト */
#contents #panlist {
	width:700px;
	margin:15px 0;
	float:left;
	font-size:0.8em;
	color:#999;
}

#contents #panlist li {
	list-style:none;
	background:none;
	padding:0;
	line-height:100%;
	float:left;
}

#contents #panlist li a {
	color:#999;
}

#contents #panlist li+li {
	margin:0 0 0 15px;
	padding:0 0 0 15px;
	background:url(../img/ico_panlist.gif) 0px 2px no-repeat;
}

/* ページの先頭に戻る */
#contents .pgtop {
	clear:both;
	width:700px;
	text-align:right;
	margin:20px 0;
}

/* トップページ追加スタイル */
#toplogo h2 {
	font-size: 1.5rem;
	clear: both;
}

#toplogo h2 span {
	font-size: 0.8rem;
	clear: both;
}

@media screen and (max-width:640px){
	
	#contents h3 {
	clear:both;
	width:100%;
	background:url(../img/tit_back.gif) top left no-repeat;
	border-bottom:solid 1px #CCCCCC;
	padding:10px 0 5px 15px;
	margin:30px 0 20px 0;
}
	
	#contents .pgtop {
	clear:both;
	width:100%;
	text-align:right;
	margin:20px 0;
}
	
	
}


/* ---------------------------------------------------------------------- */
/* コンテンツ：左メニュー部分                                             */
/* ---------------------------------------------------------------------- */
/* メニュー */
#menu ul {
	margin:20px 0 0 0;
	list-style:none;
}

#menu ul li {
	margin:0;
}

/* お問合せ */
#menu #side_contact {
	width:197px;
	background:#FFF;
	border:solid 1px #D2D2D2;
	border-right:solid 2px #D2D2D2;
	border-bottom:solid 2px #D2D2D2;
	margin:30px 0;
	padding:30px 15px 20px 15px;
}

#menu #side_contact p {
	margin:15px 0;
}

#menu #side_contact p a {
	margin:0;
	padding:0 0 0 13px;
	background:url(../img/ico01.gif) 0px 5px no-repeat;
}

#contents section h2{
	text-align: center;
}
section img{
	width: 100%;
	height: auto;
}



/*
@media以外の所は全てのサイズで読み込まれます。
*/

@media screen and (max-width: 480px) {
input,
textarea {
	max-width: 400px !important;
}
	/*　画面サイズが480pxまではここを読み込む　*/
	#contents section video{
		width: 100% !important;
	}
	#contents {
	width: 100% !important;
	display: block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#menu {
	width: 100% !important;
	display: block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float:center;
}
	

		
  }










@keyframes fade{
	0%{
	  opacity: 0;
	}
	100%{
	  opacity: 1;
	}
  }