@charset "utf-8";
/* CSS Document */
/*
==============================================================
    Cecile Faq layout CSS
    Version: 5th Sep. 2012
============================================================ */
.cursor {
   /* transform: rotate(180deg);*/
    display: block;
    float: right;
    transition-duration: 200ms;
}
.cursor2 {
    transform: rotate(180deg);
    transition-duration: 200ms;
        position: relative;
    right: 1.5%;
}


.btn8022{
        position: relative;
    z-index: 2;
}

.toglle{
    /*display: none;*/
   cursor:pointer;
}
.clearfix:after {
  clear: both;
  content: '';
  display: block;
}
   a.anchor{
       display: block;
    padding-top: 60px;
    margin-top: -90px;
}


.section-site {
    margin-top: 90px;
}



/* ==================================================
	main：メインエリア
================================================== */
 #main{
	margin: 32px 0 32px 0;
	width: 714px;
	float: right;
}

 #main div.title{
	width: 714px;
	padding: 0 0 4px 0;
	position: relative;
	margin: 32px 0 0 0;
}

 #main div.title:first-child{
	margin: 0;
}

 #main div.title h2{
	margin: 0;
	color: #fff;
	font-size: 116%;
	padding: 7px 0 7px 0px;
	background: linear-gradient(to bottom, #f9965c 0%,#ff7f04 100%);
}

 #main p.lead{
	margin: 5px 4px 0 4px;
}

 #main p.link{
	margin: 8px 0 0 0;
	text-align: right;
}

 #main p.link a{
	padding: 0 0 0 9px;
	background: url(/component/img/common/icon_arrow_b.gif) 0 0.45em no-repeat;
}

 #main .attention{
	margin: 0 0 20px 0;
}

/* ========================================
	narrow-detail：絞り込み条件表示
======================================== */
#main .narrow-detail{
	margin: 0 0 24px 0;
	padding: 6px 0 0 0;
	width: 714px;
	background: url(/component/img/common/main/main_box_w714_bg_hd.gif) left top no-repeat;
}

#main .narrow-detail div{
	width: 702px;
	padding: 0 6px 6px 6px;
	background: url(/component/img/common/main/main_box_w714_bg.gif) left bottom no-repeat;
	overflow: hidden;
}


#main .narrow-detail div table{
	width: 702px;
	margin: -1px 0 0 0;
}

#main .narrow-detail div table tr{
	background: url(/component/img/common/main/main_border_dotted_h.gif) 2px 0 repeat-x;
}

#main .narrow-detail div table th{
	padding: 1px 0 0 15px;
	width: 103px;
	vertical-align: middle;
	text-align: left;
}

#main .narrow-detail div table th span{
	display: block;
	padding: 6px 15px 6px 0;
	width: 88px;
	background: transparent url(/component/img/search/result/narrow_detail_hd_bg.gif) right center no-repeat;
}

#main .narrow-detail div table td{
	vertical-align: middle;
	padding: 7px 15px 6px 15px;
}

