@charset "UTF-8";
/* CSS Document */

a{
	text-decoration:none; 
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

/*----------------------------------------------------
  wrapper 
----------------------------------------------------*/
#wrapper {
	padding-bottom:80px;
}



/*----------------------------------------------------
  top_ml
----------------------------------------------------*/
.top_ml {
	max-width:1000px;
	width:90%;
	height:auto;
	margin-left:5%;
	margin:0 auto;
	margin-top:30px;
	color:#FFFFFF;
}

.top_ml h1 {
	text-align:center;
}

h1.top {
	color:#FFFFFF;
}

p.r_info {
	margin:10px;
}

.top_ml p {
	color:#FFFFFF;
	text-align:center;
}

p.ml {
	width:100%;
	height:35px;
	color:#FF0000;
	border-bottom:solid 3px #FFFFFF;
	font-size:large;
	font-weight:bold;
	margin-bottom:-10px;
	text-align:left;
}


.scroll_a {
	margin-top:10px;
	color:#FFFFFF;
	border-bottom:solid 1px #E3E3E3;
	overflow:hidden;
}

.scroll_a a {
	margin-left:10px;
	margin-right:10px;
	white-space:nowrap;
	display:block;
	float:left;
}

span.red {
	color:#FF0000;
}


/*----------------------------------------------------
  list
----------------------------------------------------*/
.list {
	max-width:1000px;
	height:auto;
	margin:0 auto;
	margin-top:30px;
	margin-bottom:100px;
	clear:both;
}

.list h1 {
	width:100%;
	margin:0 auto;
	clear:both;
}

h1.top {
	text-align:center;
	margin-bottom:30px;
}

table.mtb  {
	max-width:1000px;
	width:100%;
	border:solid #FFFFFF;
	text-align:center;
	margin-left:25px;
	margin-bottom:50px;
	clear:both;
	font-weight:bold;
	table-layout: fixed;
}

table.mtb td {
	width:10px;
	height:30px;
	color:#FFFFFF;
	table-layout: fixed;
}



h1.matching {
	height:80px;
	line-height:120px;
	margin-left:5%;
	padding-bottom:30px;
	margin-top:-110px;
	padding-top:110px;
	clear:both;
	color:#FFFFFF;
}

h1.matching span {
	color:#F00;
}




/*.m_info*/
.m_info {
	max-width:1000px;
	width:90%;
	margin:0 auto;
	margin-bottom:20px;
	color:#FF0000;
	font-weight:bolder;
	line-height:normal;
	clear:both;
}

.m_info span {
	color:#FFFFFF;
}
	
	


.table-top {
	max-width:1000px;
	width:100%;
	margin-left:25px;
}

.table-bottom {
	max-width:1000px;
	width:100%;
	margin-left:25px;
	clear:both;
}

.tpl {
	width:50%;
	display:table;
	float:left;
}

.tpr {
	width:50%;
	display:table;
	float:left;
}

.tpl .tb, .tpr .tb {
	width:25%;
	text-align:center;
	display:table-cell;
	border-right:solid 1px #FFF;
	line-height:1.5em;
	font-weight:bolder;
}

.tpl .tb p, .tpr .tb p {
	color:#FFFFFF;
	border-top:solid 1px #FFF;
}

/*----------------------------------------------------
  abc
----------------------------------------------------*/
.abc {
	max-width:900px;
	height:auto;
	margin:0 auto;
	overflow:hidden;
}

.abc li {
	max-width:33.3%;
	line-height:1.5em;
	top:10px;
	float:left;
}

.abc li a {
	width:100%;
	height:100%;
	color:#000000;
	display:block;
}

.abc li a img {
	width:100%;
}



.abc li a:hover{
	background-color: #FFCCCC;
	color:#F00;
}

.abc li.border {
	border-bottom:1px solid #000000;
}

li.red {
	max-width:900px;
	width:100%;
	height:30px;
	border-bottom:solid 3px #FFFFFF;
	font-weight:bold;
	
}

li.red p {
	font-size:x-large;
	color:#FFFFFF;
	line-height:30px;
	margin-left:10px;
}

h1.matching {
	height:80px;
	line-height:120px;
	margin-left:25px;
	padding-bottom:30px;
	margin-top:-110px;
	padding-top:110px;
	clear:both;
	color:#FFFFFF;
}


