@charset "utf-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	font-weight: normal;
	vertical-align: baseline;
	line-height:1.4;
}
body {
	font-size:14px;
	font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;;
	/*text-align:justify;*/
	/*text-justify:inter-ideograph;*/
	color:#222222;
}

#search_box input,#search_box select{
	font-family:  "MS UI Gothic" , system-ui ;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul{
    list-style:none;
}

table{
    border-collapse: collapse; 
    border-spacing:0;
}

caption, th{
    text-align: left;
}


/* form  */
select, input, button, textarea {
	outline: none;
}

label,
/*select,*/
input[type="checkbox"],
input[type="submit"],
input[type="reset"],
input[type="button"]{
	cursor:pointer;
}
button,
input[type="submit"],
input[type="reset"],
input[type="button"]{
	font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;;
	border:none;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
textarea{
	padding:5px 10px;
	border:1px solid #cccccc;
	border-radius:5px;
	box-shadow:1px 1px 1px #eeeeee inset;
}



a{
	color:#333333;
	text-decoration:none;
	outline: none;
}
a:hover {
	color: #F69D09;
	text-decoration: none;
}

a img:hover {
	filter: alpha(opacity=70);
	opacity:0.70;
}
select:hover,
input:hover,
button:hover{
	filter: alpha(opacity=70);
	opacity:0.70;
}
/*
===== 1: CLEARFIX ==========================================
*/
.clearfix{
	overflow:hidden;
}

.clearfix:after{
	content:"";
	display:block;
	clear:both;
}


/*
===== 2: EACH MODULE ==========================================
*/
.pagetop{
	text-align:right;
	padding:1em;
}



/* font-style
---------------------------------*/
.txt_color01{ color:#D42B2B!important; }
.txt_color02{ color:#ff2324!important; }
.txt_color03{ color:#fa8700!important; }

.attent01{ color:#ff2324; }
.attent03{ color:#ffffff; background:#003399; }
.attent04{ color:#fa8700; font-size:18px; font-weight:bold; }


.catch{ text-align:center; font-weight:bold; font-size:16px; }
.bold{ font-weight:bold!important;}
.normal{ font-weight:normal!important; }

.fs10{ font-size:10px!important; line-height:1.2!important;}
.fs12{ font-size:12px!important; line-height:16px!important;}
.fs14{ font-size:14px!important; line-height:18px!important;}
.fs16{ font-size:16px!important; line-height:22px!important;}

sup,
sub{ font-size:1.2rem!important; }



/* 左右行揃え
---------------------------------*/
.ta-l{ text-align: left; }
.ta-r{ text-align: right; }
.ta-c{ text-align: center; }



/* 背景色
---------------------------------*/
.bg_color01{ background:#f5f5f5; }



/*
===== 4: Margin & Padding ===========================
*/

.mt0   { margin-top	: 0 !important;}
.mt5   { 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;}
.mt45  { margin-top	: 45px !important;}
.mt50  { margin-top	: 50px !important;}
.mt55  { margin-top : 55px !important;}
.mt60  { margin-top	: 60px !important;}
.mt80  { margin-top	: 80px !important;}

.mr0   { margin-right: 0 !important;}
.mr5   { 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;}

.mb0   { margin-bottom: 0 !important;}
.mb5   { 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;}
.mb80  { margin-bottom: 80px !important;}

.ml0   { margin-left: 0 !important;}
.ml5   { 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;}
.ml45  { margin-left: 45px !important;}

.m0  { margin: 0px !important;}
.m5  { margin: 5px !important;}
.m10  { margin: 10px !important;}
.m15  { margin: 15px !important;}
.m20  { margin: 20px !important;}
.m25  { margin: 25px !important;}
.m30  { margin: 30px !important;}
.m35  { margin: 35px !important;}
.m40  { margin: 40px !important;}
.m80  { margin: 80px !important;}

.pt0  { padding-top: 0 !important;}
.pt5  { padding-top: 5px !important;}
.pt10 { padding-top: 10px !important;}
.pt15 { padding-top: 15px !important;}
.pt20 { padding-top: 20px !important;}

.pr0  { padding-right: 0 !important;}
.pr5  { padding-right: 5px !important;}
.pr10 { padding-right: 10px !important;}
.pr15 { padding-right: 15px !important;}
.pr20 { padding-right: 20px !important;}

.pl0  { padding-left: 0 !important;}
.pl5  { padding-left: 5px !important;}
.pl10 { padding-left: 10px !important;}
.pl15 { padding-left: 15px !important;}
.pl20 { padding-left: 20px !important;}

.pb0  { padding-bottom: 0 !important;}
.pb5  { padding-bottom: 5px !important;}
.pb10 { padding-bottom: 10px !important;}
.pb15 { padding-bottom: 15px !important;}
.pb20 { padding-bottom: 20px !important;}

.p0  { padding: 0px !important;}
.p5  { padding: 5px !important;}
.p10 { padding: 10px !important;}
.p15 { padding: 15px !important;}
.p20 { padding: 20px !important;}
.p30 { padding: 30px !important;}
.p40 { padding: 40px !important;}

.h150{ height:150px!important; }
.h200{ height:200px!important; }



	
	
/* よく使うCSS start

img {
	max-width:100%;
}

table {
	width:100%;
}


よく使うCSS end -----
時々使うCSS3 start ---

テキストシャドウ {
	text-shadow: 1px 1px 3px #000;
}

テキストシャドウ {
	text-shadow: 1px 1px 3px #000;
}

ボックスシャドウ {
	box-shadow: 1px 1px 3px #000;
}

ボックスシャドウ内側 {
	box-shadow: inset 1px 1px 3px #000;
}

角丸 {
	border-radius: 8px; 
}

トランジション {
	-webkit-transition: 1.5s;
	transition: 1.5s;
}

透明 {
	filter: alpha(opacity=25);
	opacity:0.25;
}

背景のみ透明 {
	background-color:rgba(255,255,255,0.2);
}

グラデーション {
	background:
		-webkit-linear-gradient(
		top,
		#eeeeee 0%,
		#aaaaaa 100%,);
	background:
		-webkit-gradient(
		linear, left top, left bottom,
		from(#eeeeee),
		to(#aaaaaa));
	background:
		linear-gradient(
		to bottom,
		#eeeeee,
		#aaaaaa);
}

スマホ対応
@media screen and (max-width: 480px){
	
}
@media screen and (max-width: 320px){
	
}

時々使うCSS3 end */
