@charset "utf-8";

/* reset
-------------------------------------------------------------------*/
* {
	margin:0;
	padding:0;
}

h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
table {
	border-collapse:collapse;
	border-spacing:0;
	font-size:100%;
	line-height:1.5;
}
th {
	font-weight:normal;
	text-align:left;
}
img {
	border:0;
	vertical-align:bottom;
}
ul li {
	list-style:none;
}
input, textarea {
	vertical-align:middle;
}
address, em {
	font-style:normal;
}

/* link
-------------------------------------------------------------------*/
a:link, a:visited, a:hover {
	color:#666;
	text-decoration:underline;
}
a:hover {
	text-decoration:none;
}
/* common class
-------------------------------------------------------------------*/
/* general purpose class:Not set */
.left_area {}
.right_area {}
.bg_top {}
.bg_mdl {}
.bg_btm {}
.first {}
.last {}

/* position */
.position {	position:relative;}

/* width */
.w_half { width:50%;}
.w_third { width:33%;}
.w_quarter { width:25%;}
.w_fifth { width:20%;}
.w_max { width:100%;}
.scale {
	width:100%;
	height:auto;
}

/* float */
.flt_left {	float:left;}
.flt_right {	float:right;}

/* margin:top */
.mt-18 { margin-top:-18px !important;}
.mt00 {	margin-top:0px !important;}
.mt05 {	margin-top:5px !important;}
.mt10 {	margin-top:10px !important;}
.mt15 {	margin-top:15px !important;}
.mt20 {	margin-top:20px !important;}
.mt25 {	margin-top:25px !important;}
.mt30 {	margin-top:30px !important;}
.mt35 {	margin-top:35px !important;}
.mt40 {	margin-top:40px !important;}

/* margin:right */
.mr00 {	margin-right:0px !important;}
.mr05 {	margin-right:5px !important;}
.mr10 {	margin-right:10px !important;}
.mr15 {	margin-right:15px !important;}
.mr20 {	margin-right:20px !important;}
.mr25 {	margin-right:25px !important;}
.mr30 {	margin-right:30px !important;}
.mr35 {	margin-right:35px !important;}
.mr40 {	margin-right:40px !important;}

/* margin:bottom */
.mb00 {	margin-bottom:0 !important;}
.mb05 {	margin-bottom:5px !important;}
.mb10 {	margin-bottom:10px !important;}
.mb15 {	margin-bottom:15px !important;}
.mb20 {	margin-bottom:20px !important;}
.mb25 {	margin-bottom:25px !important;}
.mb30 {	margin-bottom:30px !important;}
.mb35 {	margin-bottom:35px !important;}
.mb40 {	margin-bottom:40px !important;}


/* margin:left */
.ml00 {	margin-left:0px !important;}
.ml05 {	margin-left:5px !important;}
.ml10 {	margin-left:10px !important;}
.ml15 {	margin-left:15px !important;}
.ml20 {	margin-left:20px !important;}
.ml25 {	margin-left:25px !important;}
.ml30 {	margin-left:30px !important;}
.ml35 {	margin-left:35px !important;}
.ml40 {	margin-left:40px !important;}

/* font */
.f_bold {	font-weight:bold !important;}
.f_normal {	font-weight:normal !important;}
.txt_red { color:#F00;}

/* align */
.t_left {	text-align:left !important;}
.t_center {	text-align:center !important;}
.t_right {	text-align:right !important;}
.v_top {	vertical-align:text-top !important;}
.v_mdl {	vertical-align:middle !important;}
.v_btm {	vertical-align:text-bottom !important;}

/* Javascript:rollover */
.btn {}

/* clearfix
-------------------------------------------------------------------*/
dl:after,
ul:after,
.fix:after,
.col2-1:after,
.col1-2:after,
.col1-1:after,
.col1-1-1:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	overflow:hidden;
}

dl,
ul,
.fix,
.col2-1,
.col1-2,
.col1-1,
.col1-1-1 {
	display:inline-block;
	min-height:1%;
}
/* start hide from IE-mac\*/
*html dl,
*html ul,
*html .fix,
*html .col2-1,
*html .col1-2,
*html .col1-1,
*html .col1-1-1 {
	height:1%;
}
dl,
ul,
.fix,
.col2-1,
.col1-2,
.col1-1,
.col1-1-1 {
	display:block;
}


/* End hide from IE-mac */



/* よく使うCSS start
 
img {
    max-width:100%;
}
 
table {
    width:100%;
}
 
a,a:hover {
    -webkit-transition: 0.7s;
    -moz-transition: 0.7s;
    -o-transition: 0.7s;
    transition: 0.7s;
}
 
a img:hover {
    filter: alpha(opacity=75);
    -moz-opacity:0.75;
    opacity:0.75;
}
 
よく使うCSS end -----
時々使うCSS3 start ---
 
テキストシャドウ {
    text-shadow: 1px 1px 3px #000;
}
 
テキストシャドウ {
    text-shadow: 1px 1px 3px #000;
}
 
ボックスシャドウ {
    -moz-box-shadow: 1px 1px 3px #000;
    -webkit-box-shadow: 1px 1px 3px #000;
    box-shadow: 1px 1px 3px #000;
}
 
ボックスシャドウ内側 {
    -moz-box-shadow: inset 1px 1px 3px #000;
    -webkit-box-shadow: inset 1px 1px 3px #000;
    box-shadow: inset 1px 1px 3px #000;
}
 
角丸 {
    border-radius: 8px; 
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px; 
}
 
トランジション {
    -webkit-transition: 1.5s;
    -moz-transition: 1.5s;
    -o-transition: 1.5s;
    transition: 1.5s;
}
 
透明 {
    filter: alpha(opacity=25);
    -moz-opacity:0.25;
    opacity:0.25;
}
 
背景のみ透明 {
    background-color:rgba(255,255,255,0.2);
}
 
グラデーション {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#000000')";
    background-image: -moz-linear-gradient(top, #ffffff, #000000);
    background-image: -ms-linear-gradient(top, #ffffff, #000000);
    background-image: -o-linear-gradient(top, #ffffff, #000000);
    background-image: -webkit-gradient(linear, center top, center bottom, from(#ffffff), to(#000000));
    background-image: -webkit-linear-gradient(top, #ffffff, #000000);
    background-image: linear-gradient(top, #ffffff, #000000);
}
 
スマホ対応
@media screen and (max-width: 480px){
    
}
@media screen and (max-width: 320px){
    
}
 
時々使うCSS3 end */
