@charset 'UTF-8';

#faq .faq-method{
display: flex;
margin: 0;
    justify-content: center;
}
#faq .faq-method div{
    width:auto;
    margin: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: bold;
}
.h4_offLink h1 span.h4Con,
.h4_onLink h1 span.h4Con,
.h4_offLink h2 span.h4Con,
.h4_onLink h2 span.h4Con,
.h4_offLink h3 span.h4Con,
.h4_onLink h3 span.h4Con {
    background : url("/share/images/h4_bg_1co.gif") repeat-y left center;
    
    display : block;
    background-color : #fbfbfb;
    padding-left : 20px;
    position : relative;
}
.h4_offLink,
.h4_onLink {
    background: url("/share/images/h4_bg_btm_1co.gif") no-repeat bottom center;
    padding-bottom : 13px;
}
.h4_offLink h1,
.h4_onLink h1,
.h4_offLink h2,
.h4_onLink h2,
.h4_offLink h3,
.h4_onLink h3 {
    font-size:140%;
    background: url("/share/images/h4_bg_top_1co.gif") no-repeat top center;
    padding-top : 12px;
}
.indent3{
    padding-left: 3em;
    text-indent: -3em;
}
.indent1{
    padding-left: 1em;
    text-indent: -1em;
}

@media all and (min-width: 960px) {
#rightContent .h4_offLink h1 span.h4Con,
#rightContent .h4_onLink h1 span.h4Con,
#rightContent .h4_offLink h2 span.h4Con,
#rightContent .h4_onLink h2 span.h4Con,
#rightContent .h4_offLink h3 span.h4Con,
#rightContent .h4_onLink h3 span.h4Con {
    background : url("/share/images/h4_bg_2co.gif") repeat-y left center;

}
#rightContent .h4_offLink,
#rightContent .h4_onLink {
    background: url("/share/images/h4_bg_btm_2co.gif") no-repeat bottom center;
}
#rightContent .h4_offLink h1,
#rightContent .h4_onLink h1,
#rightContent .h4_offLink h2,
#rightContent .h4_onLink h2,
#rightContent .h4_offLink h3,
#rightContent .h4_onLink h3 {
    background: url("/share/images/h4_bg_top_2co.gif") no-repeat top center;
}
}
/*-------------------------------- h3_3co -----*/
.h3_3co {
    background : url(/share/images/h3_bg_btm_1co.gif) repeat-y left;
    font-size : 180%;
    border-bottom-style : solid;
    border-bottom-width : 3px;
}
.h3_3co .h3TxtWrap {
    background : url(/share/images/h3_bg_top_1co.gif) no-repeat top center;
    display : block;
    padding : 16px 20px 7px;
}
@media all and (min-width: 960px) {
#rightContent .h3_3co {
  background : url(/share/images/h3_bg_btm_3co.gif) repeat-y left;
}
#rightContent .h3_3co .h3TxtWrap {
  background : url(/share/images/h3_bg_top_3co.gif) no-repeat top center;
}
}

.ind1 {
	padding-left: 1em;
	text-indent: -1em;
}

.ind2 {
	padding-left: 2em;
	text-indent: -2em;
}

.ind3 {
	padding-left: 3em;
	text-indent: -3em;
}


/*IRレスポンシブ*/
#inner-content-area {
    margin-bottom: 40px;
}

#content {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}

#rightContent,
#leftNav2 {
    float: none !important;
}

#footer_breadcrumb+#footer {
    margin-top: 0;
}

img {
    max-width: 100%;
}
#faq ul.list-btn.narrow li{
	width: auto;
}


@media all and (max-width: 979px) {

    #rightContent .h3_3co .h3TxtWrap {
        background : none;
      }

    #inner-content-area,
    #rightContent {
        width: auto;
    }

    #content {
        flex-direction: column;
    }

    #rightContent {
        padding: 15px;
    }

    #leftNav2 {
        width: auto;
    }

    #leftNav2>a>img,
    #leftNav2>.cattitle::before {
        display: none;
    }

    #leftNav2>.cattitle {
        padding: .25em 1em;
        ;
    }

    #leftNav2>ul {
        border: none;
    }

    .h3_3co {
        font-size: 18px;

        margin-bottom: 1em !important;
        padding: 10px 0 5px;

        border: solid 1px #ccc;
        border-bottom-width: 3px;
        border-bottom-color: #ff4d4d;
        border-radius: 3px 3px 0 0;
        background: none;
    }

    .h3_3co .h3TxtWrap {
        padding: 0 10px;

        background: none;
    }



    .bgOn {
        font-size: 14px;

        margin-bottom: 20px !important;
    }


    .relationLink {
        max-width: 100%;
    }

    #relation dl {
        float: none;

        width: calc(100% / 2.1);
        padding: 10px 0;
    }

    #relation .boxWrap {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    #relation dl dt {
        padding: 0;
    }

    #relation h5 {
        position: relative;

        overflow: hidden;

        box-sizing: border-box;
        width: 100%;
        height: 37px;

        border-right: solid 1px #ccc;
    }
    #relation img {
        max-width: none;
   }

    #relation img[src$='relative_link.gif'] {
        position: absolute;
        top: 0;

        width: auto;
        max-width: none;
        height: 52px;
    }
}


