@charset "utf-8";
/*------------------------------------------------------------------------------------------
*
*
    footer_navigation.css
*
*
------------------------------------------------------------------------------------------ */
@media screen and (min-width : 769px){ 
/*------------------------------------------------------------------------------------------
*
*
    min-width : 769px
*
*
------------------------------------------------------------------------------------------ */
#contents_footer_nav_list div{ float: left;}
#contents_footer_nav_list .column01{ width: 140px;}
#contents_footer_nav_list .column02{ width: 140px;}
#contents_footer_nav_list .column03{ width: 130px;}
#contents_footer_nav_list .column04{ width: 130px;}
#contents_footer_nav_list .column05{ width: 165px;}
#contents_footer_nav_list .column06{ width: 90px;}
#contents_footer_nav_list .column07{ float: right; width: 100px;}
/* ------------------------------------------------------------ */

#contents_footer_navigation{
    min-width: 980px;
    padding: 0 0 40px 0;
    box-sizing: border-box;
    clear: both;
    color: #fff;
    background-color: #4a4f54;
    font-size: 13px;
}

#contents_footer_navigation:after{
    content: '';
    clear: both;
    display: block;
}

#contents_footer_navigation div:after{
    clear: both;
    display: block;
    content: '';
}

#contents_footer_navigation a{
    color: #fff;
    transition: all .1s ease;
}

#contents_footer_navigation a:hover{
    opacity: .7;
}

#contents_footer_inner{
    width: 930px;
    margin: 0 auto;
}

#contents_footer_topic_path{
    padding: 25px 0;
    margin: 0 0 25px 0;
    border-bottom: 1px solid #818488;
}

#contents_footer_topic_path li{
    display: inline-block;
    vertical-align: middle;
}

#contents_footer_topic_path li:after{
    content: '＞';
    margin: 0 0 0 5px;
}

#contents_footer_topic_path li:last-child:after{
    display: none;
}

#contents_footer_nav_list li a{
    color: #ccc;
    font-size: 12px;
}

#contents_footer_nav_list .parents{
    margin: 0 0 10px 0;
}

#contents_footer_nav_list li{
    margin: 0 0 7px 0;
}

}

@media screen and (max-width : 768px){ 
/*------------------------------------------------------------------------------------------
*
*
    max-width : 768px
*
*
------------------------------------------------------------------------------------------ */

/* ------------------------------------------------------------
*
    #contents_footer_navigation
*
------------------------------------------------------------ */
#contents_footer_navigation .switch_pc{
    display: none !important;
}

#contents_footer_navigation{
    padding: 0 !important;
    clear: both;
    color: #fff;
    background-color: #4a4f54;
    font-size: 13px;
}

#contents_footer_navigation:after{
    content: '';
    clear: both;
    display: block;
}

#contents_footer_navigation a{
    color: #fff;
    transition: opacity .1s ease;
}

#contents_footer_navigation a:hover{
    opacity: .7;
}

#contents_footer_navigation .has_child a:hover{
    opacity: 1 !important;
}

#contents_footer_inner{
    width: 100%;
    margin: 0 auto;
}

#contents_footer_topic_path{
    overflow: hidden;
    margin: 0;
    border-bottom: 1px solid #818488;
}

.only_sp #contents_footer_topic_path,
.only_sp #contents_footer_topic_path{ height: 55px;}

#contents_footer_topic_path ul{
    box-sizing: border-box;
    padding: 20px;
    white-space: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.only_sp #contents_footer_topic_path ul,
.only_sp #contents_footer_topic_path ul{ height: 70px;}

.only_sp #contents_footer_topic_path ul,
.only_tablet #contents_footer_topic_path ul{ overflow: scroll;}

#contents_footer_topic_path li{
    display: inline-block;
    vertical-align: middle;
}

#contents_footer_topic_path li:after{
    content: '＞';
    margin: 0 0 0 5px;
}

#contents_footer_topic_path li:last-child{ padding: 0 20px 0 0;}
#contents_footer_topic_path li:last-child:after{
    display: none;
}

#contents_footer_nav_list li a{
    color: #ccc;
    font-size: 12px;
    position: relative;
}

#contents_footer_nav_list div{ float: none; overflow: hidden;}
#contents_footer_nav_list .column01,
#contents_footer_nav_list .column02,
#contents_footer_nav_list .column03,
#contents_footer_nav_list .column04,
#contents_footer_nav_list .column05,
#contents_footer_nav_list .column06,
#contents_footer_nav_list .column07{ float: none; width: 100%; border-bottom: 1px solid #5e6267;}

#contents_footer_nav_list .parents{
    width: 100%;
    height: 50px;
    margin: 0;
    display: block;
    position: relative;
}

#contents_footer_nav_list .parents a{
    width: 100%;
    height: 50px;
    padding: 18px 20px;
    box-sizing: border-box;
    display: block;
    vertical-align: top;
    position: relative;
}

#contents_footer_navigation li a:after,
#contents_footer_navigation .parents a:after{
    content: '';
    width: 7px;
    height: 50px;
    display: block;
    background-image:url(../image_common/parts_ico_btm_nav_arrow.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 7px;
    position: absolute;
    top: 0;
    right: 24px;
    transition: all .1s ease;
    -webkit-transition: all .1s ease;
}

#contents_footer_navigation li a:hover:after,
#contents_footer_navigation .parents a:hover:after{
    right: 19px;
}

#contents_footer_navigation .parents.has_child a:after{
    width: 11px;
    background-image:url(../image_common/parts_ico_btm_nav_plus.png);
    background-size: 11px;
    right: 22px;
}

#contents_footer_navigation .parents.has_child.on a:after{
    background-image:url(../image_common/parts_ico_btm_nav_minus.png);
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
}

#contents_footer_nav_list li{
    width: 100%;
    height: 40px !important;
    display: block;
    margin: 0;
}


#contents_footer_nav_list li a{
    width: 100%;
    height: 40px !important;
    padding: 12px 20px 12px 45px;
    box-sizing: border-box;
    display: block;
    vertical-align: middle;
    position: relative;
}

#contents_footer_nav_list li a:after{
    height: 40px !important;
}


}