@charset "utf-8";

/* 
name:明日香村地域おこし協力隊
designer: IT-Force Inc.
designer_url: http://it-force.jp/
Ver3.11 2017/07/20
*/

/* ---------------------------------------------------------------------
ページ全体
--------------------------------------------------------------------- */

html,
body {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,Verdana;
	margin:0 0 0 0;
	color: #333;
}
a {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,Verdana;
	color: #5171E9;
	text-decoration:none;
}
a:visited {
	color: #5171E9;
}
a:hover {
	color: #BB0D10;
	text-decoration:none;
}
a:active {
	color: #5171E9;
	text-decoration:none;
}
h1,h2,h3,h4,h5,h6 {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,Verdana;
	font-weight: normal;
}

/*共通*/
.clear{
	clear:both;
	line-height:0em;
}
.horizon{
	border-bottom:1px #CCC solid;
	padding-top:0px;
	margin-bottom:10px;
	clear:both;
}
.dashed{
	border-bottom:1px #CCC dashed;
	padding-top:0px;
	margin-bottom:10px;
	clear:both;
}
.Inn_Text{
	width: 96%;
	margin: 12px auto;
	color: #666;
	font-size: 12px;
}
/* ---------------------------------------------------------------------
レイアウト
--------------------------------------------------------------------- */
#container{
	width:100%;
	overflow:hidden;
}
#container a img{
	-ms-interpolation-mode: bicubic;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
#container a:hover img {
	-ms-interpolation-mode: bicubic;
	opacity: 0.5;
	filter: alpha(opacity=50);
}
/********
スマホ用ナビ
********/
#navi_box_smp{
	position:relative;
}
#navi_box_smpmm{
	position:absolute;
	background:;
	width:50px;
	height:50px;
	top:0;
	left:0;
	z-index:600;
}
/********
PCとスマホの切りかえボタン
********/
#PC_Change{
	background:#313131;
	padding:0;
	line-height:1em;
	border-top:#809384 1px solid;
}
.switchBtn {
	padding: 10px 0;
	width: 100%;
	text-align: center;
	clear: both;
}
.switchBtn a {
	color:#333;
	margin: 0 10px;
	padding: 7px 30px 5px 30px;
	text-align: center;
	display: inline-block;
	overflow: hidden;
	background: #efefef;
	text-decoration:none;
	font-size:80%;
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */ 
}
/********
ページのトップへ
********/
#page-top {
	z-index:500;
	position: fixed;
	bottom: 12px;
	right: 12px;
}
#page-top a {
	width: 50px;
	padding: 0;
	display: block;
}
/********
お問い合わせ
********/
#inquiry_chuiBox{
	width:100%;
	margin:auto;
	text-align:center;
	padding: 0 0 36px 0;
	border-bottom:1px dashed #CCC;
}
#inquiry_chui{
	width:95%;
	padding:4px;
	margin:auto;
	font-size:12px;
	background:#F8F8F8;
	border:1px solid #E8E8E8;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */
}
#inquiry_chui_left{
	float:left;
	width:20%;
	display:none;
}
#inquiry_chui_left img {
	max-width:100%;
	height:auto;
}
#inquiry_chui_Right{
	/*float:right;*/
	width:90%;
	margin:auto;
}
#form_Box{
	width:96%;
	padding:18px 0 0 0;
	font-size:13px;
	margin:auto;
	overflow:hidden;
}
#form_Box dl {
  width:100%;
}
#form_Box dt {
  float:left;
  clear:left;
  width:100%;
  font-weight:bold;
  margin: 0 0 0 0;
}
#form_Box dd {
  float:left;
  width:100%;
  margin: 0 0 18px 0;
}
.input_Area{
	overflow: hidden;
}
input[type=text] {
	padding:5px 4px 4px 4px;
	font-size:1em;
	border:solid 1px #ccc;
	margin:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
	-webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2);
	box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.2);
	}