.justify-item {
	display: block;
	width: calc(100% - 1em);
	margin: 0 auto;
	text-align-last: justify;
}


.vertical-item {
	text-align: center;
	letter-spacing: .15em;

	writing-mode: vertical-rl;
}


@media screen and (max-width:639px) {
	.swipe-item {
		overflow-x: auto;

		max-width: 100%;
	}

	.swipe-item table {
		width: 639px;
	}

	.swipe-item .sticky {
		position: sticky;
		left: 0;
	}

	.tablePattern02 .swipe-table-wrapper::before {
		font-size: 80%;
		font-weight: bold;
		display: block;
		width: 100%;

		content: '← スワイプしてご覧ください →';
		text-align: center;
		color: #ae6f12;
	}


	.tablePattern02 .swipe-item {
		border-left: solid 1px #ccc;
	}

	.tablePattern02 .swipe-table-wrapper table {
		position: relative;
		left: -1px;
		border-collapse: separate;
		border-right: none;
		border-left: none;
	}
}
/*スワイプ対応*/
.faq_swipe {
	overflow-x: auto;
	width: 100%;
}
 .table_wrapper .swipe_annotation,
.faq_swipe .swipe_annotation {
	display: none;
}

@media screen and (max-width:480px){

/*スワイプ対応*/
.faq_swipe .swipeIn {
	width: 600px;
	overflow: hidden;
}
	table#faq_data {
		width: 600px;
		overflow-x: auto;
	}
	.faq_swipe .swipe_annotation {
		display: block;
		font-size: 12px;
	}
	#faq .indent10 {
		text-indent: -1em;
		margin-left: 1em;
	}
	#faq .indent11 {
		text-indent: -1em;
		margin-left: 1em;
	}
}

@media print, screen and (max-width: 980px) {
    .container {
  width: 100%;
    }
#faq .page-category .page-category-title {
	width: 100%;
    font-size:70%;
}
.page-category .container:before {
    display:none;
}
.faq-method div{
    display:flex;
    flex-direction: column;
}
#faq .qa_relation_area ul.tabs {
    display:flex;
}

#faq .faq-categories > div > div{
	float:left;
	width: 100%;
	}
    #faq .faq-method{
        padding:10px;
        display: flex;
        flex-direction: column;
        }
    #faq .faq-categories > div + div{
        float:left;
        width:100%;
        }
        #faq ul.list-btn{
            width: 100%;
            }
            #faq ul.list-btn_l{
                display: flex;
                flex-direction: column;
                width: 100%;
                }
                #faq ul.list-btn_l li{
                    width: 90%;
                    }
                    #faq .btn-arrow_l {
                        width: 100%;
                    }
                    #faq .faq-method div{
                        width:100%;
                        }
                    #faq .faq-method div .cat1{
                        width:100%;
                        display: flex;
    flex-direction: column;
                        }  
                        #faq .faq-method ul{
                             width: 100%;
                             display: flex;
        flex-wrap: nowrap;
        justify-content: space-evenly;
        max-height: 40px;
        margin-left: 0px !important;
                            }  
                            #faq .faq-method div .cat2{
                                width: 100%;
                                margin-top: 5px;
                                margin-left: 0px !important;
                                }  
                                #faq .faq-method div .cat3{
                                    width: 100%;
                                    margin-top: 5px;
                                    margin-left: 0px !important;
                                    }   
                                    #faq .faq-method div .cat3 ul li a p{
                                       display: block;
                                        }  
                                        #faq .faq-method div .cat3 ul{
                                            max-height: 250px;

                                             }     
                                             #faq .faq-method div .cat3 li{
                                                width:32%
    
                                                 }     
                                                 #faq .faq-method div .cat3 li a{
                                                    min-height: 180px;
                                                    }     
 

}
@media print, screen and (max-width: 428px) {
#faq ul.list-btn.narrow{
    width:100%;
    display: flex;
    flex-direction: column;
}
#faq ul.list-btn.narrow li{
    width: 100%;
}
}