/*----------------------------------------------------
  smartphone 480px
----------------------------------------------------*/
@media screen and (max-width:480px){
	.top_ml {
	margin-top:15px;
	}
	
	.top_ml h1 {
	font-size:x-large;
	line-height:1.3em;
	margin:10px;
	}
	
	p.r_info {
	margin-top:20px;
	line-height:1.3em;
	}

	.top_contact img {
	width:80%;
	margin-left:10%;
	}
	
	.scroll_a {
	margin-top:15px;
	}
	
	.scroll_a a { 
	font-size:13px;
	}
	
	h1.matching {
	font-size:x-large;
	margin-bottom:0px;
	}
	
	.table-top {
	width:90%;
	margin-left:5%;
	font-size:11px;
	}
	
	.table-bottom {
	width:90%;
	margin-left:5%;
	font-size:11px;
	}
	
	.table-top .tpl {
	width:100%;
	border:solid #FFF;
	border-width:3px 2px 0px 3px;
	margin:0 -2px 0px -3px;
	}

	.table-top .tpr {
	width:100%;
	border:solid #FFF;
	border-width:1px 2px 1px 3px;
	margin:0 -2px 0 -3px;
	}
	
	.table-bottom .tpl {
	width:100%;
	border:solid #FFF;
	border-width:0px 2px 1px 3px;
	margin:-1px -3px 1px -3px;
	}

	.table-bottom .tpr {
	width:100%;
	border:solid #FFF;
	border-width:0px 2px 3px 3px;
	margin:-1px -3px -1px -3px;
	}
	
	.m_info {
	font-size:13px;
	padding-top:15px;
	line-height:1.3em;
	}
	
	.m_info {
	font-size:13px;
	}
	
	.abc li {
	max-width:50%;
	line-height:1.5em;
	top:10px;
	float:left;
	}
	
	li.red {
	max-width:900px;
	width:100%;
	height:30px;
	border-bottom:solid 3px #FFFFFF;
	font-weight:bold;
	}
}

/*----------------------------------------------------
  tablet 481px~768px
----------------------------------------------------*/
@media screen and (min-width:481px) and ( max-width:768px) {
	.top_ml h1 {
	font-size:x-large;
	margin:10px;
	}
	
	h1.matching {
	font-size:x-large;
	margin-bottom:0px;
	}
	
	.table-top {
	width:90%;
	margin-left:5%;
	font-size:13px;
	}
	
	.table-bottom {
	width:90%;
	margin-left:5%;
	font-size:13px;
	}
	
	.table-top .tpl {
	width:100%;
	border:solid #FFF;
	border-width:3px 2px 0px 3px;
	margin:0 -2px 0px -3px;
	}

	.table-top .tpr {
	width:100%;
	border:solid #FFF;
	border-width:2px 2px 1px 3px;
	margin:0 -2px 0 -3px;
	}
	
	.table-bottom .tpl {
	width:100%;
	border:solid #FFF;
	border-width:2px 2px 1px 3px;
	margin:-1px -3px 1px -3px;
	}

	.table-bottom .tpr {
	width:100%;
	border:solid #FFF;
	border-width:1px 2px 3px 3px;
	margin:-1px -3px -1px -3px;
	}
	
	.m_info {
	font-size:13px;
	padding-top:15px;
	line-height:1.3em;
	}
	
	.m_info {
	font-size:13px;
	}
}

/*----------------------------------------------------
  below 769px~1170px
----------------------------------------------------*/
@media screen and (min-width:769px) and ( max-width:1170px) {
	.table-top {
	width:90%;
	margin-left:5%;
	font-size:13px;
	}
	
	.table-bottom {
	width:90%;
	margin-left:5%;
	font-size:13px;
	}
	
	.table-top .tpl {
	width:50%;
	border:solid #FFF;
	border-width:3px 0px 1px 3px;
	margin:0 -1px 1px -3px;
	}

	.table-top .tpr {
	width:50%;
	border:solid #FFF;
	border-width:3px 2px 1px 0px;
	margin:0 -3px -1px -1px;
	}
	
	.table-bottom .tpl {
	width:50%;
	border:solid #FFF;
	border-width:0px 0px 3px 3px;
	margin:-1px -1px 1px -3px;
	}

	.table-bottom .tpr {
	width:50%;
	border:solid #FFF;
	border-width:0px 2px 3px 0px;
	margin:-1px -3px -1px -1px;
	}
	
	.m_info {
	font-size:13px;
	padding-top:15px;
	line-height:1.3em;
	}
}

/*----------------------------------------------------
   above 1171px
----------------------------------------------------*/

@media screen and (min-width:1171px) {
	.top_ml {
    width: 100%;
	}
	
	.table-top .tpl {
	width:50%;
	border:solid #FFF;
	border-width:3px 0px 1px 3px;
	margin:0 -1px 1px -3px;
	}

	.table-top .tpr {
	width:50%;
	border:solid #FFF;
	border-width:3px 2px 1px 0px;
	margin:0 -3px -1px -1px;
	}
	
	.table-bottom .tpl {
	width:50%;
	border:solid #FFF;
	border-width:0px 0px 3px 3px;
	margin:-1px -1px 1px -3px;
	}

	.table-bottom .tpr {
	width:50%;
	border:solid #FFF;
	border-width:0px 2px 3px 0px;
	margin:-1px -3px -1px -1px;
	}
	
	.m_info {
	width:100%;
	}
}