@charset "utf-8";
/* formatting style ------------------------------*/
/* -----------------------------------------*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, 
fieldset, input, textarea, p, blockquote, th, td{
    margin: 0; 
    padding: 0;
}

html{
    overflow-y: scroll;
}
h1, h2, h3, h4, h5, h6{
    font-size: 100%; 
    font-weight: normal;
}
ol, ul{
    list-style:none;
}
fieldset, img{
     border:0;
}

caption, th{
    text-align: left;
}
address, caption, cite, code, dfn, em, strong, th, var{
    font-style: normal; 
    font-weight: normal;
}


hr{
	display:none;
}


html {
	margin-bottom:1px;
	height:100%;
}

/* line style　------------------------------*/
/* -----------------------------------------*/

a img{
	border-style:none;
}

/* link style ------------------------------*/
/* -----------------------------------------*/
a:link {
	color: #212121;
	text-decoration: none;	
}
a:visited {  color: #212121;
	text-decoration: none;	}

a:hover {
	color: #999;
	text-decoration: none;
}
a:active {
	color: #999;
	text-decoration: none; 
}

.link_line{
	text-decoration: underline;
}


.clear {
	clear: both;
	height: 0;
	visibility: hidden;
	display: block;
}

/* body ------------------------------*/
/* -----------------------------------------*/

body {
	color: #212121;
	/*font-family:'MS PGothic', sans-serif;*/
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", ".HiraKakuInterface-W2";
    font-weight: 300;
	/*	font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
*/	font-size: 13px;
	line-height: 20px;	
	}

/* ヘッダーの固定 */
#header-fixed
{
	position: fixed;            /* ヘッダーの固定 */
	top: 0px;                   /* 位置(上0px) */
	left: 0px;                  /* 位置(右0px) */
	width: 100%;                /* 横幅100%　*/
	height: 140px;              /* 縦幅100px */
	z-index: 101;
}
#header_outside {
	background-image: url(../img/common_img/nav_img/g_nav_bg170711.png);
	background-repeat: repeat-x;
	background-position: center top;
	height: 140px;
	width: 100%;
}

 
 
#header {
	height: 100%;
	width: 980px;              /* 横の幅970px */
	margin: auto;              /* 中央揃え */
	position: relative;
}
z
/* header */
.header_seotxt{
	font-size: 10px;
	position: absolute;
	left: 0px;
	top: 0px;
}

#top .header_name {
	height: 45px;
	width: 212px;
	padding-top: 20px;	
}

.header_name {
	height: 45px;
	width: 212px;
	padding-top: 10px;	
}

.hbt_nav {
	position: absolute;
	top: 0px;
	right: 0px;
}

.hbt_nav li {
	float: left;	
}

.hbt_nav li a{
	display:block;
	overflow:hidden;
	margin:15px 2px;
	background-repeat:no-repeat;
	text-indent:-9999px;
	background: url(../img/common_img/nav_img/btn_cta.png);
	width:185px;
	height:55px;
}
.hbt_nav li a#btn_catalog{
	background-position:0 0;
}
.hbt_nav li a#btn_catalog:hover{
	background-position:0 -55px;
}

.hbt_nav li a#btn_store{
	background-position:-185px 0;
}
.hbt_nav li a#btn_store:hover{
	background-position:-185px -55px;
}

.hbt_nav li a#btn_yoyaku{
	background-position:-370px 0;
}
.hbt_nav li a#btn_yoyaku:hover{
	background-position:-370px -55px;
}

/*.header_sns {
	position: absolute;
	top: 10px;
	left: 660px;
}

.header_sns li {
	float: left;
	margin-right: 10px;
	}*/

.g_nav {
	position: absolute;
	left: 0px;
	top: 92px;	
}

.

/* #pan ------------------------------*/

#pan_box{
	padding-top: 5px;
}

ul#topicPath {
	list-style-type: none;
	font-size: 11px;
	text-align: left;
	width: 980px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 5px;
	margin-top: 0px;
	padding: 0;
} 

ul#topicPath li{  
    display: inline;  
}  
ul#topicPath li ul{  
    display: inline;  
    margin: 0;  
    padding: 0;  
}  
ul#topicPath strong{
	font-style: normal;
	font-weight: normal;
}  
ul#topicPath a{
	text-decoration: none;
} 

ul#topicPath a:hover{
	color: #999;	
}  





/* -----------------------------------------*/


/* ボディの定義 */
#top #wrapper_outside{
	padding-top: 140px;	/*padding:40px 0 50px 0;*/    /* 上下の余白を取る */
	}

#wrapper_outside{
	padding-top: 140px;	
}

#top #wrapper{
	zoom: 100%;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

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

#wrapper{
	zoom: 100%;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 50px;
	margin-left: auto;
}

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

