/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    =selector
-----------------------------------------------------------------------------*/

/**
*
* =selector
*
**/

.selector {
    display: inline-block;
	position: relative;
	width: 110px;
    height: 44px;
    line-height: 44px;
	padding: 0 7px 0 0;
    border: 2px solid #0095b1;
}

.selector span {
    display: block;
	padding: 0 30px 0 0;
	background: url(../../i/icon-selector.png) no-repeat right center;
	text-align: center;
}

.selector select {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 44px;
    -webkit-appearance: none;
}

#member-qa .selector {
	width: 100%;
    box-sizing: border-box;
}

/**
*
* =radio
*
**/

.radio {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin: 0 5px 10px 50px;
    vertical-align: middle;
}

.radio:first-of-type {
	margin-left: 0;
}

.radio span {
    display: block;
    width: 34px;
    height: 34px;
    background: url(../../i/icon-radio01.png) no-repeat center center;
    background-size: 75% 75%;
}

.radio span.checked {
    background: url(../../i/icon-radio02.png) no-repeat center center;
    background-size: 75% 75%;
}

.radio span input {
    width: 34px;
    height: 34px;
}

.cart .radio {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
}

.cart .radio span {
    display: block;
    width: 100%;
    height: 100%;
    background: url(../../i/icon-radio-unchecked.png) no-repeat 19px 8px;
}

.cart .radio span.checked {
    background: url(../../i/icon-radio-checked.png) no-repeat 19px 8px;
}

.low-ship .radio span {
    background-position: 19px 32px;
}

.low-ship .radio span.checked {
    background-position: 19px 32px;
}

.cart .radio span input {
    display: block;
    width: 100%;
    height: 100%;
}

/**
*
* =checker
*
**/

.checker {
    display: inline-block;
    width: 21px;
    height: 21px;
    margin: 0 5px 0 0;
    vertical-align: middle;
}

.checker span {
    display: block;
    width: 21px;
    height: 21px;
    background: url(../../i/icon-checkbox01.png) no-repeat 0 0;
}

.checker span.checked {
    background-position: 0 -21px;
}

.checker span input {
    width: 21px;
    height: 21px;
}

#member-coupon .checker {
    display: inline-block;
    width: 28px;
    height: 28px;
    margin: 0 5px 0 0;
    vertical-align: middle;
}

#member-coupon .checker span {
    display: block;
    width: 28px;
    height: 28px;
    background: url(../../i/icon-checkbox.png) no-repeat 0 0;
}

#member-coupon .checker span.checked {
    background-position: 0 0;
}

#member-coupon .checker span input {
    width: 28px;
    height: 28px;
}

.random .checker {
    float: left;
    margin-top: 10px;
    margin-right: 5px;
}

.random .checker span {
    background: url(../../i/icon-radio03.png) no-repeat 0 0;
    background-size: 100%;
}

.random .checker span.checked {
    background-position: 0 -21px;
}

/* +width: 1000↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 1000px) {

.selector {
    width: 75px;
}
}

/* +width: 900↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 900px) {

.selector {
    width: 110px;
}
}

/* +width: 720↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 720px) {

.selector {
    width: 95px;
}
}

/* +width: 480↓
*----------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {

.selector {
    width: 75px;
    margin-right: 3px;
    font-size: 18px;
}
}