@charset "utf-8";
@import url("link_form.css");
/* CSS Document */

/************************************************* 共通 CSS *************************************************/
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}

html {font-size: 62.5%;}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {
	
html {font-size: 62.5%;}

}


/********* body *********/

body {
background-color: #ffffff;
background-repeat:repeat-x;
margin:0px;
padding:0px;
font-size:16px;
line-height:24px;
color:#000000;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
text-align:left;
}

body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color:#fff;  /* 背景カラー */
  z-index: 9999;  /* 一番手前に */
  pointer-events: none;  /* 他の要素にアクセス可能にするためにポインターイベントは無効に */
  opacity: 0;  /* 初期値 : 透過状態 */
  -webkit-transition: opacity .8s ease;  /* アニメーション時間は 0.8秒 */
  transition: opacity .8s ease;
}

body.fadeout::after {
  opacity: 1;
}


/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {
	
body {
drop-initial-size:14px;
font-size:1.4rem;
line-height:20px;
-webkit-text-size-adjust: 100%;/**スマホの縦と横で文字の大きさが変わらない**/
}
	
}

/********* H tag *********/

h1{display:none;}

h2{
margin: 0px;
padding: 0px;
font-weight: normal;
}

h3{
margin: 0px;
padding: 0px;
font-weight: normal;
}

h4{display:none;}

h5{display:none;}


/********* etc *********/

strong{font-weight:100;}

img{
border:0px;
}

dl, dt, dd, ol,ul,li{
margin: 0;
padding: 0;
border: 0;
outline: 0;
list-style-type:none;
}

p{
margin:0px;
padding:0px;
}

.clear{
clear:both;
height:0px;
visibility: hidden;
text-align:center;
background-color:#eeeeee;
}

.seo{display:none;}/*SEO用隠しテキスト*/



/*********　clearfix　*********/

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}

/*********　リンク設定　*********/