/* ========================================
	faq-box：FAQボックス
======================================== */
/*.color333 {
    color: #333!important;
}*/


 #main .faq-box{
	margin: 12px 0 0 0;
	padding: 0;
	width: 714px;
	background: url(/component/img/common/main/table_box714_bg.gif) left top repeat-y;
}

 #main .faq-box .faq-box-wrap{
	padding: 5px 0 0 0;
	width: 714px;
	background: url(/component/img/common/main/table_box714_bg_hd.gif) left top no-repeat;
}

 #main .faq-box .faq-box-wrap .faq-box-in{
	padding: 0 0 5px 0;
	width: 714px;
	background: url(/component/img/common/main/table_box714_bg_ft.gif) left bottom no-repeat;
}

 #main .faq-box ul{
	margin: 0 5px;
	padding: 0 1px;
	width: 700px;
	border: solid 1px #d2c8bb;
	background: #fff;
	overflow: hidden;
}

 #main .faq-box ul li{
	margin: -1px 0 0 0;
	padding: 0;
	border-top: solid 1px #d2c8bb;
}

 #main .faq-box ul li a{
	padding: 7px 10px 0 27px;
	min-height: 28px;
	display: block;
	font-size: 116%;
	background: #fff url(/component/img/common/main/main_box_title_marker_bg.gif) left top no-repeat;
	font-weight: bold;
	line-height: 1.5;
}
.categories-list-sp{
    display: none;
}
.categories-list-pc{
    display: block;
}
/* ========================================
	anser-box：FAQ詳細
======================================== */


 #main .result-list{
	margin: 24px 0 24px 0;
	padding: 0;
	width: 714px;
}

 #main .result-list .result-box{
	margin: 20px 0 0 0;
	padding: 0;
	width: 714px;
	background: url(/component/img/common/main/main_box_w714_bg.gif) left top repeat-y;
}

 #main .result-list .result-box div.result-box-in{
	padding: 0 0 5px 0;
	background: url(/component/img/common/main/main_box_w714_bg_ft.gif) left bottom no-repeat;
}
/*
 #main .result-box ul li a{
	padding: 7px 10px 0 27px;
	min-height: 28px;
	display: block;
	font-size: 116%;
	background: #fff url(/component/img/common/main/main_box_title_marker_bg.gif) left top no-repeat;
	font-weight: bold;
	line-height: 1.5;
}*/

 #main .result-list .result-box dl{
	margin: 0;
	padding: 6px 6px 0 6px;
	background: url(/component/img/common/main/main_box_w714_bg_hd.gif) left top no-repeat;
}

 #main .result-list .result-box dl dt{
	margin: 0;
	padding: 5px 10px 5px 32px;
	text-indent: -20px;
	border: solid 1px #fff;
	background: #fff url(/component/img/common/main/main_box_title_bg.gif) left top repeat-x;
	font-size: 116%;
	font-weight: bold;
	line-height: 1.5;
}

 #main .result-list .result-box dl dd{
	margin: 0 1px;
	padding: 10px 10px 10px 34px;
	text-indent: -22px;
	border-top: solid 1px #d2c8bb;
	font-size: 116%;
}

 #main .result-list .result-box dl dd span{
	margin: 0 5px 0 0;
	font-weight: bold;
}

/* ========================================
	anser-box：FAQ詳細
======================================== */
 #main .anser-box{
	margin: 30px 0 0 0;
	padding: 0;
	width: 714px;
	background: url(/component/img/common/main/table_box714_bg.gif) left top repeat-y;
}

 #main .anser-box:first-child{
	margin: 0;
}

 #main .anser-box div.title{
	padding: 0 0 0px 0;
}

 #main .anser-box .anser-box-in{
	padding: 0px 0 5px 0;
	width: 714px;
}

 #main .anser-box .anser-box-in table{
	width: 714px;
	margin: 0 0px;
	border: solid 1px #d2c8bb;
	background: #fff;
}

 #main .anser-box .anser-box-in table td{
	font-size: 100%;
}

 #main .anser-box .anser-box-in table td:first-child{
	text-align: center;
	font-size: 133%;
	font-weight: bold;
}


 #main .anser-box .anser-box-in table tr.title td{
	font-weight: bold;
	padding: 9px 10px 9px 0;
	border: solid 1px #fff;
	border-left: none;
	background: #fff url(/component/img/common/main/main_box_title_bg.gif) left top repeat-x;
    border-bottom: dotted 1px #999;
}

 #main .anser-box .anser-box-in table tr.title td:first-child{
	text-align: center;
	padding: 7px 5px;
	width: 33px;
	border-left: solid 1px #fff;
	border-right: none;
}

 #main .anser-box .anser-box-in table tr.detail td{
	vertical-align: top;
	background: #fff url(/component/img/common/main/main_border_dotted_h.gif) 2px 0 repeat-x;
	padding: 9px 10px 9px 0;
	line-height: 1.6;
     word-break: break-all;
}

 #main .anser-box .anser-box-in table tr.detail td:first-child{
	padding: 6px 5px;
}