#shosai #wrapper, 
#ichiran #wrapper{
	zoom: 100%;
	margin-top: auto;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

#shosai #wrapper:after,
#ichiran #wrapper:after {
height: 0;
visibility: hidden;
content: ".";
display: block;
clear: both;
}


/* ----------------*/
#inside #contents_outside,
#inside_lace #contents_outside,
#inside_hakama #contents_outside,
#inside_w980 #contents_outside{
}

#shosai #contents_outside,
#ichiran #contents_outside{
	background-color: rgba(255,255,255,1);
	width: 100%;	/*background-color: #eeeeee;*/
}


/* ------------------------------------------------------------------------------------------------*/
/* トップページの定義 */
/* ------------------------------------------------------------------------------------------------*/
#top_main{
	background-image: url(../img/index_img/top_img.png);
	background-repeat: no-repeat;
	background-position: center top;
	height: 700px;
	width: 100%;
}


#oshirase_box_outside {
	
	background-color: #F2EEDA;
}

#oshirase_box {
	width: 980px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 15px;
	padding-bottom: 15px;
	zoom: 100%;
}

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


.oshirase_list    {
    display:table;
    table-layout: fixed;
    width:100%;
	border-collapse: separate;  /* セルの間隔を空ける */
    border-spacing: 20px 0;  /* 左右 上下で記述 */
}
.oshirase_list li{
	display:table-cell;
	vertical-align:middle;
	text-align:left;
	line-height: 18px;	
}

.oshirase_list li.oshirase_title{
	width: 8em;
	background-color: #7b002f;
	text-align: center;
	color: #FFF;
}

/* ---------------- */
/* ----------------*/
#top_box {
	width: 1200px;
	margin-right: auto;
	margin-left: auto;
	zoom: 100%;
	margin-top: 50px;
}

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

.top_title{
	text-align: center;
	margin-bottom: 20px;
}

.top_bnr_list{
	/*font-family: "游明朝体", "Yu Mincho", YuMincho, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ 明朝", sans-serif;*/
	/*font-family: "游明朝体", "Yu Mincho", "YuMincho", serif;*/
	font-size:12pt;
	width: 930px;
	height:250px;
	margin: 0 auto 80px;
}

.top_bnr_list li{
	float: left;
	margin-right: 23px;
	width: 209px;
	text-align:center;
}

.top_bnr_list li:last-child{
	margin-right: 0px;
}

.top_bnr_list li h3{
	margin: 10px auto 12px;
	color:#744f21;
	font-size:18pt;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.top_bnr_list li a{
	display:block;
	width:206px;
	height:51px;
	line-height:51px;
	border:solid 2px #222;
	background-image:linear-gradient(-45deg, #F2EEE6 50%, #fff 50%, #fff);
	font-size:12pt;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	box-shadow:3px 3px #D9D9D9;
	text-align:center;
	margin-top: 20px;
}

.top_selection_list{
	 width:951px;
	 height:80px;
	 margin:0 auto;
}

.top_selection_list li a{
	display:block;
	overflow:hidden;
	margin:15px 6px;
	float:left;
	background-repeat:no-repeat;
	text-indent:-9999px;
	background: url(../img/index_img/btn_top_selection02.png);
	width:305px;
	height:79px;
}

.top_selection_list li a#select_color{
	background-position:0 0;
}
.top_selection_list li a#select_color:hover{
	background-position:0 -79px;
}
.top_selection_list li a#select_budget{
	background-position:-305px 0;
}
.top_selection_list li a#select_budget:hover{
	background-position:-305px -79px;
}
.top_selection_list li a#select_hakama{
	background-position:-610px 0;
}
.top_selection_list li a#select_hakama:hover{
	background-position:-610px -79px;
}

/*----*/
.top_reason_box {
	width:			285px;
	height:			285px;
	overflow:		hidden;
	position:		relative;
	margin-bottom: 10px;
}
.top_reason_box .caption {
	color:			#fff;
	padding-top:		112px;
	padding-left:		0px;
	width: 245px;
	text-align: center;
}

.top_bnr_list a:hover .top_reason_box .caption  img {
	/*opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";*/
	/*opacity: 1.0;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";*/
}

.top_reason_box .mask {
	width:			100%;
	height:			100%;
	position:		absolute;
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgba(0,0,0,0.5);
	-webkit-transition:	all 0.6s ease;
	transition:		all 0.6s ease;
}
.top_reason_box:hover .mask {
	opacity:		1;	/* マスクを表示する */
	padding-left:		20px;	/* 右にずらす */
}

/*----*/


.top_campaign_txt_box{
	text-align: center;
	margin-bottom: 80px;
}

.top_campaign_list{
	zoom: 100%;
	text-align: left;
}

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

.top_campaign_list li{
	float: left;
	margin-right: 20px;
	width: 590px;
}

