@charset "utf-8";

/* ==========================================================

title : ホームメイト・リサーチ　施設の基本情報投稿がスタート!!
scope : 基本情報投稿スタートPR　ページ

last modify : 2016/09/12 264_tanabe デザイン改修

2016/06/09 264_tanabe 専門学校カテゴリ追加対応
2016/05/31 227_suzuki 結婚式場カテゴリ追加対応

========================================================== */

/* ---------------------------------------
　リセット・基本
---------------------------------------- */
img{
	vertical-align: top;
}

button{
	border:0;
	padding:0;
	background:none;
	border:0;
	outline:0;
	-webkit-appearance:none;
	cursor:pointer;
}

/* ---------------------------------------
　ページ
---------------------------------------- */
#main{
	font-size:16px;
	text-align: left;
}
#main > .main_ttl{
	width:1000px;
	margin:0 auto;
}
.mod_intro{
	margin-bottom:60px;
}

/* ---- 投稿開始カテゴリ ----- */
.mod_intro .catelst{
	width: 700px;
	margin:30px auto;
}
.mod_intro .catelst .ttl{
  position:relative;
  height:50px;
	text-align:center;
  font-size:20px;
  font-weight:bold;
}
.mod_intro .catelst .ttl:before{
  position:absolute;
  bottom:0;
	left: 70px;
  content:"";
  width:56px;
  height:58px;
	background:url(../image/img_cate_add_panda02.png) no-repeat left bottom;
}
.mod_intro .catelst .ttl:after{
  position:absolute;
  top:5px;
  right:100px;
  content:"";
  width:30px;
  height:30px;
  background:url(../image/img_cate_add_pencil.png) no-repeat right center;
}

.mod_intro .catelst .ttl .pink_num {
  font-size:32px;
}
.mod_intro .catelst .ttl .pink_num:after {
  content:"個";
  font-size:20px;
}
.mod_intro .catelst .ttl .pink_tx,
.mod_intro .catelst .ttl .blue {
  font-size:28px;
}
.mod_intro .catelst .ttl .pink_num,
.mod_intro .catelst .ttl .pink_tx {
  color:#f74ba4;
}
.mod_intro .catelst .ttl .blue {
  color:#126ee0;
}

.mod_intro .catelst .list_newface dt {
  width:100%;
  padding:5px 0;
  text-align:center;
  font-size:20px;
  font-weight:bold;
  color:#fff;
  background-color:#1c77cf;
  border-radius: 5px 5px 0 0;
}
.mod_intro .catelst .list_newface dd {
  text-align:center;
  font-size:18px;
  background-color:#e8f2f9;
}
.mod_intro .catelst .list_newface dd ul {
  width: 450px;
  margin:0 auto;
  padding:15px 0 10px 0;
}
.mod_intro .catelst .list_newface dd li {
  display:inline-block;
  margin: 0 10px 5px 10px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .mod_intro .catelst .list_newface dd ul {
    width:520px;
  }
}

/* -------- */

.mod_intro > .lead{
	width:776px;
	margin:30px auto 35px;
	line-height: 1.5em;
}


/* ---- カテゴリBOX ---- */
.mod_category{
	width:900px;
	margin: 0 auto 30px;
}
.mod_category > .ttl{
	position: relative;
	display: block;
	width:900px;
	margin: 0 auto;
	padding: 10px 0;
	background: url(../image/bg_pattern01.png);
	color:#fff;
	font-size:27px;
	font-weight: bold;
	text-align: center;
}
.mod_category > .cont{
	padding:35px 25px 20px 25px;
	background: #FCFDED;
}
.mod_category .cate{
  position:relative;
	display: inline-block;
	vertical-align: top;
	width: 206px;
	height:80px;
	margin:0 0 20px;
}
.mod_category .cate a {
  display: block;
}
.mod_category .cate.new:after {
  content:"";
  position:absolute;
  top:-12px;
  left:-8px;
  width:48px;
  height:34px;
  background:url(../image/icon_new.png) no-repeat left top;
}
/*
.mod_category .cate:nth-child(4n+1){
	width: 300px;
}

.mod_category .cate.wide{
	width: 300px;
	margin-left: 165px;
}
*/
.mod_category .icon{
	display: table-cell;
	width: 60px;
	height: 60px;
}
.mod_category .cate a:hover .icon{
	opacity:0.8;
}
.mod_category .name{
	display: table-cell;
	vertical-align:middle;
	padding: 0 0 0 8px;
	font-size: 14px;
	font-weight: bold;
}
.mod_category .note{
	text-indent: -1em;
	margin:0 0 0 1em;
}

