@import "bootstrap/bootstrap.less";
@import "bootstrap/responsive.less";
@import "footable.less";
@import "footable.sortable.less";

/* ===== JAAF BootStrap 2012 ========================================================
Author: Masahiro Kanai
========================================================================== */
@tableBackgroundHover: #eee;
@dropdownLinkColor: #000;
@dropdownBackground: #fff;


// border
@navbarBackground: #8B2B26;
@navbarBackgroundHighlight: #BD3C36;

// nav
@navbarLinkColorActive: #ff0;
@navbarLinkBackgroundActive: #CC0000;

// @navbarLinkBackgroundHover: #9B302B;
@navbarLinkColorHover: #000;

// colors
@genreColor_fan: #b7072a;
@genreColor_fan2: #DB3D5C;
@genreColor_athlete: #3973C5;
@genreColor_athlete2: #6A9CE2;
@genreColor_rikuren: #448368;
@genreColor_rikuren2: #7BC1A3;
@genreColor_common: #666;
@genreColor_lightgray: #f1f1f1;
@genreColor_gray: #ccc;
@genreColor_black: #000;
@genreColor_linkcolor: #00489A;
@genreColor_linkcolorHover: #6A9CE2;

// val
@valPx_groupBorderSize: 6px;


// sp, mobile hide contents
.mode_sp,
.mode_mobile { display: none; }
.nospace { margin: 0 !important; padding: 0 !important; }
.nospace-top { margin-top: 0 !important; padding-top: 0 !important; }
.mode_pc { display: block; }


/* ==========================================================================
    Base
   ========================================================================== */
hr { margin-bottom: 40px; }
h1 { margin-bottom: 10px; font-size: 34px;}
h1.title { display: none; margin-bottom: 20px; }
h2 { margin: 20px 0 20px 0; color: @genreColor_black;  font-size: 30px;}
h4, h5 { margin: 20px 0 10px 0; }

// h3
.container h3 { border-bottom: solid 2px @genreColor_common; margin-top: 20px; padding-bottom: 5px; margin-bottom: 20px;}
.container.fan h3 { border-bottom: solid 2px @genreColor_black; }
.container.fan_2nd h3 { border-bottom: solid 2px @genreColor_fan; }
.container.athlete h3 { border-bottom: solid 2px @genreColor_athlete; }
.container.athlete h3.none { border-bottom: solid 2px @genreColor_athlete; }
.container.rikuren h3 { border-bottom: solid 2px @genreColor_rikuren; }
.container.jaaf h3 { border-bottom: solid 2px @genreColor_common; }
.container h3.none,
{ background: transparent; color: @genreColor_black; padding: 0; }
.container .well h3 { border-bottom: none; }


// h4
.container h4 { border-left: solid 3px @genreColor_common; margin-bottom: 10px; padding-left: 10px; }
.container.jaaf h4 { border-left: solid 3px @genreColor_common; }
.container.fan h4 { border-left: solid 3px @genreColor_fan; }
.container.fan_2nd h4 { border-left: solid 3px @genreColor_fan; }
.container.athlete h4 { border-left: solid 3px @genreColor_athlete; }
.container.rikuren h4 { border-left: solid 3px @genreColor_rikuren; }
.container h4.none { border: none; padding: 0; }


// h5
.container h5 { }
.container.jaaf h5 { color: @genreColor_common; }
.container.fan h5 { color: @genreColor_fan; }
.container.fan_2nd h5 { color: @genreColor_fan; }
.container.athlete h5 { color: @genreColor_athlete; }
.container.rikuren h5 { color: @genreColor_rikuren; }
.container h5.none { color: @genreColor_black; }

// grounp
.group { padding-left: 30px; border-left: solid @valPx_groupBorderSize @genreColor_common; }
.group.jaaf { border-left: solid @valPx_groupBorderSize @genreColor_common; }
.group.fan { border-left: solid @valPx_groupBorderSize @genreColor_black; }
.group.fan_2nd { border-left: solid @valPx_groupBorderSize @genreColor_fan; }
.group.athlete { border-left: solid @valPx_groupBorderSize @genreColor_athlete; }
.group.rikuren { border-left: solid @valPx_groupBorderSize @genreColor_rikuren; }

a
{
    color: @genreColor_linkcolor;
    text-decoration: none;
    &:hover
    {
        text-decoration: underline !important;
    }
}


