/*
Theme Name: vividmore
Theme URI: 
Description: vividmoreオリジナルテーマ
*/


@charset "utf-8";
/*
10px:76.9%
11px:84.6%
12px:92.3%
13px:100%
14px:107.7%
15px:115.4%
16px:123.1%
17px:130.8%
18px:138.5%
*/




html, body, div, span, applet, object, iframe, strong,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, legend, caption, 
tbody, tfoot, thead, table, label, tr, th, td{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-style: inherit;
	font-size: 14px;
	font-family: inherit;
	vertical-align: baseline;
	list-style:none;
	}

html{
margin: 0;
padding: 0;
}
*{
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
}

body{
	font-family: 'Lucida Grande', Arial, 'Hiragino Kaku Gothic Pro', Meiryo, 'メイリオ', sans-serif;
	color: #4d4d4d;
	font-size: 14px;
	background-color: #faf8f3;} 

h1,h2,h3,h4,h5{font-weight: bold;}
a{ color: #1681b2; text-decoration: none; margin: 0; padding: 0;}
a:hover{ color: #3030c1; text-decoration: underline;}

.clear{ clear: both; line-height: 0}

p{
color: #4d4d4d;
}
.pd15{padding: 15px;}
.pd_tp10{
padding-top: 10px !important;
}
.mg_tp10{
margin-top: 10px !important;
}
.mg_tp15{
margin-top: 15px;
}
.mg_tp20{
margin-top: 20px;
}
.pd_tp15{padding-top: 15px;}
.pd_bt20{padding-bottom: 20px;}
.font12{font-size: 92.3%; line-height: 1.4;}
.text_right{text-align: right;}
/* CLEARFIX
------------------------------------------------------------------------------------*/
.clearfix:after {
content: '';
display: block;
clear: both;
height: 0;
}

.clearfix {display: inline-block;}
.clearfix {display: block;}

.clearfix {
  min-height: 1px;
}

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

	
/****************************************
		Header
*****************************************/
#header_line{
width: 100%;
height: 3px;
background: url(images/common/header/header_line.jpg) repeat-x;
}
#header_back{
width: 100%;
height: 93px;
background: url(images/common/header/header_back.jpg) repeat-x;
}
#header{
width: 980px;
margin: 0 auto;
}
#logo{
width: 200px;
height: 44px;
float: left;
margin: 23px 0 0 0;
}
#header_sub{
padding: 35px 0 0 20px;
float: left;
}

#pankuzu{
width: 980px;
margin: 3px auto 8px auto;
background: url(images/common/header/pankuzu_home.png) no-repeat left 2px;
}
#pankuzu a{font-size: 80%;}
#pankuzu p{padding: 0 0 0 18px; font-size: 80%;}

#sns{
width: 346px;
padding: 27px 0 0 0;
float: right;
}

/****************************************
		common
*****************************************/
#container{
width: 980px;
margin: 0 auto 60px auto;
}
.font18{font-size: 128.6%;}

/****************************************
		Left
*****************************************/
#left_box{
width: 655px;
float: left;
}

.genre_box{
width: 201px;
float: left;
margin: 0 11px 11px 0;
}
#genre_contens{
margin-bottom: 25px;
}
#genre01{
width: 207px;
height: 135px;
float: left;
margin: 0 13px 13px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #ff903c;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre02{
width: 207px;
height: 135px;
float: left;
margin: 0 13px 13px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #f1c40f;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre03{
width: 207px;
height: 135px;
float: left;
margin: 0 0 13px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #27ae60;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre04{
width: 207px;
height: 135px;
float: left;
margin: 0 13px 13px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #3498db;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre05{
width: 207px;
height: 135px;
float: left;
margin: 0 13px 13px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #9b59b6;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre06{
width: 207px;
height: 135px;
float: left;
margin: 0 0 13px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #d35400;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre07{
width: 207px;
height: 135px;
float: left;
margin: 0 13px 0 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #2980b9;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre08{
width: 207px;
height: 135px;
float: left;
margin: 0 13px 0 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #e46576;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
#genre09{
width: 207px;
height: 135px;
float: left;
margin: 0 0 0 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #7f8c8d;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}










.genre_box:nth-child(3n){
margin-right: 0;
}
.ttl_ul li{
padding-bottom: 5px;
line-height: 1;
}
.ttl_ul a{
font-size: 84.6% !important;
}
.genre_box h3{
width: 172px;
margin: 0 0 10px 0;
padding: 0 0 5px 30px;
}
.genre_left{
width: 90px;
float: left;
}
.genre_right{
width: 90px;
float: right;
}