A {text-decoration: none; }
A:link { color: #000000; } 
A:visited { color: #000000; } 
A:hover { color: #FF6600; } 
A:active { color: #ff0000; } 



/*********　ヘッダー　*********/

.hed_waku{
	width: 1200px;
	margin: 0px auto 0px auto;
	padding: 20px 0px;
}

.hed_logo{
	width: 240px;
	height: auto;
	float: left;
	display: inline;
}

.hed_button{
	width: 945px;
	height: auto;
	float: right;
	display: inline;
}

.hed_b{
	width: 130px;
	height: 50px;
	float: left;
	display: inline;
	margin-left: 5px;
}

/***スマホ用ヘッダ***/
.sp_hed{
	display: none;
}

.sp_hed_l{
	display: none;
}
	

.sp_hed_c{
	display: none;
}

.sp_hed_r{
	display: none;
}


/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {

.hed_waku{
	width: 100%;
	height:auto;
	padding: 0px 0px 10px 0px;
	border-bottom: 3px solid #ea6290;
}
	
.hed_logo{
	display: none;
}

.hed_button{
	display: none;
}
	
.sp_hed{
	width:100%;
	height:60px;
	background-color:#fff;
	margin-top:0px;
	margin-bottom:0px;
	text-align:center;
	display: block;

}
	
.sp_hed_l{
	width:14%;
	height:60px;
	float:left;
	display:inline;
}
	

.sp_hed_c{
	width: 72%;
	height: 60px;
	text-align: center;
	float: left;
	display: inline;
}

.sp_hed_r{
	width:14%;
	height:60px;
	float:right;
	display:inline;
	margin-right:0px;
	padding: 5px 0px;
	text-align: center;
}


}


/* 画面サイズが650px以下の場合に適用 */
@media (max-width: 650px) {
	
.sp_hed_l{
	width:20%;
	height:60px;
	float:left;
	display:inline;
}
	

.sp_hed_c{
	width: 60%;
	height: 60px;
	text-align: center;
	float: left;
	display: inline;
}

.sp_hed_r{
	width:20%;
	height:60px;
	float:right;
	display:inline;
	margin-right:0px;
	padding: 5px 0px;
	text-align: center;
}	
	
}

/*********　メニュー　*********/

.menu_waku{
	background-color: #ea6290;
	width: 100%;
	height: 40px;
}


#menu{
	width: 1190px;
	height: auto;
	margin: 0px auto;
}


/**********メニューボタンの幅**********/

/**ボタン07娘**/
.b07{
	width: 14.28571%;
}

/**ボタン08娘**/
.b08{
	width: 12.5%;
}

/**ボタン10娘**/
.b09{
	width: 11.111%;
}
/**ボタン10娘**/
.b10{
	width: 10%;
}
/**ボタン11娘**/
.b11{
	width: 9.09%;
}
/**ボタン12娘**/
.b12{
	width: 8.333%;
}





.menu_b{
	display:block;
	height: 40px;
	line-height: 40px;
	color: #FFF;
	font-size: 11px;
	text-align: center;
    background-color: #ea6290; /*ボタン色*/
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
	float: left;
	display: inline;
	border-left: 1px solid #fff;
}

.menu_b:link { color: #fff;}
.menu_b:hover{
	color: #fff;
    background-color: #f98db1; /*ボタン色*/
}
.menu_b:visited { color: #fff; } 

/**メニューボタンの最後**/
.menu_b2{
	display:block;
	height: 40px;
	line-height: 40px;
	color: #FFF;
	font-size: 11px;
	text-align: center;
    background-color: #ea6290; /*ボタン色*/
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
	float: left;
	display: inline;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
}

.menu_b2:link { color: #fff;}

.menu_b2:hover{
	color: #fff;
    background-color: #f98db1; /*ボタン色*/
}
.menu_b2:visited { color: #fff; } 


.menu_b3{
	display: none;
}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {	

#menu{
	width: 100%;
	height: auto;
}

.menu_b{
	display:block;
	width: 50%;
	height: 40px;
	line-height: 40px;
	color: #FFF;
	font-size: 14px;
	text-align: center;
    background-color: #ea6290; /*ボタン色*/
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
	float: left;
	display: inline;
	border-left: 1px solid #fff;
	border-bottom:  1px solid #fff;
}
.menu_b2{
	display:block;
	width: 50%;
	height: 40px;
	line-height: 40px;
	color: #FFF;
	font-size: 14px;
	text-align: center;
    background-color: #ea6290; /*ボタン色*/
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
	float: left;
	display: inline;
	border-left: 1px solid #fff;
	border-right: 0px;
}
	
/**メニューボタンの最後**/
.menu_b3{
	display:block;
	width: 50%;
	height: 40px;
	line-height: 40px;
	color: #FFF;
	font-size: 14px;
	text-align: center;
    background-color: #0090ff; /*ボタン色*/
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
	float: left;
	display: inline;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
}

.menu_b3:link { color: #fff;}

.menu_b3:hover{
	color: #fff;
    background-color: #52b4ff; /*ボタン色*/
}
.menu_b3:visited { color: #fff; } 



.sp_menu{
	width:100%;
	font-size:1.2rem;
	padding-left:0px;
	margin-bottom:15px;
}

.sp_menu A {text-decoration: none; }
.sp_menu A:link { color: #fff;} 
.sp_menu A:visited { color: #fff; } 
.sp_menu A:hover { color: #deff00; } 
.sp_menu A:active { color: #c60000; } 


.sp_menu_title{
	height:40px;
	line-height:40px;
	font-size:1.6rem;
	font-weight:bold;
	text-align:center;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#fff;
	padding:0px 10px;
	border-bottom:1px solid #a50c59;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eb6391+24,be3c68+100 */
background: #eb6391; /* Old browsers */
background: -moz-linear-gradient(top, #eb6391 24%, #be3c68 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #eb6391 24%,#be3c68 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #eb6391 24%,#be3c68 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eb6391', endColorstr='#be3c68',GradientType=0 ); /* IE6-9 */
}


.sp_menu_s_title{
	font-size:1.2rem;
	font-weight:bold;
	color:#fff;
	padding:10px;
	background-color:#2F76DF;
	border-top:1px solid #488EF5;
	border-bottom:1px solid #1355B8;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

}


.sp_menu_li01{
	width:100%;
	margin:0px;
}

.sp_menu_li01 a{
	font-size:1.2rem;
	font-weight:bold;
	color:#fff;
	padding:10px;
	background-color:#ffa8d4;
	border-top:1px solid #ffd0e8;
	border-bottom:1px solid #a50c59;
	display:block;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.sp_menu_li01 a:hover {
	background-color:#ea86b9;
	color: #FFC127;

}
	
.sp_menu_li02 a{
	font-size:1.2rem;
	font-weight:bold;
	color:#fff;
	padding:10px;
	background-color:#d683ad;
	border-top:1px solid #ffd0e8;
	border-bottom:1px solid #a50c59;
	display:block;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.sp_menu_li02 a:hover {
	background-color:#d683ad;
	color: #fff;
}
	
}
/*********　パンくずリスト********/

.pankuzu{
	width: 1200px;
	padding: 5px 0px 5px 5px;
	margin: 10px auto;
	border-top: 1px solid #999;
	border-bottom: 1px solid #999;
}

.pankuzu A:link { color: #ea6290; } 
.pankuzu A:visited { color: #ea6290; } 
.pankuzu A:hover { color: #FF6600; } 



/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {
	
.pankuzu{
	width: 100%;
	font-size: 10px;
}
	
}
/*********　コンテンツ枠　********/
.contents_waku{
	width: 1200px;
	margin: 0px auto;
}

.contents_left{
	width: 940px;
	float: left;
	display: inline;
}

.contents_right{
	width: 240px;
	float: right;
	display: inline;	
}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {
	
.contents_waku{
	width: 98%;
	margin: 0px auto;
}

.contents_left{
	width: 100%;
	float: none;
	display: block;
}

.contents_right{
	width: 100%;
	float: none;
	display: block;
}	
	
}

/*********　ページタイトル　********/
.page_title{
	width: 100%;
	height: 75px;
	line-height: 75px;
	color: #696969;
	font-size: 22px;
	padding-left: 10px;
	margin: 0px auto 30px auto;
	border: 1px solid #ccc;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fafafa+43,fafafa+43,c8c8c8+100 */
	background: #fafafa; /* Old browsers */
	background: -moz-linear-gradient(top, #fafafa 43%, #fafafa 43%, #c8c8c8 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fafafa 43%,#fafafa 43%,#c8c8c8 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fafafa 43%,#fafafa 43%,#c8c8c8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#c8c8c8',GradientType=0 ); /* IE6-9 */
}

.page_title h2{
	font-size: 22px;
	font-weight: 100;
	margin: 0px;
	padding: 0px;
}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {	

.page_title{
	width: 100%;
	height: 40px;
	line-height: 40px;
	color: #696969;
	font-size: 16px;
	padding-left: 5px;
	margin: 0px auto 15px auto;
	border: 1px solid #ccc;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fafafa+43,fafafa+43,c8c8c8+100 */
	background: #fafafa; /* Old browsers */
	background: -moz-linear-gradient(top, #fafafa 43%, #fafafa 43%, #c8c8c8 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fafafa 43%,#fafafa 43%,#c8c8c8 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fafafa 43%,#fafafa 43%,#c8c8c8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#c8c8c8',GradientType=0 ); /* IE6-9 */
}

	
.page_title h2{
	font-size: 16px;
}
	
}
/*********　Mタイトル　********/

.m_title{
	width: 100%;
	height: 40px;
	line-height: 40px;
	margin: 0px auto 20px auto;
	background-color: #ff6bb5;
	color: #fff;padding-left: 10px;
}

.m_title h3{
	font-size: 20px;
	font-weight: 100;
	margin: 0px;
	padding: 0px;
}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {	

.m_title{
	width: 100%;
	height: 30px;
	line-height: 30px;
	margin: 0px auto 20px auto;
}

.m_title h3{
	font-size: 14px;
}
	
}
/*********　sタイトル　********/
.s_title{
	margin-bottom: 30px;
}


.s_title h4{
	display: block;
	font-size: 16px;
	color: #ff6bb5;
	padding-bottom: 5px;
	margin-bottom: 30px;
	border-bottom: 3px dotted #ff6bb5;
}



/*********　サイドカラム　********/


.banner{
	width: 100%;
	height: auto;
	margin-bottom: 5px;
}

.banner img{
	width: 100%;
	height: auto;
}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {	

.banner{
	width: 48%;
	height: auto;
	margin: 0px 1% 5px 1%;
	float: left;
	display: inline;
}
	
}

/*******地域テキストナビ******/

.tiiki_waku{
	width: 100%;
	background-color: #ffe5ee;
}

.tiiki{
	width: 1200px;
	padding: 20px 0px;
	margin: 0px auto;
}


.tiiki_s_waku{
	width: 200px;
	height: auto;
	float: left;
	display: inline;
}


.tiiki_li01{
	width: 90%;
	background-color: #ffa4c3;
	padding: 5px 0px;
	text-align: center;
	color: #fff;
	font-weight: bold;
	margin-bottom: 10px;
}

.tiiki_li02{
	padding-left: 70px;
	margin-bottom: 5px;
	color: #aaa;
}

.tiiki_li02 A:link { color: #666; } 
.tiiki_li02 A:hover { color: #FF6600; } 
.tiiki_li02 A:visited { color: #666; } 


/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {
	
.tiiki_waku{
	width: 100%;
	background-color: #ffe5ee;
}

.tiiki{
	width: 98%;
	padding: 20px 0px;
	margin: 0px auto;
}
	
.tiiki_s_waku{
	width: 100%;
	height: auto;
	float: left;
	display: inline;
}
	
	
.tiiki_li01{
	width: 100%;
	background-color: #ffa4c3;
	padding: 5px 0px;
	text-align: center;
	color: #fff;
	font-weight: bold;
	margin-bottom: 10px;
}

.tiiki_li02{
	width: 25%;
	float: left;
	display: inline;
	padding-left: 0px;
	margin-bottom: 5px;
	text-align: center;
}
	
}


/*******フッター******/

.footer_waku{
	width: 100%;
	height: auto;
	background-color: #ea6290;
}

.footer{
	width: 1200px;
	height: auto;
	margin: 0px auto;
	padding: 20px 0px;
}

.footer_l{
	width: 240px;
	height: auto;
	float: left;
	display: inline;
	padding-bottom: 10px;
}

.footer_r{
	width: 500px;
	text-align: right;
	padding-right: 10px;
	height: auto;
	float: right;
	display: inline;
	color: #fff;
}

.footer_r A:link { color: #fff; } 
.footer_r A:hover { color: #ffde00; } 
.footer_r A:visited { color: #fff; } 

.footer_li01{
	margin-top: 3px;
	margin-bottom: 5px;
}

.footer_li02{
	margin-bottom: 0px;
}


.sp_footer{
	display: none;
}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {
	
.footer{
	display: none;
}
	
.sp_footer{
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	color: #fff;
	background-color: #ea6290;	
	margin: 0px;
	text-align: center;
	font-size: 12px;
}

}
/********************ページの先頭へ********************/


.pagetop_sp {
	display: none;
	position: fixed;
	bottom: 0px;
	right: 0px;
	margin-bottom:97px;
}

.pagetop_sp a {
	display: block;
	padding:10px 30px;
	background: #ea6290;/*＜ページの先頭へのカラー変更ポイント＞*/
	color: #fff;        /*＜ページの先頭への文字カラー変更ポイント＞*/
	border-radius: 5px 5px 0px 0px;
	text-align: center;
	font-size:1.8rem;
	font-weight:bold;
	text-decoration: none;
	opacity: 0.7;
}


.pagetop_sp a:hover {
	background: #ff0000;/*＜ページの先頭へホバー時のカラー変更ポイント＞*/
	color: #fff;     /*＜ページの先頭へホバー時の文字カラー変更ポイント＞*/
}



/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 768px) {
	
.pagetop_sp {
	display: none;
	position: fixed;
	bottom: 0px;
	right: 0px;
	margin-bottom:40px;
}

.pagetop_sp a {
	padding:10px 10px;
	background: #ea6290;
	font-size:90%;
}

}

/* 画面サイズが768px以下の場合に適用 */
@media (max-width: 650px) {
	
	
.pagetop_sp {
	display: none;
	position: fixed;
	bottom: 0px;
	right: 0px;
	margin-bottom:40px;
}
	
	
}