input[type=submit] {
	margin: 0 0 16px 0;
}
input.color {
    color: #4797BC;
    font-weight: bold;
    width: 100%;
}
input::-webkit-input-placeholder {
    color: #CCC;
    font-weight: normal;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
input:-ms-input-placeholder {
    color: #CCC;
    font-weight: normal;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
input::-moz-placeholder {
    color: #CCC;
    font-weight: normal;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.container_form {
  margin: 0;
  width: 95%;
}
.container_form > .dropdown {
  margin: 0;
  vertical-align: top;
}

.dropdown {
  display: inline-block;
  position: relative;
  overflow: hidden;
  height: 28px;
  width: 200px;
  background: #f2f2f2;
  border: 1px solid;
  border-color: white #f7f7f7 #f5f5f5;
  border-radius: 3px;
  background-image: -webkit-linear-gradient(top, transparent, rgba(0, 0, 0, 0.06));
  background-image: -moz-linear-gradient(top, transparent, rgba(0, 0, 0, 0.06));
  background-image: -o-linear-gradient(top, transparent, rgba(0, 0, 0, 0.06));
  background-image: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.06));
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
}
.dropdown:before, .dropdown:after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 9px;
  right: 10px;
  width: 0;
  height: 0;
  border: 4px dashed;
  border-color: #888 transparent;
  pointer-events: none;
}
.dropdown:before {
  border-bottom-style: solid;
  border-top: none;
}
.dropdown:after {
  margin-top: 7px;
  border-top-style: solid;
  border-bottom: none;
}

.dropdown-select {
  position: relative;
  width: 130%;
  margin: 0;
  padding: 6px 8px 6px 10px;
  height: 28px;
  line-height: 14px;
  font-size: 12px;
  color: #62717a;
  text-shadow: 0 1px white;
  /* Fallback for IE 8 */
  background: #f2f2f2;
  /* "transparent" doesn't work with Opera */
  background: rgba(0, 0, 0, 0) !important;
  border: 0;
  border-radius: 0;
  -webkit-appearance: none;
}
.dropdown-select:focus {
  z-index: 3;
  width: 100%;
  color: #394349;
  outline: 2px solid #49aff2;
  outline: 2px solid -webkit-focus-ring-color;
  outline-offset: -2px;
}
.dropdown-select > option {
  margin: 3px;
  padding: 6px 8px;
  text-shadow: none;
  background: #f2f2f2;
  border-radius: 3px;
  cursor: pointer;
}

/* Fix for IE 8 putting the arrows behind the select element. */
.lt-ie9 .dropdown {
  z-index: 1;
}
.lt-ie9 .dropdown-select {
  z-index: -1;
}
.lt-ie9 .dropdown-select:focus {
  z-index: 3;
}

