@charset "utf-8";

/************************************************************
CSS Information
 File name:      general.css
 Style Info:     汎用class
************************************************************/


.disc{
	padding:0 0 0 20px;
	}

.disc li{
	padding:0 0 5px 0;
	list-style:disc;
	}


/*============================================================
 ボタン
 ============================================================*/
 
.btn_rd_ar{ /* えんじボタン-三角付 */
	margin:40px auto;
	font-weight:bold;
	font-size:16px;
	text-align:center;
	border:none;
	cursor:pointer;	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;	
	color:#FFF;
	padding:0.5em;/*8px*/
	background-color:#7E1D03;		
	}
.btn_rd_ar:hover{
	background:#B20000;
	}	
.btn_rd_ar span{	
	display:block;
	background:url(../images/common/icon_arW.png) 0 5px no-repeat;
	padding:0 0 0 0px;
	}

.btn_rd_ar a:link {color: #FFF;text-decoration: none;}
.btn_rd_ar a:visited {color: #FFF;text-decoration: none;}
.btn_rd_ar a:hover {color: #FFF; text-decoration:none;}
.btn_rd_ar a:active {color: #FFF;text-decoration: none;}


.btn_rd_ar2{ /* えんじボタン-三角付 *//*margin指定なし*/
	margin:0 auto;
	font-weight:bold;
	font-size:16px;
	text-align:center;
	border:none;
	cursor:pointer;	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;	
	color:#FFF;
	padding:0.5em;/*8px*/
	background-color:#7E1D03;		
	}
.btn_rd_ar2:hover{
	background:#B20000;
	}	
.btn_rd_ar2 span{	
	display:block;
	background:url(../images/common/icon_arW.png) 0 5px no-repeat;
	padding:0 0 0 0px;
	}

.btn_rd_ar2 a:link {color: #FFF;text-decoration: none;}
.btn_rd_ar2 a:visited {color: #FFF;text-decoration: none;}
.btn_rd_ar2 a:hover {color: #FFF; text-decoration:none;}
.btn_rd_ar2 a:active {color: #FFF;text-decoration: none;}



.btn_be_ar{ /* ベージュボタン-三角付 */
	margin:0 auto;
	font-weight:bold;
	font-size:14px;
	text-align:left;
	border:none;
	cursor:pointer;	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;	
	padding:8px;
	background-color:#F0ECDF;		
	}
.btn_be_ar:hover{
	background:#E1DAC1;
	}	
.btn_be_ar span{	
	display:block;
	background:url(../images/common/icon_arR.png) 0 4px no-repeat;
	padding:0 0 0 25px;
	}

.btn_be_ar a:link {text-decoration: none;}
.btn_be_ar a:visited {text-decoration: none;}
.btn_be_ar a:hover { text-decoration:none;}
.btn_be_ar a:active {text-decoration: none;}



.btn_blk_ar{ /* 黒ボタン-三角付 */
	margin:0 auto;
	font-weight:bold;
	font-size:14px;
	text-align:left;
	border:none;
	cursor:pointer;	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;	
	padding:8px;
	background-color:#E1DAC1;
		
	}
.btn_blk_ar:hover{
	background:#333;
	color:#fff;
	}
.btn_blk_ar_on{
	background:#333;
	color:#fff;
	}	
.btn_blk_ar span{	
	display:block;
	background:url(../images/common/icon_arW2.png) 0 4px no-repeat;
	padding:0 0 0 25px;
	color:#fff;
	}

.btn_blk_ar a:link {text-decoration: none;}
.btn_blk_ar a:visited {text-decoration: none;}
.btn_blk_ar a:hover { text-decoration:none;}
.btn_blk_ar a:active {text-decoration: none;}




.btn_br{ /* 黒ボタン */
	margin:40px auto;
	width:20%;
	font-weight:bold;
	font-size:16px;
	border:none;
	cursor:pointer;	
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;	
	line-height:1.8;
	color:#FFF;
	padding:5px 25px;	
	background-color:#1D1B14;	
	}
.btn_br:hover{
	background:#564B23;
	color:#FFF;
	}

@media screen and (max-width: 1024px) {

	}

@media screen and (max-width: 768px) {

	}

@media screen and (max-width: 480px) {

.btn_rd_ar2{ /* えんじボタン-三角付 *//*margin指定なし*/
	font-size:14px;}

	}



/*============================================================
 小さいボタン
 ============================================================*/
.btn_s{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	border:none;
	cursor:pointer;	
	background:#DEDECD;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;	
	font-size:0.7857em;/*11px*/
	line-height:1.8;
	color:#9F1F24;
	padding:3px 5px;
	}
.btn_s:hover{
	background:#9F1F24;
	color:#FFF;
	}

.btn_s a:link {color: #000;text-decoration: none; font-weight:bold;}
.btn_s a:visited {color: #000;text-decoration: none; font-weight:bold;}
.btn_s:hover a {color: #FFF; text-decoration:none; font-weight:bold;}
.btn_s a:active {color: #FFF;text-decoration: none; font-weight:bold;}


/*============================================================
アイコン一覧
 ============================================================*/
.link_pdf{ /* _PDF */
   background:transparent url(../images/common/pdficon.gif) center right no-repeat;
   padding-right:17px;
   margin-right:2px;
}

/*============================================================
 レイアウト
 ============================================================*/
.fr {float: right;margin: 0;}.fl {float: left;margin: 0;}.clear {clear: both;line-height:0px;height:0;font-size:0px;visibility:hidden;}.txtL { text-align: left;}.txtC { text-align: center;}.txtR { text-align: right;}
/* clearfix */
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
 /* IE6 */
* html .clearfix { zoom: 1;}
 /* IE7 */
*:first-child+html .clearfix { zoom: 1;}
/*** 余白(マージン) ***/
.r_m20{
	margin-right:20px;
	}
	
/*============================================================
 余白
 ============================================================*/
.colRed{
	color:#8C0000;
	}
.colOr{
	color:#FC7215;
	}

/*============================================================
 余白
 ============================================================*/
.l_5 {padding-left: 5px;}
.l_10 {padding-left: 10px;}
.l_15 {padding-left: 15px;}
.l_20 {padding-left: 20px;}
.l_30 {padding-left: 30px;}
.l_40 {padding-left: 40px;}
.l_50 {padding-left: 50px;}
.l_60 {padding-left: 60px;}
.r_5 {padding-right: 5px;}
.r_10 {padding-right: 10px;}
.r_15 {padding-right: 15px;}
.r_20 {padding-right: 20px;}
.r_30 {padding-right: 30px;}
.r_50 {padding-right: 50px;}
.r_60 {padding-right: 60px;}
.to_2 {padding-top: 2px;}
.to_5 {padding-top: 5px;}
.to_6{padding-top: 6px;}
.to_10 {padding-top: 10px;}
.to_15 {padding-top: 15px;}
.to_20 {padding-top: 20px;}
.to_30 {padding-top: 30px;}
.to_40 {padding-top: 40px;}
.to_50 {padding-top: 50px;}
.bt_5 {padding-bottom: 5px;}
.bt_10 {padding-bottom: 10px;}
.bt_15 {padding-bottom: 15px;}
.bt_20 {padding-bottom: 20px;}
.bt_30 {padding-bottom: 30px;}	
.bt_40 {padding-bottom: 40px;}
.bt_50 {padding-bottom: 50px;}

.btem_20 { margin-bottom: 1.4285em;}/*元14pxで20px指定*/
.btem_20 { margin-bottom: 1.4285em;}/*元14pxで20px指定*/
.btem_30 { margin-bottom: 2.1428em;}/*元14pxで30px指定*/

.mr_20 { margin-right:20px;}

.w5pc { width: 5%!important; }
.w10pc { width: 10%!important; }
.w15pc { width: 15%!important; }
.w20pc { width: 20%!important; }
.w25pc { width: 25%!important; }
.w30pc { width: 30%!important; }
.w33pc { width: 33%!important; }
.w35pc { width: 35%!important; }
.w40pc { width: 40%!important; }
.w45pc { width: 45%!important; }
.w50pc { width: 50%!important; }
.w55pc { width: 55%!important; }
.w60pc { width: 60%!important; }
.w65pc { width: 65%!important; }
.w70pc { width: 70%!important; }
.w75pc { width: 75%!important; }
.w80pc { width: 80%!important; }
.w85pc { width: 85%!important; }
.w90pc { width: 90%!important; }
.w95pc { width: 95%!important; }
.w100pc { width: 100%!important; }

.ac { text-align: center!important; }
.al { text-align: left!important; }
.ar { text-align: right!important; }

/*** フォント ***/
.fsS { font-size: 80%;}
.fsita { font-style:italic;}

/*** リストスタイル ***/
.list_disc li{list-style:disc;}

/*** テキスト段落 ***/
.txtBlk {
	line-height:1.8;}


/*============================================================
 透過ロールオーバー
 ============================================================*/
/* hover and change alpha value */
.hov_opa:hover{
opacity:0.7;
filter:alpha(opacity=70);
-ms-filter: “alpha( opacity=70 )”;
display:block;
}

/*============================================================
 CSS3スタイルセット
 ============================================================*/
.color_gradiant{
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #0104B8), color-stop(100%, #031442) );
	background:-moz-linear-gradient( center top, #0104B8 5%, #031442 100% );
	background:-ms-linear-gradient( top, #0104B8 5%, #031442 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0104B8', endColorstr='#031442');
	background-color:#031442;
	}	
.txt_shadow{
  	text-shadow: 1px 1px 1px #333;	
	}
.radius{
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	
	}
.btn{
	max-width:200px;
	font-weight:bold;
	font-size:14px;
	color:#FFF;
	padding:10px 30px;
	cursor:pointer;
	}
.btn:hover{
	background:#0104B8;
	}
		.btn a:link {color: #FFF;text-decoration: none;}
		.btn a:visited {color: #FFF;text-decoration: none;}
		.btn a:hover {color: #FFF; text-decoration:none}
		.btn a:active {color: #FFF;text-decoration: none;}


/*----------------------------------------------------
	CSS3 ドロップシャドウ
----------------------------------------------------*/

/*
 * Effect 1
 * ===============================================*/
.effect1{
	-webkit-box-shadow: 0 10px 6px -6px #777;
	   -moz-box-shadow: 0 10px 6px -6px #777;
	        box-shadow: 0 10px 6px -6px #777;
}

/*
 * Effect 2
 * ===============================================*/
.effect2
{
  position: relative;
}
.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.effect2:after
{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

/*
 * Effect 3
 * ===============================================*/
.effect3
{
  position: relative;
}
.effect3:before
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}

/*
 * Effect 4
 * ===============================================*/
.effect4
{
  position: relative;
}
.effect4:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  right: 10px;
  left: auto;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
}  

/*
 * Effect 5
 * ===============================================*/
.effect5
{
  position: relative;
}
.effect5:before, .effect5:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 25px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 35px 20px #777;
  -moz-box-shadow: 0 35px 20px #777;
  box-shadow: 0 35px 20px #777;
  -webkit-transform: rotate(-8deg);
  -moz-transform: rotate(-8deg);
  -o-transform: rotate(-8deg);
  -ms-transform: rotate(-8deg);
  transform: rotate(-8deg);
}
.effect5:after
{
  -webkit-transform: rotate(8deg);
  -moz-transform: rotate(8deg);
  -o-transform: rotate(8deg);
  -ms-transform: rotate(8deg);
  transform: rotate(8deg);
  right: 10px;
  left: auto;
}

/*
 * Effect 6
 * ===============================================*/
.effect6
{
  	position:relative;       
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect6:before, .effect6:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
} 
.effect6:after
{
	right:10px; 
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg); 
       -moz-transform:skew(8deg) rotate(3deg);     
        -ms-transform:skew(8deg) rotate(3deg);     
         -o-transform:skew(8deg) rotate(3deg); 
            transform:skew(8deg) rotate(3deg);
}

/*
 * Effect 7
 * ===============================================*/
.effect7
{
  	position:relative;       
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect7:before, .effect7:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.2);
    box-shadow:0 0 20px rgba(0,0,0,0.2);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
} 
.effect7:after
{
	right:10px; 
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg); 
       -moz-transform:skew(8deg) rotate(3deg);     
        -ms-transform:skew(8deg) rotate(3deg);     
         -o-transform:skew(8deg) rotate(3deg); 
            transform:skew(8deg) rotate(3deg);
}

/*
 * Effect 8
 * ===============================================*/
.effect8
{
  	position:relative;       
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect8:before, .effect8:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
} 
.effect8:after
{
	right:10px; 
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg); 
       -moz-transform:skew(8deg) rotate(3deg);     
        -ms-transform:skew(8deg) rotate(3deg);     
         -o-transform:skew(8deg) rotate(3deg); 
            transform:skew(8deg) rotate(3deg);
}