/* ---- 操作方法 ---- */
.mod_howto{
	width:900px;
	margin:0 auto 60px;
	background: #F3F9FF;
}
.mod_howto > .ttl{
	position: relative;
	display: block;
	width:900px;
	margin: 0 auto 25px;
	padding: 10px 0;
	background: url(../image/bg_pattern02.png);
	color:#fff;
	font-size:27px;
	text-align: center;
}
.mod_howto > .ttl:before{
	content:"";
	position: absolute;
	width:70px;
	height:83px;
	bottom:-10px;
	left:25px;
	background:url(../image/ttl_img_howto.png) no-repeat center;
}
.mod_howto > .lead{
	width:650px;
	margin:0 auto;
}

/* ---- 操作方法 セクション ---- */
.mod_sect{
    width: 850px;
    margin: 30px auto 0;
    padding: 0 0 45px;
    border-bottom: 2px solid #e3e3e3;
}
.mod_sect:last-child{
	border-bottom:none;
}
.mod_sect > .ttl{
	text-align: center;
	margin: 0 auto 20px;
}
.mod_sect .txt{
	width: 656px;
	margin:0 auto;
	line-height:1.5em;
}
.mod_sect .kome{
    text-indent: -1em;
}
.mod_sect .fig{
	width: 709px;
	margin: 20px auto 0;
	text-align: center;
}

/* ------------------------------------
 「投稿ユーザー」への登録
-------------------------------------- */
.user_touroku_box {
	box-sizing:border-box;
	width: 480px;
	margin: 30px auto 50px;
	padding: 15px;
	background: #fff0f5;
	text-align: center;
}
.user_touroku_box > .lead{
	font-size:15px;
	text-align: center;
}
.user_touroku_box > .cont{
	margin:10px 0 0;
}
.user_touroku_box > .cont dt{
  color: #706f6f;
  font-size: 18px;
  font-weight: bold;
}
.user_touroku_box > .cont dd {
	width: 311px;
	margin: 9px auto 5px;
	text-align: center;
}
.user_touroku_box > .cont dd a:hover{
	opacity: 0.8;
}

.mo_box{
	margin-bottom:40px;
		
}

/* ------------------------------------
 topへ戻る
-------------------------------------- */
.gopagetop{
	width: 180px;
	height: 25px;
	display: block;
	margin: 0 15px 4px auto;
	padding: 0 0 0 25px;
	line-height: 18px;
	background: url(/topic/user_tokuten/image_cmn/mrk_gopagetop.gif) no-repeat 0 0;
}

/* ------------------------------------
 カテゴリアイコンスライド
-------------------------------------- */
/* 開閉ボタン */
.mod_intro .opn_cate{
	position: relative;
	display: block;
	width:518px;
	height:60px;
	margin:0 auto;
	overflow: hidden;
}
.mod_intro .opn_cate:hover{
	opacity:0.8;	
}
.mod_intro .opn_cate > img{
	position: absolute;
	top:0;
	left:0;
	pointer-events: none;
}
.mod_intro .opn_cate.active > img{
	top:auto;
	bottom:0;
}

