@charset "UTF-8";

/* lnavi.css
**************************************************************************************/


/* side-nav
=============================================================================*/

#side .lnavi-area {
    margin-bottom: 30px;
}
.under-1col #side .lnavi-area {
    display: none;
}
#side .category-area {
    min-height: 140px;
}
#side p.category {
    width: 100%;
}
#side p.category a {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 56px 32px;
    background:url("../../image/k18-lnavi-bg001.gif") repeat 0 0;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 18px;
    font-weight: 400;
}
#side div.lnavi a {
    text-decoration: none;
    color: #333;
}
#side div.lnavi a:hover {
    color: #FF9900;
}

/* second navi */
#side div.lnavi ul li {
    border-bottom: 1px solid #dadada;
    padding: 0;
}
#side div.lnavi ul li a {
    display: block;
    color: #333;
    padding: 14px 30px 14px 16px;
    background: url("../../image/k18-lnavi-ar001.gif") no-repeat top 20px right 16px;
}
#side div.lnavi ul li.current a{
    color: #00a3ac;
    background: url("../../image/k18-lnavi-ar002.gif") #f9f9f9 no-repeat top 20px right 16px;
}
#side div.lnavi ul li a:hover{
    color: #FF9900;
}
/* third navi */
#side div.lnavi ul li ul.third {
    padding: 0;
    margin: 0;
    background: #FFF;
}
#side div.lnavi ul li ul.third li {
    padding: 0;
    border-top: 1px solid #dadada;
    border-bottom: none;
}
#side div.lnavi ul li ul.third li a {
    display: block;
    color: #333;
    padding: 10px 30px 10px 26px;
    font-weight: normal;
    background: url("../../image/k18-lnavi-ar001.gif") no-repeat top 16px right 16px;
}
#side div.lnavi ul li ul.third li.current a{
    color: #00a3ac;
    background: url("../../image/k18-lnavi-ar002.gif") #f9f9f9 no-repeat top 16px right 16px;
}
#side div.lnavi ul li ul.third li a:hover{
    color: #FF9900;
}
/* fourth navi */
#side div.lnavi ul li ul.third li ul.fourth {
    margin: 0;
    padding: 0;
}
#side div.lnavi ul li ul.third li ul.fourth li {
    border-top: 1px solid #dadada;
}
#side div.lnavi ul li ul.third li ul.fourth li a {
    display: block;
    padding: 10px 30px 10px 40px;
    font-weight: normal;
    background: url("../../image/k18-lnavi-ar003.gif") #f9f9f9 no-repeat top 16px left 27px;
}
#side div.lnavi ul li ul.third li ul.fourth li.current a {
    color: #00a3ac;
    background: url("../../image/k18-lnavi-ar004.gif") #f9f9f9 no-repeat top 16px left 27px;
}
#side div.lnavi ul li ul.third li ul.fourth li a:hover{
    color: #FF9900;
}


@media screen and (max-width: 1279px){
#side .lnavi-area {
    display: none;
}
}

/* bn-navi
=============================================================================*/

.banner-area ul li {
    padding-bottom: 10px;
    line-height: 1;
    text-align: center;
}
.banner-area ul li a:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter: "alpha(opacity=80)";
    -khtml-opacity: 0.8;
    -moz-opacity: 0.8;
}
.banner-area ul li img {
    max-width: 260px;
}
.under-1col .banner-area {
    margin-bottom: 20px;
}
.under-1col .banner-area ul {
    letter-spacing:-0.4em;
    margin-left:-10px;
}
.under-1col .banner-area ul li {
    letter-spacing:normal;
    display:inline-block;
    vertical-align:top;
    padding:0 0 10px 10px;
    width:232px;
    text-align: center;
}
.under-1col .banner-area ul li img {
    max-width: 232px;
}
@media screen and (max-width: 1279px){
.banner-area{
    margin-bottom: 20px;
}
.under-1col .banner-area {
    width: 710px;
    margin: 0 auto 20px auto;
}
.banner-area ul,
.under-1col .banner-area ul {
    letter-spacing:-0.4em;
    margin-left:-10px;
}
.banner-area ul li ,
.under-1col .banner-area ul li {
    letter-spacing:normal;
    display:inline-block;
    vertical-align:top;
    padding:0 0 10px 10px;
    width:230px;
    text-align: center;
}
.banner-area ul li img ,
.under-1col .banner-area ul li img {
    max-width: 230px;
}
}

@media screen and (max-width: 767px){
.under-1col .banner-area {
    width: auto;
}
#side .banner-area ul {
    width:auto;
    margin-left:0;
    text-align: center;
}
#side .banner-area ul li {
    display:block;
    padding:0 0 10px 0;
    width:auto;
}
}