/* Dirty fix for Firefox adding padding where it shouldn't. */
@-moz-document url-prefix() {
  .dropdown-select {
    padding-left: 6px;
  }
}
/* ---------------------------------------------------------------------
ヘッダー
--------------------------------------------------------------------- */
#head_Area{
	width: 100%;
	border-top: 46px solid #721915;
}
#head_Box{
	width: 86%;
	margin: auto;
}
#navi_Area{
	width: 100%;
	background: #FEF8EC;
}
#navi_Box{
	width: 96%;
	margin: auto;
	padding: 0;
}
#navi_Box img{
	max-width: 100%;
	height: auto;
}
#head_Left{
	width: 96%;
	margin: auto;
	/*float: left;*/
	/*width: 30%;*/
}
#head_Right{
	float: right;
	width: 65%;
	display: none;
}
#head_h1{
	/*float: right;*/
	font-size: 12px;
	color: #666;
	margin: 4px 0 16px 0;
}
.navi_Inn{
	float: right;
	margin: 24px 0 0 0;
}
.navi_Inn a{
	display: block;
	background: #6D0005;
	color: #FFF;
	text-align: center;
	font-size: 12px;
	padding: 4px 8px;
	border-radius: 5px;
	margin: 0 8px 0 0;
}
.navi_Inn a:hover{
	background: #41321E;
}
#hero{
	width: 100%;
	height: 180px;
	background: #666;
	overflow: hidden;
}
/* ---------------------------------------------------------------------
ヘッド下部のメニュー
--------------------------------------------------------------------- */
#wrapp{
	width: 100%;
	background: #FEF8EC;
	background: #FEF8EC url(../images/bg_foot.png) repeat-x bottom;
	padding: 8px 0 160px 0;
}
#wrapp img{
	max-width: 100%;
	height: auto;
}
#section_p1{
	width: 96%;
	margin: auto;
}
.sec_p1_Box{
	float: left;
	width: 100%;
	margin: 8px 0 24px 0;
}
.sec_p1_Inn{
	width: 96%;
	margin: auto;
}
.sec_p1_h2{
	width: 96%;
	margin: auto;
	padding: 4px 0;
	font-weight: bold;
}
.sec_p1_Text{
	width: 96%;
	margin: auto;
	font-size: 12px;
	overflow: hidden;
	border-top: 1px dashed #CCC;
	padding: 4px 0 0 0;
}
.sec_p1_Text p{
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.sec_p1_Btn{
	margin: 12px auto;
} 
.sec_p1_Btn a{
	display: block;
	background: #6B0010;
	padding: 4px 0;
	width: 45%;
	margin: auto;
	color: #FFF;
	text-align: center;
	font-size: 12px;
	border-radius: 5px;
}
.sec_p1_Btn a:hover{
	background: #41321E;
}



.section_p2{
	width: 86%;
	margin: 16px auto 0 auto;
}
.section_p3{
	width: 86%;
	margin: 0 auto;
}
.top_About_Left{
	float: left;
	width: 100%;
}
.top_About_Right{
	float: right;
	width: 100%;
	margin: 24px 0 0 0;
}
.top_About_Title{
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif" !important;
	font-size: 28px;
}
.top_About_Text{
	padding: 24px 0 0 0;
	color: #666;
	font-size: 12px;
}
.sec_Btn{
	margin: 12px auto;
} 
.sec_Btn a{
	display: block;
	background: #6B0010;
	padding: 8px 0;
	width: 45%;
	color: #FFF;
	text-align: center;
	font-size: 16px;
	border-radius: 5px;
}
.sec_Btn a:hover{
	background: #41321E;
}
.bg_Green{
	width: 100%;
	margin: 24px 0 0 0;
	padding: 48px 0;
	background: #EBFBEC;
}
.sec_TTL{
	text-align: center;
	font-size: 13px;
	color: #666;
	padding: 0 0 12px 0;
}
.sec_TTL h2{
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif" !important;
	font-size: 28px;
	color: #6B0010;
}
.sec_TTLinn{
	font-size: 13px;
	color: #666;
	padding: 0 0 12px 0;
}
.sec_TTLinn h2{
	font-family: "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif" !important;
	font-size: 28px;
	color: #6B0010;
}
.top_map_Left{
	float: left;
	width: 100%;
	margin: 16px 0 0 0;
}
.top_map_Inn{
	width: 96%;
	margin: auto;
}
.top_map_Right{
	float: right;
	width: 100%;
	margin: 16px 0 0 0;
}
.top_Recruit_Box{
	margin-bottom: 48px;
}
.top_Recruit_Left{
	float: left;
	width: 100%;
}
.top_Recruit_Right{
	float: right;
	width: 100%;
	
}
.top_Recruit_Title{
	float: left;
	width: 100%;
	text-align: center;
	background:#333 ;
	color: #FFF;
	font-size: 14px;
	padding: 4px 0;
	border-radius: 5px;
}
.top_Recruit_subTitle{
	width: 100%;
	padding: 4px 0;
	margin: 4px 0 0 0;
	font-size: 11px;
	float: right;
	border-radius: 5px;
	background: #956134;
	color: #FFF;
	text-align: center;
}
.top_Recruit_Text{
	overflow: hidden;
	padding: 16px 16px 0 16px;
	font-size: 11px;
	margin: auto;
	color: #666;
}
.top_Recruit_Text p{
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.top_Recruit_TextInn{
	padding: 16px 16px 0 16px;
	font-size: 11px;
	margin: auto;
	color: #666;
}
.top_Recruit_EXP{
	padding: 16px 16px 0 16px;
	font-size: 11px;
	border-top: 1px dashed #CCC;
	margin: 16px 0 0 0;
}
.top_Recruit_EXP ul{
	margin: 0;
	padding: 0;
}
.sec_Btn2{
	margin: 12px auto;
	/*float: left;*/
} 
.sec_Btn2 a{
    width: 100%;
	display: block;
	background: #C50307;
	padding: 4px 0;
	color: #FFF;
	text-align: center;
	font-size: 13px;
	border-radius: 5px;
	margin: 0 8px 0 0;
}
.sec_Btn2 a:hover{
	background: #956134;
}
.sec_Btn3{
	margin: 12px auto;
	/*float: left;*/
} 
.sec_Btn3 a{
    width: 100%;
	display: block;
	background: #6B0010;
	padding: 4px 0;
	color: #FFF;
	text-align: center;
	font-size: 13px;
	border-radius: 5px;
	margin: 0 8px 0 0;
}
.sec_Btn3 a:hover{
	background: #41321E;
}



/* ---------------------------------------------------------------------
下層ページ
--------------------------------------------------------------------- */
#subhero{
	width: 100%;
	height: 80px;
	background: #666;
}
#page_Title{
	width: 100%;
	text-align: center;
	font-size: 24px;
	padding: 12px 0 0 0;
}
#page_subTitle{
	width: 100%;
	width: 96%;
	margin: 8px auto;
	padding: 0 0 24px 0;
	text-align: center;
	border-bottom: 1px dashed #CCC;
	font-size: 12px;
	color: #666;
}
#page_Wrapp{
	width: 96%;
	margin: auto;
}
#page_Wrapp ul{
	padding: 0;
	margin: 0 0 0 16px;
}