/* スライド */
.mod_cate_nav{
	display:none;
	position: relative;
	width: 775px;
	margin:0 auto 25px;
}
.mod_cate_nav img{
	pointer-events: none;
}
.mod_cate_nav > .ttl{
	position: relative;
	height:50px;
	line-height:50px;
	margin-top:25px;
	background: #85da74;
	text-align:center;
}
.mod_cate_nav > .ttl::before{
	content: "";
	position: absolute;
	width:46px;
	height: 25px;
	top: -25px;
	left: 0;
	right: 0;
	margin: 0 auto;
	background: url(/image/top/cate_nav/ttl_hukidashi.png) no-repeat;
}
.mod_cate_nav > .ttl > img{
	position: absolute;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    height:62px;
}
.mod_cate_nav .close{
	position: absolute;
	height:35px;
	top:9px;
	right:25px;
	overflow:hidden;
}
.mod_cate_nav .close:hover img{
	margin-top:-35px;
}
.mod_cate_nav .cont{
	position: relative;
	font-size:0;
	width: 775px;
	height: 320px;
	overflow: hidden;
	border-radius: 0 0 15px 15px;
	text-align:left;
}
.mod_cate_nav .cont > .slide{
	position: absolute;
	width: 1550px;
}
.mod_cate_nav .cont > .slide:after{
	content: "";
	display: table;
	clear: both;
}

.mod_cate_nav .list{
	position: relative;
	float: left;
	display: block;
	box-sizing:border-box;
	width: 775px;
	height: 320px;
}
.mod_cate_nav .list.main{
	padding: 100px 330px 0 ;
	background: url(/image/top/cate_nav/bg_main.png) no-repeat 0 bottom;
}
.mod_cate_nav .list.sub{
	display: none;
	background-position: 0 bottom;
	background-repeat: no-repeat;
	background-size: cover;
}

/*カテゴリアイコン*/
.mod_cate_nav .list li{
	float: left;
	padding: 14px 21px;
}
.mod_cate_nav .list li > a{
	position:relative;
	overflow:hidden;
	display: block;
	width: 75px;
	height: 75px;
	border-radius: 11px;
	box-shadow: 0 6px 6px 0 rgba(0,0,0,0.5);
}
.mod_cate_nav .list li > a >img{
	position:absolute;
}

/*カテゴリアイコンスプライト*/
.mod_cate_nav .list li:nth-child(1) > a img{top: 0; left: 0; }
.mod_cate_nav .list li:nth-child(2) > a img{top: 0; left: -76px; }
.mod_cate_nav .list li:nth-child(3) > a img{top: 0;left: -152px;}
.mod_cate_nav .list li:nth-child(4) > a img{top: 0;left: -229px;}
.mod_cate_nav .list li:nth-child(5) > a img{top: 0;left: -305px;}

.mod_cate_nav .list li:nth-child(6) > a img{top: -76px;left: 0;}
.mod_cate_nav .list li:nth-child(7) > a img{top: -76px;left: -76px;}
.mod_cate_nav .list li:nth-child(8) > a img{top: -76px; left: -152px; }
.mod_cate_nav .list li:nth-child(9) > a img{top: -76px;left: -229px;}
.mod_cate_nav .list li:nth-child(10) > a img{top: -76px;left: -305px;}

.mod_cate_nav .list li:nth-child(11) > a img{top: -152px;left: 0;}
.mod_cate_nav .list li:nth-child(12) > a img{top: -152px;left: -76px;}
.mod_cate_nav .list li:nth-child(13) > a img{top: -152px;left: -152px;}
.mod_cate_nav .list li:nth-child(14) > a img{top: -152px;left: -229px;}
.mod_cate_nav .list li:nth-child(15) > a img{ top: -152px; left: -305px; }

.mod_cate_nav .list li:nth-child(16) > a img{top: -229px;left: 0;}
.mod_cate_nav .list li:nth-child(17) > a img{top: -229px;left: -76px;}
.mod_cate_nav .list li:nth-child(18) > a img{top: -229px;left: -152px;}
.mod_cate_nav .list li:nth-child(19) > a img{top: -229px;left: -229px;}
.mod_cate_nav .list li:nth-child(20) > a img{top: -229px;left: -305px;}


