@import url("../iconfont/material-icons.css");



body.selModalBody {
    overflow: hidden;
}
.selModal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999999;
    display: none;
}
.selModalOverlay {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
}
.selModal .selModalInner {
    position: absolute;
    box-sizing: border-box;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 95%;
    max-width: 60%;
    max-height: 80%;
    border-radius: 0 0 5px 5px;
    overflow-y: hidden;
}
@media screen and (min-width: 431px) and (max-width: 1000px) {
    .selModal .selModalInner {
        max-width: 70%;
    }
}
@media screen and (max-width: 430px) {
    .selModal .selModalInner {
        max-width: 90%;
    }
}

.selModal .selModalInner .selModalHeader {
    padding: 10px;
    text-align: right;
    background: rgba(0, 0, 0, 0);
}
.selModal .selModalInner .selModalHeader::after {
    content: "";
    display: block;
    clear: both;
}


/* CLOSE ICON */
.selModalOverlay .material-icons {
    cursor: pointer;
    position: fixed;
    top: 2%;
    right: 2%;
    color: #FFFFFF;
    font-size: 5rem;
}


.selModal .selModalInner .selModalList {
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
    overflow-y: auto;
}
.selModal .selModalInner ul {
    margin: 0;
    padding: 0;
    color: #333;
    background-color: #FFFFFF;
    padding-bottom: 1px;
    box-sizing: border-box;
}
.selModal .selModalInner ul li {
    display: block;
    position: relative;
    margin: 0 0 -1px 0;
    padding: 1em 2em;
    border: 1px solid #DDDDDD;
    cursor: pointer;
    box-sizing: border-box;
}
.selModal .selModalInner ul li:first-child {
    color: #FF6600;
}
.selModal .selModalInner ul li:first-child::after {
    border-top: 0 solid #FF6600;
    border-right: 0 solid #FF6600;
}
.selModal .selModalInner ul li img {
    height: auto;
    vertical-align: middle;
    margin-right: 5px;
    max-width: 40px;
}
.selModal .selModalInner ul li.selected {
    border-top: 1px solid #DDDDDD;
}
.selModal .selModalInner ul li::after {
    position: absolute;
    top: 50%;
    right: 15px;
    display: block;
    content: '';
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-top: 1px solid #FF6600;
    border-right: 1px solid #FF6600;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.selModalButton {
    margin: 0;
    padding: 10px 1.5em 10px 10px;
    width: 100%;
    box-sizing: border-box;
    background: #ffffff;
    font-size: 1.6rem;
    line-height: 1.2;
    border-radius: 3px;
    text-align: left;
    border: solid 1px #DDDDDD;
}
.selModal .selModalInner ul li.totch {
    background-color: #EFEFEF;
}