.ttl_line{
border-bottom: 1px dotted #c4c4c4;
}
.ttl_ul{
padding: 10px;
}
.genre_icon01{
background: url(images/common/genre/genre_icon01.jpg) no-repeat left 2px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon02{
background: url(images/common/genre/genre_icon02.jpg) no-repeat left 2px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon03{
background: url(images/common/genre/genre_icon03.jpg) no-repeat left 2px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon04{
background: url(images/common/genre/genre_icon04.jpg) no-repeat left 2px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon05{
background: url(images/common/genre/genre_icon05.jpg) no-repeat left 1px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon06{
background: url(images/common/genre/genre_icon06.jpg) no-repeat left 1px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon07{
background: url(images/common/genre/genre_icon07.jpg) no-repeat left 1px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon08{
background: url(images/common/genre/genre_icon08.jpg) no-repeat left 2px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.genre_icon09{
background: url(images/common/genre/genre_icon09.jpg) no-repeat left -2px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}
.kuchikomi_icon{
height: 19px;
background: url(images/common/icon/kuchikomi_icon.png) no-repeat left 1px;
margin: 10px 0 0 10px;
padding: 0 0 10px 30px;
}



.genre_list01{
background: url(images/common/genre/genre_list01.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list02{
background: url(images/common/genre/genre_list02.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list03{
background: url(images/common/genre/genre_list03.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list04{
background: url(images/common/genre/genre_list04.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list05{
background: url(images/common/genre/genre_list05.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list06{
background: url(images/common/genre/genre_list06.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list07{
background: url(images/common/genre/genre_list07.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list08{
background: url(images/common/genre/genre_list08.jpg) no-repeat left 3px;
padding-left: 12px;
}
.genre_list09{
background: url(images/common/genre/genre_list09.jpg) no-repeat left 3px;
padding-left: 12px;
}

.ttl_box{
width: 625px;
margin-bottom: 15px;
padding: 15px;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-radius: 5px;        /* CSS3草案 */
-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
-moz-border-radius: 5px;   /* Firefox用 */ 
}
.ttl_box p{ padding: 10px 0;}


/****************************************
		Right
*****************************************/
#right_box{
width: 300px;
float: right;
}
#right_box h3{
font-size: 128.6%;
font-weight: bold;
padding-bottom: 7px;
}
#right_box p{
margin-bottom: 15px;
}
#right_box ul li{
width: 300px;
float: left;
padding: 5px 0;
border-bottom: 1px dotted #CCC;
}



/****************************************
		Footer
*****************************************/
#footer_back{
width: 100%;
background-color: #eeeadf;
padding-bottom: 20px;
border-top: 1px solid #ebe5d5;
}
#footer{
width: 980px;
margin: 0 auto;
}
.footer_menu{
float: right;
padding-top: 9px;
}
.footer_menu li {
float: left;
padding-right: 10px;
}
#footer_left {
width: 450px;
float: left;
margin: 15px 0 0 0;
}
#footer_right {
width: 450px;
float: right;
margin: 15px 0 0 0;
}
#footer_mane_box{
width: 980px;
padding: 30px 0 15px 0;
}
#footer_logo{
width: 160px;
height: 35px;
float: left;
}
#footer_copy_box{
background-color: #e1d9c4;
}
#footer_copy_box p{
text-align: center;
padding: 4px 0;
font-size: 92.3% !important;
}


/****************************************
		H3
*****************************************/
.money_h3{
font-size: 128.6%;
padding-bottom: 5px;
border-bottom: 1px dotted #c4c4c4;
}


/****************************************
		H4
*****************************************/
.no1_icon{
width: 400px;
height: 26px;
background: url(images/common/icon/no1_icon.png) no-repeat left 3px;
padding: 2px 0 15px 40px;
font-size: 128.6%;
float: left;
}
.no2_icon{
width: 400px;
height: 26px;
background: url(images/common/icon/no2_icon.png) no-repeat left 3px;
padding: 2px 0 15px 40px;
font-size: 128.6%;
float: left;
}
.no3_icon{
width: 400px;
/*height: 26px;*/
background: url(images/common/icon/no3_icon.png) no-repeat left 3px;
padding: 2px 0 15px 40px;
font-size: 128.6%;
float: left;
}
.ranking_name a{font-size: 128.6%;}
.boder_h4{
border-bottom: 1px solid #CCC;
margin-bottom: 5px;
padding-bottom: 5px;
}

/****************************************
		Ranking contents
*****************************************/
.ranking_left{
width: 260px;
float: left;
}
.ranking_name{

margin-top: 10px;
}
.hyouka{
width: 117px;
float: right;
}
.hyouka_box{
width: 185px;
float: right;
}
.hyouka_title{
width: 65px;
float: left;
padding-top: 12px;
}
.hyouka img{float: right; padding-top: 8px;}
.ranking_right{
width: 350px;
float: right;
border-radius: 5px;/* CSS3草案 */
-webkit-border-radius: 5px;	/* Safari,Google Chrome用 */
-moz-border-radius: 5px;	/* Firefox用 */
border: 1px solid #e1e1e1;
}
.ranking_right01{
width: 350px;
float: right;
border-radius: 5px;/* CSS3草案 */
-webkit-border-radius: 5px;	/* Safari,Google Chrome用 */
-moz-border-radius: 5px;	/* Firefox用 */
}
.ranking_right p{
padding: 10px;
}
.ranking_btn{
width: 590px;
height: 65px;
margin: 15px auto 0 auto;
}
.ranking_contents{
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px dotted #e1e1e1;
}



/****************************************
		ttl_color
*****************************************/
.ttl_kuchikomi{
width: 653px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #bdbdbd;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
.ttl_gray{
width: 653px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #bdbdbd;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
.ttl_shouken{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #ff903c;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_recruit{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #f1c40f;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_insurance{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #27ae60;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_net{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #3498db;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_beauty{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #9b59b6;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_life{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #d35400;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_trouble{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #2980b9;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_health{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #7f8c8d;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.ttl_wedding{
width: 625px;
margin: 0 0 15px 0;
background-color: #FFF;
border: 1px solid #f4f1e9;
border-top: 4px solid #e46576;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}









.kuchikomi_list_box{
padding: 15px;
}
.kuchikomi_list{
margin-bottom: 15px;
}
.kuchikomi_man{
width: 52px;
float: left;
}
.kuchikomi_waku{
width: 540px;
float: right;
padding: 10px;
background-color: #FFF;
border: 1px solid #e1e1e1;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
.kuchikomi_category_box{
border-bottom: 1px dotted #e1e1e1;
}
.kuchikomi_category{
float: left
}
.kuchikomi_category p{}
.kuchikomi_category a{
font-size: 84.6%;
}
.kuchikomi_type{
float: left;
font-size: 84.6%;
border-right: 1px solid #CCC;
padding-right: 2px;
vertical-align: middle;
}

.kuchikomi_type_box{
float: right;
}
.kuchikomi_type_box p{
font-size: 84.6%;
text-align: right;
}
.kuchikomi_type p{
padding-top: 2px;
padding-right: 10px;
}
.kuchikomi_day{
float: right;
}
.kuchikomi_day p{
font-size: 84.6%;
line-height: 1;
padding-left: 10px;
padding-top: 2px;
}
.kuchikomi_waku h4{
width: 100%;
float: left;
padding: 10px 0 5px 0;
}
.kuchikomi_boder{
border-bottom: 1px dotted #CCC;
padding-bottom: 5px;
}
.kuchikomi_hyouka{
width: 88px;
float: left;
padding-right: 10px;
vertical-align: top;
}
.kuchikomi_hyouka5{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka5.jpg) no-repeat;
}
.kuchikomi_hyouka4_5{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka4_5.jpg) no-repeat;
}
.kuchikomi_hyouka4{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka4.jpg) no-repeat;
}
.kuchikomi_hyouka3_5{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka3_5.jpg) no-repeat;
}
.kuchikomi_hyouka3{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka3.jpg) no-repeat;
}
.kuchikomi_hyouka2_5{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka2_5.jpg) no-repeat;
}
.kuchikomi_hyouka2{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka2.jpg) no-repeat;
}
.kuchikomi_hyouka1_5{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka1_5.jpg) no-repeat;
}
.kuchikomi_hyouka1{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka1.jpg) no-repeat;
}
.kuchikomi_hyouka0_5{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka0_5.jpg) no-repeat;
}
.kuchikomi_hyouka0{
width: 88px;
height: 15px;
float: left;
padding-right: 10px;
vertical-align: top;
display: block;
background: url(images/common/icon/kuchiomi_hyouka0.jpg) no-repeat;
}


.page_box{padding: 15px 0 15px 0;}
.page_back{
width: 33.3%;
float: left;
text-align: left;
}
.page_center{
width: 33.3%;
float: left;
text-align: center;
}
.page_next{
width: 33.3%;
float: left;
text-align: right;
}




/****************************************
		ページネーション
*****************************************/
.pagination {
font-size: 108%;
font-weight: bold;
margin: 10px 0 25px;
text-align: center;
position: relative;
overflow: hidden;
}
.pagination .current, .pagination .inactive {
background: #fffcf5;
margin: 0 3px;
color: #fe6a10;
display: inline-block;
width: 2em;
height: 2em;
line-height: 2;
text-align: center;
border: solid 1px #ffe8b4;
}
.pagination .current {
background: #fe6a10;
color: #fff;
}
.pagination .current, .pagination .inactive {
background: #fffcf5;
margin: 0 3px;
color: #ff903c;
display: inline-block;
width: 2em;
height: 2em;
line-height: 2;
text-align: center;
border: solid 1px #ffe8b4;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}

.pagination .current {
background: #ff903c;
color: #fff;
}

.arrowPrevOff,.arrowNext,.arrowPrev,.arrowNextOff{
background: #fffcf5;
margin: 0 3px;
color: #ff903c;
display: inline-block;
width: 3.5em;
height: 2em;
line-height: 2;
text-align: center;
border: solid 1px #ffe8b4;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