.top_campaign_list li:last-child{
	margin-right: 0px;
}

.top_campaign_list li img{
	vertical-align: bottom;
	margin-bottom: 10px;
}



.top_special_box01{
	text-align: center;
	margin-bottom: 50px;
	width: 940px;
	margin-right: auto;
	margin-left: auto;
	
}
.top_bnr_list_title{
	color:#D24756;
	font-weight:100;
	margin:12px 0;
	font-size:14pt;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.top_sub_contents{
	clear:both;
	width:940px;
	display:table;
	margin:0 auto 60px;
}
.top_sub_contents li{
	float:left;
	width:290px;
	margin-right:35px;
	margin-bottom:20px;
}
.top_sub_contents li:nth-child(3n){
	margin-right:0;
}
.top_sub_contents li img{
	border:1px solid #CCCCCC;
}

li.top_sub_contents_2c{
	float:left;
	width:450px;
	margin-right:35px;
	margin-bottom:20px;
}
li.top_sub_contents_2c:nth-child(2n){
	margin-right:0;
}

/* ---------------- */
/* ----------------*/


.sns_box {
	width: 890px;
	margin-right: auto;
	margin-left: auto;
	zoom: 100%;
	/*background-color: #faf4e7;*/
	padding: 30px 155px;
}

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


.twitter_box {
	/*height: 520px;
	width: 465px;
	margin-bottom: 20px;*/
	/*width: 940px;*/
	width: 280px;
	margin-right: auto;
	margin-left: auto;
	zoom: 100%;
	float: left;	
}

.insta_box{
	width: 560px;
	margin-right: auto;
	margin-left: auto;
	zoom: 100%;
	float: right;
}

/*#top_info_box {
	width: 940px;
	margin-right: auto;
	margin-left: auto;
	zoom: 100%;
	background-color: #faf4e7;
	margin-bottom: 80px;
	padding: 20px;
}

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

.top_info_content {
	height: 80px;
	overflow:hidden;

}

*/


/* ---------------- */
/* ----------------*/

#top_tenpo_box_outside {
	background-color: #eeeeee;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666666;
	}

#top_tenpo_box {
	width: 980px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 50px;
	padding-bottom: 50px;
	zoom: 100%;
}

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

.top_box06_area_title{
	font-size: 14px;
	padding-left: 5px;
	margin-bottom: 5px;
	border-bottom: 1px solid rgba(0,0,0,1);
    box-shadow: 0 1px 0 rgba(255,255,255,0.5);
}


.top_box06_tenpo_wrap{
	zoom: 100%;
    
}

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

.top_box06_tenpo_wrap li{
	float: left;
	width: 312px;	
}



.top_box06_tenpo{
	display:table;
	table-layout: fixed;
	width: 307px;
	padding-left: 5px;
}
.top_box06_tenpo li{
	display:table-cell;
	vertical-align:middle;
	text-align:left;
	width: 25%;
	line-height: 24px;
}

.top_box06_tenpo li.minatomirai{
	display:table-cell;
	vertical-align:middle;
	text-align:left;
	width: 50%;
}
.top_bottom_txt_box {
	padding: 20px;
	border: 1px solid #CB9510;
	background-color: #FFF;
	text-align: center;
	-moz-box-shadow: 1px 1px 1px #666;
	-webkit-box-shadow: 1px 1px 1px #666;
	box-shadow: 1px 1px 1px #666;

}


/* -top page kokomade---------------*/



/*tomonokai yuzenco nado*/
#inside_w980 #contents{
	width:980px;
	zoom: 100%;
	margin: auto;
/*	background-color: #eee;
*/}

#inside_w920 #contents{
	width:920px;
	zoom: 100%;
	margin: auto;
	padding-right: 30px;
	padding-left: 30px;
/*	background-color: #ccc;
*/}

#inside #contents{
	width:980px;
	zoom: 100%;
	background-image: url(../img/common_img/contents_bg.jpg);
	background-repeat: repeat-y;
	margin: auto;
}

#inside_lace #contents{
	width:980px;
	zoom: 100%;
	margin: auto;
	background-image: url(../img/common_img/contents_lace_bg.png);
	background-repeat: repeat-y;
}

#inside_hakama_tokuten #contents{
	width:980px;
	zoom: 100%;
	margin: auto;
	background-image: url(../img/common_img/contents_hakama_tokuten_bg.png);
	background-repeat: repeat-y;
}

#inside_hakama #contents{
	width:980px;
	zoom: 100%;
	margin: auto;
	background-image: url(../img/common_img/contents_hakama_bg.png);
	background-repeat: repeat-y;
}

#inside_traditional #contents{
	width:980px;
	zoom: 100%;
	margin: auto;
	background-image: url(../img/common_img/contents_traditional_bg.png);
	background-repeat: repeat-y;
}