/* ========================================
	search-guide：検索方法
======================================== */
 #main .search-guide .lead{
	font-size: 133%;
	font-weight: bold;
	margin: 0 0 12px 0;
}

/* ==================================================
	side：左サイド
================================================== */
 .side{
	    width: 300px;
    float: left;
    margin: 35px 0px 0px 0px;
    position: fixed;
    top: 60px;
    left: 60px;
}

 .side div.title{
	margin: 0;
	padding: 0 0 8px 0;
	width: 100%;
	    background: linear-gradient(to bottom, #f9965c 0%,#ff7f04 100%);
}

 .side div.title h2{
	margin: 0;
	padding: 7px 5px 0 14px;
	color: #fff;
	font-size: 116%;
	min-height: 21px;
	width: 100%;
     text-align: center;
}

/* ========================================
	search-box：よくあるご質問（FAQ）
======================================== */

 .side .search-box{
	width: 230px;
	background: #fff url(/component/img/common/side/side_box_bg.gif) left bottom no-repeat;
}

 .side .search-box .box-in{
	padding: 5px 5px 7px 5px;
	background: url(/component/img/common/side/side_box_bg_hd.gif) left top no-repeat;
}

 .side .search-box form{
	border: solid 1px #f1ece6;
	background: #fff;
	padding: 16px 10px 14px 10px;
}

 .side .search-box .search-txt{
	margin: 0 0 14px 0;
	width: 198px;
	height: 24px;
	background: url(/component/img/common/side/search_txt_bg.gif) left top no-repeat;
}

 .side .search-box .search-txt input{
	border: none;
	padding: 3px 6px 2px 6px;
	width: 186px;
	height: 19px;
	background: transparent;
}

*:first-child+html  .side .search-box .search-txt input{
	margin: -1px;
	padding: 5px 6px 0 6px;
	height: 19px;
}

 .side .search-box .btn{
	text-align: center;
	margin: 0;
}

/* ========================================
	categories-list：よくあるご質問（FAQ）
======================================== */

 .side .categories-list{
	margin: 30px 0 0 0;
	background: #fff url(/component/img/common/side/side_box_border_bg.gif) left bottom no-repeat;
	padding: 0 0 8px 0;
}

 .side .categories-list ul{
	/*margin: 1px 7px 0 7px;*/
	padding: 0;
	width: 100%;
	overflow: hidden;
         border-bottom: solid 1px #d2c8bb;
    border-right: solid 1px #d2c8bb;
    border-left: solid 1px #d2c8bb;
     margin: 0;
}

 .side .categories-list li{
/*	margin: -1px 0 0 0;*/
	padding: 0;
	border-top: solid 1px #d2c8bb;
     width: 100%;
}

 .side .categories-list li a{
	padding: 6px 6px 7px 55px;
	min-height: 16px;
	width: 100%;
	display: block;
	background: #fff url(/component/img/common/side/categories_title_bg.gif) left top no-repeat;
	font-weight: bold;
	line-height: 1.5;
     position: relative;
    z-index: 2;
}
/* ========================================
	guide-list：ご利用ガイド
======================================== */

 .side .guide-list{
	margin: 30px 0 0 0;
	background: #fff url(/component/img/common/side/side_box_border_bg.gif) left bottom no-repeat;
	padding: 0 0 8px 0;
}

 .side .guide-list ul{
	margin: 1px 7px 0 7px;
	padding: 0;
	width: 216px;
	overflow: hidden;
}

 .side .guide-list li{
	margin: -1px 0 0 0;
	padding: 0;
	border-top: solid 1px #d2c8bb;
}

 .side .guide-list li a{
	padding: 6px 6px 7px 24px;
	min-height: 16px;
	width: 186px;
	display: block;
	background: #fff url(/component/img/common/side/categories_title_bg.gif) left top no-repeat;
	font-weight: bold;
	line-height: 1.5;
}

 .side .guide-list li a img{
	margin: 0 0 0 5px;
	vertical-align: -2px;
}



/* ========================================
	inquiry-box：各種お問い合わせ
======================================== */
 #inquiry{
	margin: 0 0 30px 0;
	clear: both;
}
 #inquiry div.title{
	margin: 0;
}

 #inquiry .lead{
	text-align: left;
	font-size: 116%;
	margin: 8px 10px 0 10px;
	line-height: 1.5;
}

 .inquiry-table{
	margin: 12px 0 0 0;
	width: 958px;
	background: #d2c8bb;
	table-layout: fixed;
}

 .inquiry-table th{
	text-align: center;
	padding: 9px 0;
	font-size: 116%;
	border: solid 1px #fff;
	background: url(/component/img/common/main/table_title_bg.gif) left top;
}

 .inquiry-table th.internet{
	width: 310px;
}

 .inquiry-table th.tel{
	width: 322px;
}

 .inquiry-table th.fax{
	width: 316px;
}

 .inquiry-table td{
	line-height: 1.5;
	background: #fff;
	vertical-align: top;
	text-align: left;
}

 .inquiry-table td p{
	margin: 0 0 8px 0;
}

 .inquiry-table td.internet{
	padding: 9px 14px;
}

 .inquiry-table td.internet p.link a{
	font-weight: bold;
	padding: 0 0 0 9px;
	background: url(/component/img/common/icon_arrow_l.gif) 0 0.25em no-repeat;
}

 .inquiry-table td.tel p{
	margin: 9px 0 8px 15px;
}

 .inquiry-table td.tel p.title{
	text-align: center;
	font-weight: bold;
	margin: 0 0 6px 0;
}

 .inquiry-table td.tel p.freedial{
	font-size: 83%;
}

 .inquiry-table td.tel p.freedial img{
	margin: 0 3px 0 0;
	vertical-align: middle;
}

 .inquiry-table td.tel p.note{
	margin: 0 15px 12px 15px;
	padding: 3px 10px 4px 10px;
}

 .inquiry-table td.tel .internet{
	margin: 11px 0 0 0;
}

 .inquiry-table td.tel .order,
 .inquiry-table td.tel .catalog{
	padding: 11px 0 0 0;
	background: url(/component/img/common/main/main_border_dotted_h.gif) 2px 0 repeat-x;
}

 .inquiry-table td.fax{
	padding: 12px 15px 0 15px;
}

 .inquiry-table td.fax p.freedial{
	margin: 0 0 8px 0;
	font-size: 83%;
}

 .inquiry-table td.fax p.freedial img{
	margin: 0 3px 0 0;
	vertical-align: middle;
}
 .inquiry-table td.fax ul.note{
	margin: 0;
}

/*-----footer-----*/
.p-bo0822{
    padding-bottom: 3%;
}
@media screen and (max-width: 1200px){
    .section-site {
       margin-left: 180px;
}
}

@media screen and (max-width: 768px){
    .categories-list-pc{
            display: none;
}
    .categories-list-sp{
            display:block;
}
    .side {
    top: 60px;
    left: 10px;
}
     .side {
    width: 90%;
     float: none; 
    margin: 80px auto 0px;
    position: relative;
     top: auto; 
     left: auto; 
}   
    .section-site {
     margin-left: 0px; 
}
    .section-site {
    width: 100%;
    margin: 0 auto 5rem;
    
}
    .section-site {
    margin-top: 0px;
}
    #main {
    margin: 32px auto 0;
    width: 93%;
     float: none; 
}
    #main .anser-box {
    width: 100%;
}
    #main div.title {
    width: 100%;
}
    #main .anser-box .anser-box-in {
    width: 100%;
}
    #main .anser-box .anser-box-in table {
    width: 100%;
}
 .header {
    width: 768px;
}  
    #app{
        overflow: hidden;
    }
}