/* ==========================================================================
    option
   ========================================================================== */
.alert
{
    h4
    {
        margin: 5px 0;
    }
}

.alert.alert-standard
{
    background: #ccc !important;
}


.btn-large,
.btn-small,
.btn
{
    background: @genreColor_linkcolor;
    margin: 5px 0;
    border: none;
    border-radius: 0;
    color: #fff;
    &:hover
    {
        background: @genreColor_linkcolor;
        color: #fff;
    }
}
.btn-large.btn-danger, .btn-small.btn-danger, .btn.btn-danger { background: @genreColor_fan; }
.btn-large.btn-inverse, .btn-small.btn-inverse, .btn.btn-inverse { background: @genreColor_black; }
.btn-large.btn-success, .btn-small.btn-success, .btn.btn-success { background: @genreColor_rikuren; }
.btn-large.btn-primary, .btn-small.btn-primary, .btn.btn-primary { background: @genreColor_athlete; }
.btn-large.btn-warning, .btn-small.btn-warning, .btn.btn-warning { background: #F99A15; }



.btn.btn-inverse
{
    background: @genreColor_black;
    &:hover
    {
        background: #333;
    }
}


.well
{
    border-radius: 0;
    border: none;
}


h2 .btn_more,
h3 .btn_more
{
    padding: 0 10px;
    border-left: solid 1px @genreColor_gray;
    float: right;
    font-size: 12px;
    font-weight: normal;
    border-radius: 0;
    color: @genreColor_black;

    &:hover
    {
        text-decoration: underline;
    }
}

.athlete .pickup_gp
{
    float: right;
    margin: 0 0 10px 0;
    padding: 10px 0 0 0;
    border: solid 5px @genreColor_rikuren2;
}

/* 20130306 chi8ko mod */
.athlete .pickup
{
    float: right;
    margin:  0 0 10px 0;
    padding: 10px 0 0 0;
    border: solid 5px @genreColor_athlete2;
}

/* 20160701 chi8ko add */
.fanpickup
{
    margin:  10px 0 20px 0;
    padding: 10px 0 10px 10px;
    border: solid 5px #b7072a;
    width:94%
}
.fanpickup ul{
    margin-top:9px;
}
/* ==========================================================================
    table
   ========================================================================== */
table,
table tr,
table th,
table td
{
    border: none !important;
    border-radius: 0 !important;
}
table
{
    caption
    {
        background: @genreColor_lightgray;
        padding: 8px;
        text-align: center;
        font-weight: bold;
    }
    thead
    {
        th
        {
            color: #fff;
            background: @genreColor_common;
        }
    }
    th.divider
    {
        background: @genreColor_lightgray;
    }
    th.tc,
    td.tc,
    th.ct,
    td.ct
    {
        text-align: center;
    }
    th.tr, td.tr { text-align: right; }
    th.tl, td.tl { text-align: left; }
    thead th
    {
        font-size: 10px;
        padding: 4px 0;
    }
    td.ct { width:10%;}
}





/* ==========================================================================
    footer
   ========================================================================== */
.container.footer
{
}

.container-fluid.footer-nav
{
    margin-top: 80px !important;
    padding-top: 20px;
    background: @genreColor_lightgray url(../img/common/footer_bg_fan.png) repeat-x 0 0;
}
.container-fluid.footer-nav.fan { background: @genreColor_lightgray url(../img/common/footer_bg_fan.png) repeat-x 0 0; }
.container-fluid.footer-nav.fan_2nd { background: @genreColor_lightgray url(../img/common/footer_bg_fan.png) repeat-x 0 0; }
.container-fluid.footer-nav.athlete { background: @genreColor_lightgray url(../img/common/footer_bg_athlete.png) repeat-x 0 0; }
.container-fluid.footer-nav.rikuren { background: @genreColor_lightgray url(../img/common/footer_bg_rikuren.png) repeat-x 0 0; }



.container-fluid.footer-copy
{
    background: #000 !important;
    div
    {
        background: #000 !important;
    }
    .nav a
    {
        &:hover
        {
            text-decoration: underline !important;
        }
    }
    .copy
    {
        color: #fff;
        text-align: center;
    }
}

.footer-nav .row.footer
{
    margin-left: 0px;
}


.footer-nav .thumbnail
{
    margin: 0;
    border-radius: 0px;
    border: none;
    padding: 0 10px 0 0;
    -webkit-box-shadow: none;

    h4
    {
        margin: 10px 0 10px 0;
        padding: 0 0 10px 0;
        border-left: none;
        color: #fff;
    }

    ul
    {
        li
        {
            margin: 4px 0 0 0;
            font-size: 11px;
            border: none;

            a
            {
                border: none;
                color: @genreColor_black;
                background: #fff;
                &:hover
                {
                    background: #f1f1f1;
                    text-decoration: underline;
                }
            }
        }
    }
}



/* ==========================================================================

   ========================================================================== */
.nav-tabs
{
    li
    {
        a
        {
            border-radius: 0;
        }
    }
}





/* ==========================================================================
    label
   ========================================================================== */
.label
{
    border-radius: 0;
    padding: 5px 10px;
    color: #fff;
    text-shadow: none;
}
// #953B39 主催
// #3A87AD 国際
// #468847 GP
// #F89406 後援、学生

// live: 速報       #F89406
// news: お知らせ   #3A87AD
// offter: 募集情報 #22b2f7
// taikai: 大会情報 #953B39
// tv: テレビ情報   #333
// committee: 委員会情報   #468847

// type
.label
{
    width: 60px !important;
    display: block;
}
.label.type-news-taikai { background: #953B39; }
.label.type-news-news { background: #3A87AD; }
.label.type-news-committee { background: #468847; }
.label.type-news-live { background: #F89406; }
.label.type-news-offer { background: #22b2f7; }
.label.type-news-tv { background: #333; }

.label.type-taikai-organized { background: #953B39; }
.label.type-taikai-international { background: #3A87AD; }
.label.type-taikai-gp { background: #468847; }
.label.type-taikai-backup { background: #F89406; }
.label.type-taikai-gakuren { background: #666; }

.type-backup { background: #EA9735; }
.type-gakuren { background: #5A8248; }
.type-organized { background: #AB544F; }
.type-international { background: #4E87AA; }

body { padding: 0; }
body.fan { background: #fff url(../img/common/header_bg_fan.png) repeat-x 0 0; }
body.fan_2nd { background: #fff url(../img/common/header_bg_fan_2nd.png) repeat-x 0 0; }
body.athlete { background: #fff url(../img/common/header_bg_athlete.png) repeat-x 0 0; }
body.rikuren { background: #fff url(../img/common/header_bg_rikuren.png) repeat-x 0 0; }



/* ==========================================================================

   ========================================================================== */
.logo
{
    margin: 20px 0 20px 0;
}
.cnav
{
    a.transbtn
    {
        margin-right: 10px;
        display: block;
        float: left;
        padding: 5px 10px;
        border: none;
        border-radius: 0 !important;
        background: @genreColor_lightgray;
        font-size: 12px;
        color: @genreColor_black;
    }
    width: auto;
    font-size: 12px;
    position: absolute;
    top: 0;
    right: 0;
    .btn-group
    {
        float: left;
        border-left: solid 1px #ccc;
        padding-left: 10px;
        a
        {
            margin: 0;
            padding: 5px 10px;
            border: none;
            border-radius: 0 !important;
            background: @genreColor_lightgray;
            font-size: 12px;
            color: @genreColor_black;
            text-shadow: none;
            &:hover
            {
                text-decoration: underline;
            }
        }
        .btn.fan, .athlete, .rikuren { color: #fff; }
        .fan { background: @genreColor_fan; }
        .athlete { background: @genreColor_athlete; }
        .rikuren { background: @genreColor_rikuren; }
    }

        /*---- 2015.10.28 Add DN ----*/ 
    .btn-sns{
        clear:both;
        ul{
            float:right;
            list-style:none;
            padding: 14px 0 0;
            li{
                float:left;
                margin: 0 0 0 10px;
                img{
                    height:22px;
                }
            }
        }
    }
   /*---- END 2015.10.28 Add DN ----*/ 
}

.container { position: relative; }


/* ==========================================================================
    Nav
   ========================================================================== */
.btn-navbar
{
    float: left;
    margin-left: 10px;
    z-index: 555;
}
.btn-navbar
{
    .icon-bar
    {
        margin: 2px 1px 4px 2px !important;
        width: 26px !important;
        height: 3px !important;
        display: block !important;
    }
}

.btn-navbar,
.navbar-inner
{
    padding: 0;
    border-radius: 0;
    background-color: #BD3C36;
    -webkit-box-shadow: none;
    z-index: 111;
    position: relative;

    .nav-collapse .nav li a
    {
        color: #fff;
        &:hover
        {
            color: #fff;
        }
    }
    li ul.dropdown-menu li a:hover, li ul.dropdown-menu li.active a, li.active a, li.active a:hover, li a:hover
    {
        background-color: #C8282B;
        color: #fff !important;
    }
    ul.dropdown-menu li.active ul.dropdown-menu a, li.active ul.dropdown-menu a
    {
        background: #fff !important;
        color: @genreColor_black !important;
    }


    .divider-vertical{
        margin: 0;
        padding: 0;
        border: none;
    }
    .nav-collapse .nav li a
    {
        color: #fff;
        &:hover
        {
            color: #ccc;
            text-decoration: underline !important;
        }
    }
    .dropdown ul.dropdown-menu li a
    {
        background: #fff;
        color: @genreColor_black;
    }
    .dropdown ul.dropdown-menu li.active a
    {
        background: @genreColor_black;
        color: #fff;
    }
}
.btn-navbar.fan,
.navbar-inner.fan
{
    background: @genreColor_black;
    .container
    {
        background: @genreColor_black;
    }

    li ul.dropdown-menu li a:hover, li ul.dropdown-menu li.active a, li.active a, li.active a:hover, li a:hover
    {
        // background-color: #C8282B;
        background-color: @genreColor_black !important;
    }
    .divider-vertical { background-color: @genreColor_common; }
}



.btn-navbar.athlete,
.navbar-inner.athlete
{
    // background: #4d88ca;
    background: @genreColor_athlete;

    .container
    {
        background: @genreColor_athlete;
    }

    li ul.dropdown-menu li a:hover, li ul.dropdown-menu li.active a, li.active a, li.active a:hover, li a:hover
    {
        // background-color: @genreColor_athlete2 !important;
        background-color: @genreColor_black !important;
    }
    .divider-vertical { background-color: @genreColor_athlete2; }
}
.btn-navbar.fan_2nd,
.navbar-inner.fan_2nd
{
    background: @genreColor_fan;

    .container
    {
        background: @genreColor_fan;
    }

    li ul.dropdown-menu li a:hover, li ul.dropdown-menu li.active a, li.active a, li.active a:hover, li a:hover
    {
        // background-color: @genreColor_fan2 !important;
        background-color: @genreColor_black !important;
    }
    .divider-vertical { background-color: @genreColor_fan2; }
}
.btn-navbar.rikuren,
.navbar-inner.rikuren
{
    background: @genreColor_rikuren;
    .container
    {
        background: @genreColor_rikuren;
    }

    li ul.dropdown-menu li a:hover, li ul.dropdown-menu li.active a, li.active a, li.active a:hover, li a:hover
    {
        // background-color: @genreColor_rikuren2 !important;
        background-color: @genreColor_black !important;
    }
    .divider-vertical { background-color: @genreColor_rikuren2; }
}









// navbar-form
.navbar-form
{
    border: none;
}
.navbar-form.pull-right
{
    margin-right: 7px;
    input, button
    {
        border: none;
        border-radius: 0;
    }
    input
    {
        background: #f4f4f4;
        width: auto;
        &:focus
        {
            background: #fff;
        }
    }
    button
    {
        background: #D0222F;
    }
}











footer .navbar
{
    background-color: #000 !important;
}

footer .navbar .navbar-inner
{
    // background-color: @genreColor_black;
    background-color: #000 !important;
    background-image: none !important;

    // IE8-9 gradient filter
    // filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cecece', endColorstr='#cccccc', GradientType=0);
    .nav-collapse
    {
        background-color: #000 !important;
        background-image: none !important;

        .nav
        {
            background-color: #000 !important;
            li
            {
                background-color: #000 !important;
            }
        }
    }

    .nav-collapse .nav li a
    {
        color: #fff;
        &:hover
        {
            color: #ccc;
        }
    }
}


.breadcrumb
{
    border-radius: 0;
    border: none;
    background: @genreColor_lightgray;
    font-size: 11px;
    li.active
    {
        font-weight: bold;
    }
}






.right-banner
{
    .well-large
    {
        background: transparent;
        padding: 0;
        text-align: center;
        border-radius: 0;
        border: none;
        h3
        {
            display: none;
        }
        ul
        {
            margin: 0;
        }
        li
        {
            list-style: none;
            margin-bottom: 10px;
        }
        &:last-child{
            margin-bottom: 0px;
        }
        img
        {
            margin: auto;
            width: 284px;
        }
    }



}

.footer-banner
{
    padding: 20px 0;
    border-radius: 0;
    border: none;
    background: #f4f4f4;

    h3
    {
        margin: 0 0 10px 0;
    }
}








#upload
{
    height: 360px;
    -webkit-perspective: 800px;
    -moz-perspective: 800px;
    -ms-perspective: 800px;
    -o-perspective: 800px;
    perspective: 800px;
}

.divFormMini
{
}
#markerTitle, #bgmTitle
{
}

#formMarker, #formBGM
{
}

.divFormLayer
{
    width: 476px;
    height: 118px;
    background-image: url(../img/bg_form.png);
    position: relative;
}
.formTitle
{
    display: block;
    position: absolute;
    top: 25px;
    left: 18px;
}
.iconAnimation
{
    position: absolute;
    z-index: 50;
}
.iconAnimationAC
{
    position: absolute;
    z-index: 100;
    display: none;
}
.btnRotation
{
    position: absolute;
    top: 68px;
    left: 104px;
    cursor: pointer;
}
.btnXAnimation
{
    position: absolute;
    top: 68px;
    left: 144px;
    cursor: pointer;
}
.btnYAnimation
{
    position: absolute;
    top: 68px;
    left: 184px;
    cursor: pointer;
}
.btnNoAnimation
{
    position: absolute;
    top: 68px;
    left: 224px;
    cursor: pointer;
}
.formPosition
{
    position: absolute;
    top: 74px;
    left: 360px;
}
.inputX, .inputY
{
    width: 32px;
    height: 24px;
    background-image: url(../img/form_position.png);
    border: none;
    background-color: transparent;
}

.layerSubmit
{
}
.chooseImage
{
    margin-top: 18px;
    margin-left: 100px;
}
.layer
{
    position: absolute;
    opacity: 0.8;

    -webkit-transform: rotateY( 55deg );
    -moz-transform: rotateY( 55deg );
    -ms-transform: rotateY( 55deg );
    -o-transform: rotateY( 55deg );
    transform: rotateY( 55deg );
}

#layer0
{
    margin-top: 60px;
    margin-left: 20px;
}

#layer1
{
    margin-top: 80px;
    margin-left: 100px;
}
#layer2
{
    margin-top: 100px;
    margin-left: 180px;
}
#layer3
{
    margin-top: 120px;
    margin-left: 260px;
}
#threeCanvas
{
    background-color: #009;
}
#container_three
{
    position: fixed;
    top: 50%;
    left: 50%;
    background-image: url(../img/bg_black.png);
    margin-top: -180px;
    margin-left: -240px;
    cursor: pointer;
}
#btn3DPreview
{
    margin-left: 90px;
    margin-right: 10px;
}
#btnPreviewInApp
{
    margin-right: 10px;
}
.btnMakeUpload
{
    margin-top: 90px;
}
.btnClose
{
    background-color: #fff;
}







table.table thead .sorting,
table.table thead .sorting_asc,
table.table thead .sorting_desc,
table.table thead .sorting_asc_disabled,
table.table thead .sorting_desc_disabled
{
    cursor: pointer;
            *cursor: hand;
        }

        table.dataTable th:active
        {
            outline: none;
        }


        .control-group
        {
            .controls a.none,
            .controls span.none
            {
                padding: 5px 0 0 0;
                display: block;
            }
        }

.event_type_organized
{
    padding: 2px 4px;
    border: solid 1px #BC3238;
    font-size: 10px;
    color: #BC3238;
    border-radius: 0px;
}






















/* ===== JAAF BootStrap 2012: Fan Style ========================================================
Author: Masahiro Kanai
========================================================================== */
.visual
{
    position: relative;
    border-radius: 0px;

    .info
    {
        background: @genreColor_black;
        width: 100%;
        small
        {
            margin-left: 10px;
            color: #ccc;
            display: inline-block;
            font-size: 11px;
        }

        h2
        {
            margin: 0 0 0 10px;
            padding: 0;
            color: #fff;
            font-size: 12px;
            font-weight: bold;
            display: inline-block;
        }
        em
        {
            float: right;
            margin: 7px 10px 0 0;
            padding: 0;
            font-size: 11px;
            color: #fff;
            font-style: normal;
            display: inline-block;
        }
    }
    &:hover .info
    {
        background: @genreColor_fan;
    }
}


.fan_top_banner
{
    box-shadow: none;
    border: none;

    h3 { display: none; }
    ul { margin-left: 1px; }
    li { margin: 5px 0; }
    a, img
    {
        margin: 0;
        width: 284px;
    }
    .span2 { margin: 0; width: 140px; }
    .span2:first-child
    {
        margin-right: 3px;
    }
    .span2 a, .span2 img
    {
        display: block;
        margin: 0;
        width: 140px;
    }
}



/* ===== JAAF BootStrap 2012: Taikai Style ========================================================
Author: Masahiro Kanai
========================================================================== */
.page-header
{
    border: none !important;
    h1
    {
        vertical-align: center;
    }
}


.row.taikai
{
    margin-left: 0px;

    .span12
    {
        margin: 0;
    }

    .page-header
    {
        text-indent: -60px;
        margin-left: 60px;
        padding: 0;
        /*
        h1
        {
            font-size: 30px;
        }
        */
        .label
        {
            margin-right: 10px;
            display: inline;
            padding: 15px 13px;
            font-size: 12px;
        }
    }
    .btn-group
    {
        margin: 0;
        padding: 0;
        a
        {
            margin-right: 5px;
            padding: 5px 10px;
            border: none;
            border-radius: 0 !important;
            font-size: 12px;
            &:hover
            {
                text-decoration: underline;
            }
        }
    }
    .span2,
    .span4,
    .span8
    {
        margin: 0;
        h2
        {
            margin: 20px 0 0 0;
            padding: 0px 20px 0px 10px;
            height: auto;
            background: @genreColor_black;
            color: #fff;
            font-size: 10px;
        }
    }
    .num2
    {
        h2
        {
            background: @genreColor_common;
        }
    }
    .span8 .contents
    {
        margin: 10px 0 0 10px;
        line-height: 1.7;
    }
}


.taikai_pagination
{
    margin: 10px 0;
    position: relative;
    h2
    {
        text-align: center;
    }
    .page_ui_left, .page_ui_right
    {
        position: absolute;
        top: 0;
    }
    .page_ui_left
    {
        left: 0;
    }
    .page_ui_right
    {
        right: 0;
    }
}



/* ===== JAAF BootStrap 2012: Athlete Player Style ========================================================
Author: Masahiro Kanai
========================================================================== */
.fan_player_photoe_other
{
    margin-left: 0;
    text-align: center;
    height: 200px;

    img
    {
        margin-left: 10px;
        height: 200px;
        width: auto;
    }
    img:first-child
    {
        margin-left: 0;
    }

    .photo_group
    {
        background-color: #000;
        margin: auto;
        width: auto;
    }
}


.thumbnails.athlete
{
    li
    {
        a
        {
        }
    }
}







/* ===== JAAF BootStrap 2012: Stadium Style ========================================================
Author: Masahiro Kanai
========================================================================== */
.jaaf.stadium .row .span3
{
    margin-bottom: 20px;
}
.jaaf.stadium .row .span3 h4
{
    margin: 20px 0 0 10px;
    color: #666;
}
.jaaf .row .span3
{
    ul
    {
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-bottom: solid 1px #ccc;
        li
        {
            margin-left: 20px;
        }
    }
}



/* ===== JAAF BootStrap 2012: Rikuren Style ========================================================
Author: Masahiro Kanai
========================================================================== */
/*
.list_block
{
    h3
    {
        margin: 20px 0 20px 0;
        padding: 0;
        border-bottom: solid 2px @genreColor_rikuren;
        padding-bottom: 5px;
    }
    h4
    {
        margin: 0 0 10px;
        padding-bottom: 5px !important;
        border-bottom: solid 1px #ccc;
    }
    ul
    {
        margin-bottom: 10px;
    }
}
*/



/* ===== JAAF BootStrap 2012: Athleon Style ========================================================
Author: Masahiro Kanai
========================================================================== */
.athlionmsg
{
    background: url('../img/fan/athlion_christmas.png');
    display: block;
    width: 274px;
    height: 259px;
    position: fixed;
    bottom: 0;
    right: 50px;
    z-index: 999;
}
.athlionmsg p
{
    padding: 6px 10px;
}






/* ===== Responsible Desing ========================================================
Author: Masahiro Kanai
========================================================================== */
@media (min-width: 1200px)
{
    h1.title { display: block; }
    .navbar-form.pull-right
    {
        input
        {
            display: auto;
        }
    }
    .fan_player_photoe_other
    {
        margin-left: 0;
        height: 300px;

        img
        {
            height: 300px;
        }
    }
    .fan_top_banner
    {
        .official
        {
            width: 362px;
            background: #f4f4f4;
            text-align: center;
            img
            {
                width: 284px;
            }
        }

        .span2:first-child
        {
            margin-right: 3px;
        }
        .span2 { width: 180px; }
        .span2 a,
        .span2 img
        {
            display: block;
            margin: 0;
            width: 180px;
        }
    }
}


/* Desktop
------------------------- */
@media (max-width: 980px)
{
    body, body.fan, body.fan_2nd, body.athlete, body.rikuren { background: #fff; }
    h1.title { display: block; }
    .navbar-inner { padding: 10px 0; }
    .mode_pc { display: none; }
    .cnav
    {
        position: absolute;
        right: 0;
        z-index: 333;
        box-shadow: none;
        a.transbtn
        {
            position: absolute;
            margin: 0;
            top: 25px;
            right: 0;
            display: block;
            padding: 5px 10px;
            border: none;
            font-size: 12px;
        }
        .btn-group
        {
            top: 92px;
            right: 10px;
            border-left: none;
            a
            {
                background: transparent;
                color: #fff;
                &:hover
                {
                    text-decoration: underline;
                }
            }
            .btn.fan, .athlete, .rikuren { color: #fff; }
            .fan { background: @genreColor_fan2; }
            .athlete { background: @genreColor_athlete2; }
            .rikuren { background: @genreColor_rikuren2; }
        }
        /*---- 2015.10.28 Add DN ----*/ 
        .btn-sns{
            position: absolute;
            right: 70px;
            top: 13px;
            ul{
                float:right;
                list-style:none;
                padding: 14px 0 0;
                li{
                    float:left;
                    margin: 0 0 0 10px;
                    img{
                        height:22px;
                    }
                }
            }
        }
       /*---- END 2015.10.28 Add DN ----*/ 
    }

    .fan_player_photoe_other
    {
        display: none;
    }
    .mode_mobile
    {
        display: block;
    }
    .right-banner
    {
        .well-large
        {
            img
            {
                width: 200px;
            }
        }
    }


    .btn-navbar,
    .navbar-inner
    {
        li ul.dropdown-menu li a
        {
            background-color: transparent !important;
            color: #fff !important;
            font-weight: normal !important;
        }
    }
    .fan_top_banner
    {
        box-shadow: none;
        border: none;

        h3 { display: none; }
        ul { margin-left: 1px; }
        li { margin: 5px 0; }
        a, img
        {
            margin: 0;
            width: 226px;
        }
        .span2 { margin: 5px 0; width: 226px; }
        .span2 a, .span2 img
        {
            display: block;
            margin: 0;
            width: 226px;
        }
    }

}


/* Tablet
------------------------- */
@media (max-width: 767px)
{
    body, body.fan, body.fan_2nd, body.athlete, body.rikuren { background: #fff; }
    h1.title { display: block; }

    .mode_sp { display: block; }


    .navbar-inner { padding: 10px 0; }


    .sidenav.affix
    {
        position: static;
    }
    .logo
    {
        margin: 20px 0 20px 10px;
    }
    .fan_top_banner
    {
        text-align: center;
        h3
        {
            background: @genreColor_black !important;
            display: block !important;
            color: #fff;
        }
        ul
        {
            margin: auto !important;
            width: 284px;
        }
        li
        {
            clear: both;
            margin: 10px 0 !important;
            width: 284px !important;
            a, img
            {
                margin: auto !important;
                width: 284px !important;
            }
        }

    }
    .container-fluid.footer-nav.fan,
    .container-fluid.footer-nav.fan_2nd,
    .container-fluid.footer-nav.athlete,
    .container-fluid.footer-nav.rikuren,
    .container-fluid.footer-nav {
        background-image: none;
        h4
        {
            margin-top: 20px;
            color: @genreColor_black;
        }
    }
    .container-fluid.footer-nav { border-top: solid 10px @genreColor_black; }
    .container-fluid.footer-nav.fan { border-top: solid 10px @genreColor_black; }
    .container-fluid.footer-nav.fan_2nd { border-top: solid 10px @genreColor_fan; }
    .container-fluid.footer-nav.athlete { border-top: solid 10px @genreColor_athlete; }
    .container-fluid.footer-nav.rikuren { border-top: solid 10px @genreColor_rikuren; }

    .footer-banner
    {
        text-align: left;
        h3
        {
            width: 100%;
            text-align: left;
            margin: 0 0 10px 0;
            border: none;
        }
        a
        {
            img
            {
                width: 20%;
            }
        }
        .span4
        {
            margin-bottom: 20px;
        }
    }
    .athlete .pickup,
    .athlete .pickup_gp
    {
        width: 98%;
        padding: 10px 0;
        float: left;
    }
    .athlionmsg
    {
        display: none;
    }
}



/* Landscape phones
------------------------- */
@media (max-width: 480px)
{
    body, body.fan, body.fan_2nd, body.athlete, body.rikuren { background: #fff; }
    .mode_sp
    {
        display: block;
    }

    h1.title { display: block; }

    .logo
    {
        /*---- 2015.10.28 Add DN ----*/
        margin: 10px 0 70px 5px;
        text-align: center;
        /*---- END 2015.10.28 Add DN ----*/ 
        img
        {
            width: 60%;
        }
    }

    .cnav
    {
    /*---- 2015.10.28 Add DN ----*/
        width: 100%;
        top: -59px;
        position: relative;
        /*---- END 2015.10.28 Add DN ----*/ 
        a.transbtn
        {
            /*---- 2015.10.28 Add DN ----*/
            top: 9px;
            right: 50%;
            margin: 0 -90px 0 0;
            /*---- END 2015.10.28 Add DN ----*/ 
        }
        .btn-group
        {
            /*---- 2015.10.28 Add DN ----*/
            top: 73px;
            right: 5px;
            float: none;
            width: auto;
            position: absolute;
            /*---- END 2015.10.28 Add DN ----*/ 
            a
            {
                padding-left: 4px;
                padding-right: 4px;
                font-size: 12px;
                width: 80px;
                height: 15px;
                overflow: hidden;
                text-overflow: ellipsis;
                -webkit-text-overflow: ellipsis; /* Safari */
                -o-text-overflow: ellipsis; /* Opera */
            }
        }
        /*---- 2015.10.28 Add DN ----*/ 
        .btn-sns{
            position: absolute;
            right: 50%;
            top: 9px;
            margin: 0 -27px 0 0px;
            clear: none;
            ul{
                float: none;
                list-style: none;
                padding: 0;
                margin: 0 0 0 0;
                li{
                    float:left;
                    margin: 0 10px 0 0 ;
                    img{
                        height:27px;
                    }
                }
            }
        }
       /*---- END 2015.10.28 Add DN ----*/ 
    }

    .navbar-inner { padding: 10px 0; }
    .page-header
    {
        h1  
        {
            font-size: 20px;
            vertical-align: center;
        }
        small
        {
            font-size: 14px;
        }
    }
    .fan_player_photoe_other
    {
        display: none;
    }
    .fan_top_banner
    {
        text-align: center;
        h3
        {
            background: @genreColor_black !important;
            display: block !important;
        }
        ul
        {
            margin: auto !important;
            width: 284px;
        }
        li
        {
            clear: both;
            margin: 10px 0 !important;
            width: 284px !important;
            a, img
            {
                margin: auto !important;
                width: 284px !important;
            }
        }

    }
    .row.taikai .page-header .label
    {
        padding: 8px 10px;
    }
    .label
    {
        width: auto !important;
        padding: 3px 5px;
        font-size: 10px;
        display: block;
    }
}

/* chi8ko add*/
div.section01 ul li {margin:0.5em 0;}
div.footnote {margin:0 auto; text-align:right;}
body {-webkit-touch-callout:none; -webkit-user-select:none;}