.mod_cate_nav .list li.n01 > a img{top: 0; left: 0; }
.mod_cate_nav .list li.n02 > a img{top: 0; left: -76px; }
.mod_cate_nav .list li.n03 > a img{top: 0;left: -152px;}
.mod_cate_nav .list li.n04 > a img{top: 0;left: -229px;}
.mod_cate_nav .list li.n05 > a img{top: 0;left: -305px;}
.mod_cate_nav .list li.n06 > a img{top: -76px;left: 0;}
.mod_cate_nav .list li.n07 > a img{top: -76px;left: -76px;}
.mod_cate_nav .list li.n08 > a img{top: -76px; left: -152px; }
.mod_cate_nav .list li.n09 > a img{top: -76px;left: -229px;}
.mod_cate_nav .list li.n10 > a img{top: -76px;left: -305px;}
.mod_cate_nav .list li.n11 > a img{top: -152px;left: 0;}
.mod_cate_nav .list li.n12 > a img{top: -152px;left: -76px;}
.mod_cate_nav .list li.n13 > a img{top: -152px;left: -152px;}
.mod_cate_nav .list li.n14 > a img{top: -152px;left: -229px;}
.mod_cate_nav .list li.n15 > a img{ top: -152px; left: -305px; }
.mod_cate_nav .list li.n16 > a img{top: -229px;left: 0;}
.mod_cate_nav .list li.n17 > a img{top: -229px;left: -76px;}
.mod_cate_nav .list li.n18 > a img{top: -229px;left: -152px;}
.mod_cate_nav .list li.n19 > a img{top: -229px;left: -229px;}
.mod_cate_nav .list li.n20 > a img{top: -229px;left: -305px;}


.mod_cate_nav .list li > a:hover::after{
	content:"";
	position: absolute;
	width:91px;
	height:91px;
	top:0;
	left:0;
	background:rgba(255,255,255,0.2);
}

/* 全てから探すアイコン */
.mod_cate_nav .list .all{
	padding: 14px 17px 2px;
}

.mod_cate_nav .list .all > a{
	width: 82px;
	height: 92px;
	margin-top: -5px;
	box-shadow:none;
}
.mod_cate_nav .list .all > a:hover::after{
	content:none;
}
.mod_cate_nav .list .all > a:hover img{
	margin-top: -92px;
}

/* サブカテゴリ　アイコンレイアウト 縦 列*/
.mod_cate_nav .col6 {padding: 0 34px;}
.mod_cate_nav .col6 li{padding: 14px 21px;}
.mod_cate_nav .col6 .all{padding: 12px 16px 4px;}
.mod_cate_nav .col5 {padding: 0 94px;}
.mod_cate_nav .col4 {padding: 0 152px;}
.mod_cate_nav .col3 {padding: 0 212px;}
.mod_cate_nav .col2 {padding: 0 268px;}
.mod_cate_nav .col1 {padding: 0 330px;}


/* サブカテゴリ　アイコンレイアウト 横 段*/
.mod_cate_nav .low3 {padding-top: 18px;}
.mod_cate_nav .low2 {padding-top: 18px;}
.mod_cate_nav .low1 {padding-top: 78px;}

/* サブカテゴリ　背景*/
.mod_cate_nav .list.clinic {background-image: url(/image/top/cate_nav/bg_clinic.png);}
.mod_cate_nav .list.company {background-image: url(/image/top/cate_nav/bg_company.png);}
.mod_cate_nav .list.finance {background-image: url(/image/top/cate_nav/bg_finance.png);}
.mod_cate_nav .list.senmon {background-image: url(/image/top/cate_nav/bg_senmon.png);}
.mod_cate_nav .list.school {background-image: url(/image/top/cate_nav/bg_school.png);}
.mod_cate_nav .list.zooplant {background-image: url(/image/top/cate_nav/bg_zooplant.png);}
.mod_cate_nav .list.tour {background-image: url(/image/top/cate_nav/bg_tour.png);}
.mod_cate_nav .list.restaurant {background-image: url(/image/top/cate_nav/bg_restaurant.png);}
.mod_cate_nav .list.masscomi {background-image: url(/image/top/cate_nav/bg_masscomi.png);}
.mod_cate_nav .list.shop {background-image: url(/image/top/cate_nav/bg_shop.png);}
.mod_cate_nav .list.public {background-image: url(/image/top/cate_nav/bg_public.png);}
.mod_cate_nav .list.sports {background-image: url(/image/top/cate_nav/bg_sports.png);}
.mod_cate_nav .list.traffic {background-image: url(/image/top/cate_nav/bg_traffic.png);}

