/*---------------------------------------------------------
    TOU WRAP
---------------------------------------------------------*/

#tou_wrap {
    display: flex;
    justify-content: center;
    min-width: 1400px;
    background:url("/images/1bet1/rules_bg.jpg") no-repeat;
    background-size:100%;
}

#tou_wrap > .flexbox {
    display: flex;
    min-width: 1400px;
    max-width: 2200px;
    padding-left:20px;
    padding-right:20px;
    width:100%;
}

#tou_wrap > .flexbox > .lnbbox {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    width:240px;
    padding-top:20px;
}

#tou_wrap > .flexbox > .contentsbox {
    display: block;
    flex-grow: 1;
    margin-left:20px;
    background:#0d1d32;
    margin-top:20px;
    padding-left:80px;
}

#tou_wrap > .flexbox > .contentsbox * {
    color:#aaaaaa;
    font-size:16px;
    /*line-height: 180%;*/
}

#tou_wrap > .flexbox > .contentsbox h4 {
    display: block;
    margin:0px;
    padding:0px;
    border:0px;
    font-size:26px;
    font-weight: 600;
    margin-left:-80px;
    color:#ffffff;
    background: #07172d;
    height:80px;
    line-height:80px;
    border-left:4px solid #ef7c00;
    padding-left:30px;
}

#tou_wrap > .flexbox > .contentsbox h5 {
    display: inline-block;
    margin:0px;
    padding:0px;
    border:0px;
    font-size:22px;
    font-weight: 600;
    margin-left:-40px;
    color:#ef7c00;
    margin-top:40px;
    margin-bottom:20px;
}

#tou_wrap > .flexbox > .contentsbox h6 {
    display: inline-block;
    margin:0px;
    padding:0px;
    border:0px;
    font-size:18px;
    font-weight: 600;
    margin-left:-20px;
    color:#eeeeee;
    margin-top:10px;
    margin-bottom:10px;
}

#tou_wrap > .flexbox > .contentsbox b {
    color:#dddddd;
}

#tou_wrap > .flexbox > .contentsbox > article {
    padding-bottom:80px;
}

#tou_wrap > .flexbox > .contentsbox table {
    display: table;
    border-color:#29324b;
    border-collapse:collapse;
    margin-top:20px;
    margin-bottom:20px;
    background:#07172d;
}

#tou_wrap > .flexbox > .contentsbox table td{
    border:1px solid #4f5257;
    padding-left:10px;
    padding-right:10px;
    padding-top:5px;
    padding-bottom:5px;
    text-align: left;
    font-size:15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#tou_wrap > .flexbox > .contentsbox table th{
    border:1px solid #4f5257;
    padding-left:10px;
    padding-right:10px;
    padding-top:10px;
    padding-bottom:10px;
    text-align: center;
    font-size:15px;
    background:#29324b;
}


/*---------------------------------------------------------
    TOU LNB
---------------------------------------------------------*/

#tou_lnb {
    display: flex;
    flex-direction: column;
    margin:0px;
    flex-grow: 1;
    opacity:70%;
}

#tou_lnb > li {
    flex-shrink: 0;
    display: block;
    line-height:50px;
    font-size:14px;
    font-family: 'Gmarket Sans';
    background:#07172d;
    margin-bottom:1px;
    overflow:hidden;
    cursor:pointer;
    position: relative;
    transition: all 200ms;
}

#tou_lnb > li.active,
#tou_lnb > li:hover {
    background:#29324b;
    transition: all 200ms;
}

#tou_lnb > li > .btn_fold_arrow {
    position: absolute;
    right:15px;
    top:25px;
    transform: translate(0, -50%) scaleX(0.6);
    transition: all 200ms;
}

#tou_lnb > li.active > .btn_fold_arrow,
#tou_lnb > li:hover > .btn_fold_arrow {
    position: absolute;
    right:15px;
    top:25px;
    transform: translate(0, -50%) scaleY(0.6) rotate(90deg);
    transition: all 200ms;
}

#tou_lnb > li > ul {
    display: block;
    overflow: hidden;
    max-height: 0px;
    transition: all 1000ms;
}

#tou_lnb > li.active > ul {
    max-height: 800px;
    transition: all 1000ms;
}

#tou_lnb > li > ul > li {
    padding-left:10px;
    border-top:1px solid #070a0f;
    background: #0d1d32;
    transition: all 200ms;
}

#tou_lnb > li > ul > li.active,
#tou_lnb > li > ul > li:hover {
    background: #313c5c;
    transition: all 200ms;
}

#tou_lnb > li > a {
    display: block;
    padding-left:20px;
    padding-right:20px;
    height:50px;
    color: #aaaaaa;
    transition: all 200ms;
}

#tou_lnb > li.active > a,
#tou_lnb > li:hover > a {
    color: #ffffff;
    transition: all 200ms;
}

#tou_lnb > li > ul > li > a {
    display: block;
    padding-left:20px;
    padding-right:20px;
    height:50px;
    color: #aaaaaa;
    transition: all 200ms;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#tou_lnb > li > ul > li.active a,
#tou_lnb > li > ul > li:hover a {
    color:#dddddd;
    transition: all 200ms;
}