#top #contents:after,
#inside_w980 #contents:after,
#inside_w920 #contents:after,
#inside #contents:after,
#inside_lace #contents:after,
#inside_hakama #contents:after,
#inside_hakama_tokuten #contents:after,
#inside_traditional #contents:after{
height: 0;
visibility: hidden;
content: ".";
display: block;
clear: both;
}

#shosai #contents,
#ichiran #contents {
	zoom: 100%;
	margin: auto;
}

#shosai #contents:after,
#ichiran #contents:after{
height: 0;
visibility: hidden;
content: ".";
display: block;
clear: both;
}

/* ----------------*/

#top #main,
{
	width: 980px;
}

#inside #main{
	float: left;
	width: 700px;
	padding-right: 19px;

}

#inside_lace #main,
#inside_hakama_tokuten #main{
	float: left;
	width: 700px;
	padding-right: 19px;
	/*padding-left: 19px;*/
	/*padding-top: 20px;
	padding-bottom: 20px;*/
}

#inside_hakama #main{
	float: left;
	width: 700px;
	padding-right: 19px;
/*	padding-left: 19px;
*/}


#inside_traditional #main{
	float: left;
	width: 700px;
	padding-right: 10px;
	padding-left: 10px;
	color: #FFF;
	padding-top: 10px;
	}





#top #side,
#ichiran #side,
#shosai #side,
#inside_w980 #side,
#inside_w920 #side{
	display: none;
}

#inside #side,
#inside_lace #side,
#inside_hakama #side,
#inside_hakama_tokuten #side,
#inside_traditional #side{
	float: right;
	width: 240px;
}

/*.side_map_box{
	height: 250px;
	width: 240px;
	position: relative;
	
}


.sbt_hokkaido {
	height: 62px;
	width: 62px;
	position: absolute;
	left: 161px;
	top: 38px;
}
.sbt_kanto {
	display: block;
	height: 62px;
	width: 62px;
	position: absolute;
	left: 174px;
	top: 142px;
}

.sbt_tokai {
	display: block;
	height: 62px;
	width: 62px;
	position: absolute;
	left: 109px;
	top: 97px;
}

.sbt_chugoku {
	display: block;
	height: 62px;
	width: 62px;
	position: absolute;
	left: 53px;
	top:134px;
}

.sbt_kinnki {
	display: block;
	height: 62px;
	width: 62px;
	position: absolute;
	left: 102px;
	top: 165px;
}

.sbt_kyushu {
	display: block;
	height: 62px;
	width: 62px;
	position: absolute;
	left: 3px;
	top:185px;
}

*/

.sbt_list li{
	font-size: 0px;
	line-height: 0px;
	width: 240px;
	margin-bottom: 10px;	
}




.top_link6 li {
	float: left;
	height: 80px;
	width: 121px;
}





 
#footer_outside
{
	background-image: url(../img/common_img/footer_bg170711.png);
	background-repeat: repeat-x;
	background-position: center top;
	width: 100%;
	height: 450px;
}

 #footer {
	width: 980px;              /* 横の幅970px */
	margin: auto;              /* 中央揃え */
	position: relative;
	zoom: 100%;
}

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


.footer_company_nav {
	position: absolute;
	top: 0px;
	right: 0px;
	line-height: 30px;
	text-align: right;
	height: 30px;
}

.footer_company_nav li {
	display: inline;
}

.footer_company_nav li a {
	color: #fff;
}

.footer_company_nav li a:hover {
	color: #999;	
}

.footer_company_nav li:before {
	content: url(../img/common_img/footer_arrow_white.png);
	padding-right: 5px;
	padding-left: 2em;
}

.footer_sns {
	position: absolute;
	left: 0px;
	top: 50px;
}

.footer_sns li {
	display: inline;
	
}

.footer_list {
	float: left;
	width: 220px;
	
}

.footer_list li a {
	font-size: 11px;
	line-height: 16px;
}

.footer_list li a:hover {
	color: #999;	
}

.footer_list li ul li {
	padding-left: 1em;	
}

.footer_list li a:before {
	content: url(../img/common_img/footer_arrow.png);
	padding-right: 5px;
}
.footer_list_box {
	position: absolute;
	top: 100px;
}
.footer_QR {
	height: 140px;
	width: 220px;
	position: absolute;
	top: 50px;
	right: 0px;
}

.footer_seo{
	font-size: 10px;
	position: absolute;
	left: 0px;
	top: 410px;
}



address {
	font-size: 11px;
	position: absolute;
	right: 0px;
	top: 380px;
}






/* フッターの隙間消去 */
iframe[name="google_conversion_frame"] { position: absolute; top: 0; }

.sp-next-arrow:after,.sp-next-arrow:before,.sp-previous-arrow:after,.sp-previous-arrow:before
{background-color:#ccc!important;}