/* カテゴリスライドボタン */
.mod_cate_nav button{
	border:0;
	padding:0;
	background:none;
	border:0;
	outline:0;
	-webkit-appearance:none;
	cursor:pointer;
}
.mod_cate_nav .btn_area{
	display: none;
	position: absolute;
	width: 100%;
	height: 48px;
	margin:0 auto;
	bottom: 24px;
	text-align: center;
}
.mod_cate_nav .btn_area .back{
	position: relative;
	display: inline-block;
	width: 204px;
	height: 48px;
	overflow: hidden;
	vertical-align: top;
}
.mod_cate_nav .btn_area .back img{
	position: absolute;
	top:0;
	left: 0;
}
.mod_cate_nav .btn_area .back img:hover{
	top:-48px;
}
.mod_cate_nav .btn_area .page{
	position: relative;
	display: none;
	width: 48px;
	height: 48px;
	overflow: hidden;
	vertical-align: top;
}
.mod_cate_nav .btn_area .page img{
	position: absolute;
	left: 0;
}
.mod_cate_nav .btn_area .page.crent img{
	cursor:initial;
}
.mod_cate_nav .btn_area .page1 img{	top:0;}
.mod_cate_nav .btn_area .page1 img:hover{	top:-48px;}
.mod_cate_nav .btn_area .page1.crent img{	top:-96px;}
.mod_cate_nav .btn_area .page2 img{ top:-144px;}
.mod_cate_nav .btn_area .page2 img:hover{ top:-192px;}
.mod_cate_nav .btn_area .page2.crent img{	top:-240px;}
.mod_cate_nav .btn_area .page3 img{ top:-288px;}
.mod_cate_nav .btn_area .page3 img:hover{	top:-336px;}
.mod_cate_nav .btn_area .page3.crent img{	top:-384px}

/* サブカテゴリ　左右ボタン　前ページ　次ページ*/
.mod_cate_nav .btn_area2 .page_back,
.mod_cate_nav .btn_area2 .page_next{
	position: absolute;
	display: none;
	width:18px;
	height:30px;
	top: 164px;
	overflow: hidden;
}
.mod_cate_nav .btn_area2 .page_back{
	left:15px;
}
.mod_cate_nav .btn_area2 .page_next{
	right: 15px;
}
.mod_cate_nav .btn_area2 .page_back img{
	position: absolute;
	top: -540px;
	left:0;
}
.mod_cate_nav .btn_area2 .page_next img{
	position: absolute;
	top: -540px;
	right:0;
}
.mod_cate_nav .btn_area2 .page_back:hover img{
	top: -575px;
}
.mod_cate_nav .btn_area2 .page_next:hover img{
	top:-575px;
}

/*複数ページカテゴリ*/
.mod_cate_nav .sub_page{
	position: relative;
	float:left;
	box-sizing:border-box;
	width: 775px;
	height: 420px;
}
.mod_cate_nav .clinic .sub_slide{ width:2880px; }
.mod_cate_nav .company .sub_slide{ width:1920px; }
.mod_cate_nav .senmon .sub_slide{ width:1920px; }


/* 注記テキスト */
.mod_cate_nav .list li.note{
	float: none;
	position:absolute;
	display: inline-block;
	bottom: 162px;
	left:0;
	right:0;
	margin:0 auto;
	padding: 0;
	text-align: center;
	font-size: 15px;
	font-weight:bold;
	letter-spacing: 0.05em;
}