/* ---------------------------------------------------------------------
フッター
--------------------------------------------------------------------- */
#foot_Area{
	width: 100%;
}
#foot_Box{
	width: 100%;
	background: #41321E;
	color: #FFF;
	padding: 48px 0;
}
#foot_Inn{
	width: 86%;
	margin: auto;
	font-size: 12px;
	line-height: 2em;
	text-align: center;
}
#foot_Inn img{
	max-width: 100%;
	height: auto;
}
#foot_Inn a{
	color: #FFF;
}
#foot_Inn a:hover{
	color: #C0B40A;
}
#foot_Copy{
	width: 96%;
	background: #F4F4F8;
	font-size: 11px;
	padding: 4px 0;
	text-align: center;
	margin: auto;
}
#foot_Tel{
	font-family: 'Raleway', sans-serif;
	font-size: 30px;
	padding: 16px 0 24px 0;
}
/* ---------------------------------------------------------------------
マーキー
--------------------------------------------------------------------- */
#marky_Area{
	width: 100%;
	background: #6D0005;
	color: #FFF;
	padding:0;
}
#marky_Box{
	width: 100%;
	margin: auto;
}
#marky_Btn{
}
#marky_Btn a{
	display: block;
	font-size: 13px;
	text-align: center;
	width: 50%;
	background: #6D0005;
	color: #FFF;
	margin: auto;
	border-radius: 50px;
}
#marky_Btn a:hover{
	background: #41321E;
}
#marky_Left{
	float: left;
	width: 100%;
	text-align: center;
	padding: 5px 0 8px 0;
	background: #EDE50B;
	color: #6D0005;
	font-weight: bold;
}
#marky_Right{
	float: right;
	width: 100%;
	font-size: 14px;
	padding: 12px 0 12px 0;
}
.ticker {
	margin: 0 auto;
	padding: 0 0 0 0;
	width: 100%;
	text-align: left;
	position: relative;
	overflow: hidden;
}
.ticker p {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ticker ul {
	width: 100%;
	position: relative;
	padding: 0 0 0 0;
	margin: 0;
}
.ticker ul li {
	text-align: center;
	width: 100%;
	overflow: hidden;
	line-height: 1.2em;
	height: 1.1em;
	display: none;
}
.ticker a{
	color: #FFF;
}
.ticker a:hover{
	color: #CCBF0C;
}
/* ---------------------------------------------------------------------
フロー
--------------------------------------------------------------------- */
.flow_Left{
	text-align: center;
	background:#333 ;
	color: #FFF;
	font-size: 14px;
	padding: 4px 0;
	border-radius: 5px;
}
.flow_Left_TXT{
	width: 93%;
	border: 1px dashed #666;
	border-radius: 7px;
	font-size: 13px;
	margin: 24px auto 0 auto;
	padding: 12px 8px;
}
.flow_Right{
	text-align: center;
	padding: 4px 0 4px 16px;
	font-size: 14px;
	border-radius: 5px;
	background: #956134;
	color: #FFF;
}
.flow_LeftIn{
	float: left;
	width: 100%;
}
.flow_RightIn{
	float: right;
	width: 100%;
	margin: 24px 0 0 0;
}
.flow_Ico{
	width: 30%;
	background: #E80D11;
	color: #FFF;
	border-radius: 50px;
	padding: 4px 8px;
	text-align: center;
	margin: 12px 0 4px 0;
}
.flow_InnL{
	float: left;
	width: 20%;
}
.flow_InnR{
	float: right;
	width: 76%;
}
.flow_InnTTL{
	border-left: 5px solid #697EF8;
	padding: 0 0 0 16px;
	color: #000;
	margin: 0 0 8px 0;
	font-weight: bold;
	font-size: 18px;
}
.flow_Arr{
	width: 20%;
	text-align: center;
}
/*トップページ編集版の追加CSS*/
#section_pp1{
	width: 86%;
	margin: 8px auto 0 auto;
}
#section_pp1_Left{
	float: left;
	width: 100%;
}
#section_pp1_Right{
	float: right;
	width: 100%;
	padding: 0 0 0 40px;
	border-left: 1px dashed #CCC;
}
#section_pp1_Right img{
	max-width: 100%;
	height:auto;
}
#top_SNSbadge{
	float: left;
	background-color: rgba(0,0,0,0.60);
	margin: 12px 0 0 0;
	padding: 12px 8px 12px 8px;
}
#SNS_Box{
	text-align: center;
	padding: 0 0 12px 0;
}
.reportBox_Left{
	float: left;
	width: 100%;
	margin: 0 0 24px 0;
}
.reportBox_Right{
	float: right;
	width: 100%;
	margin: 0 0 24px 0;
}
.reportBox_Inn{
	width: 96%;
	margin: auto;
}
.reportBox_TTL{
	border-bottom: 1px dashed #93C656;
	border-top: 1px dashed #93C656;
	font-size: 120%;
	font-weight: bold;
	padding: 4px 0 3px 8px;
	margin: 1px 0 0 0;
}
.reportBox_Photo{
	float: left;
	width: 100%;
}
.reportBox_Photo img{
	max-width: 100%;
	height:auto;
}
.reportBox_Prof{
	float: right;
	width: 100%;
}
.reportBox_rub{
	padding: 4px 0 3px 8px;
	color: #C4C3C3;
	font-size: 10px;
}
.reportBox_hob{
	padding: 4px 0 3px 16px;
	font-size: 12px;
	background: #486A00;
	border-radius: 50px;
	color: #FFF;
	margin: auto;
}
.reportBox_hob2{
	padding: 4px 16px 3px 16px;
	font-size: 10px;
	background: #EA4335;
	border-radius: 50px;
	color: #FFF;
	margin: 8px auto;
}
.reportBox_TXT{
	padding: 12px 0 3px 8px;
	font-size: 12px;
	color: #666;
	line-height: 1.8em;
}
.reportBox_Rep{
	border: 1px dashed #93C656;
	margin: 8px 0 0 0;
	height: 80px;
	padding: 0 0 0 12px;
	overflow: auto;
	font-size: 13px;
	background: #F8F9F0;
}