@charset "utf-8";
/* CSS Document */
body{ position: relative;}
h3,ul,li,dl,dt,dd,p{ margin: 0; padding: 0;}
ul,li{ list-style-type: none;}
.new-search-popup-flame{ background-color: #ffffff; border: 1px solid #000000; height: 80vh; left: calc(50% - 450px); position: fixed; top: 8vh; width: 898px; z-index: 600;}
.new-search-header,.new-search-footer{ background-color: #181818; background: -webkit-linear-gradient(top, #3f3f3f, #2b2b2b 50%, #181818); background: linear-gradient(top, #3f3f3f, #2b2b2b 50%, #181818); height: 50px; position: relative;}
.new-search-header h3{ color: #ffffff; font-size: 22px; line-height: 22px; left: 20px; position: absolute; top: 13px;}
.new-search-header .new-search-check-clear{ display: none;}
.new-search-close{ background-color: #ffffff; border-radius: 6px; color: #282828; cursor: pointer; font-size: 16px; font-weight: bold; line-height: 16px; padding: 7px 40px 7px 18px; position: absolute; right: 12px; top: calc(50% - 15px);}
.new-search-close:hover,.new-search-check-clear:hover,.new-search-result-bt:hover{ opacity: .7;}
.new-search-close::before,.new-search-close::after{ content: ""; display: block; position: absolute;}
.new-search-close::before{ background-color: #282828; border-radius: 50%; height: 20px; right: 16px; top: calc(50% - 10px); width: 20px;}
.new-search-close::after{ color: #ffffff; content: "×"; font-size: 16px; right: 18px; top: calc(50% - 9px); width: 16px;}
.new-search-body{ height: calc(100% - 108px); overflow: auto;}
.new-search-body dl,.new-search-body dl dd ul{ display: -webkit-box; display: -webkit-flexbox; display: -webkit-flex; display: flex; -webkit-box-lines: multiple; -webkit-flex-wrap: wrap; flex-wrap: wrap; width: 100%;}
.new-search-body dl::after,.new-search-body dl dd ul::after{ clear: both; content: ""; display: block;}
.new-search-body dl dt,.new-search-body dl dd{ border-bottom: 1px solid #c6c6c6;}
.new-search-body dl dt{ background-color: #f6f6f6; float: left; padding: 20px 10px; width: 140px;}
.new-search-body dl dt p{ color: #4d4d4d; font-size: 16px; font-weight: bold; text-align: left;}
.new-search-body dl dt p span{ display: block; font-size: 12px; font-weight: normal; line-height: 16px;}
.new-search-body dl dd{ float: right; padding: 20px 10px 14px 10px; width: calc(100% - 180px);}
.new-search-body dl dd > p{ background-color: #f6f6f6; font-size: 14px; font-weight: bold; margin: 14px auto 14px; padding: 4px 6px; text-align: left;}
.new-search-body dl dd > p:first-child{ margin: 0 auto 14px;}
.new-search-body dl dd ul li{ float: left; margin-bottom: 6px; width: 33.3%;}
.new-search-body dl dd ul li label input{ display: none;}
.new-search-body dl dd ul li label p{ text-align: left;}
.new-search-body dl dd ul li label p span::before,.new-search-body dl dd ul li p span::after{ display: inline-block;}
.new-search-body dl dd ul li label p span::before{ content: "（"; margin-left: -8px;}
.new-search-body dl dd ul li label p span::after{ content: "）";}
.new-search-body dl dd ul li .input-text-01{ margin-top: -4px; text-align: left;}
.new-search-body dl dd ul li .input-text-01 input[type="text"]{ background: -webkit-linear-gradient(top, #e9e9e9, #ffffff 30%, #ffffff); background: linear-gradient(top, #e9e9e9, #ffffff 30%, #ffffff); border-radius: 4px; border: 1px solid #808281; font-size: 16px; margin-right: 4px; padding: 1px 6px; width: 60px;}
.new-search-body dl dd ul li .input-text-01 input[type="text"]:nth-child(2){ margin-left: 4px;}
.new-search-body dl dd ul li .input-text-01 input[type="text"]:focus,.new-search-body dl dd ul li.keyword-text input:focus{ background-color: #ffffff; border: 1px solid #0073cc; outline: none;}
.new-search-body dl dd ul li.keyword-text,.new-search-body dl dd ul li.keyword-text input{ width: 100%;}
.new-search-body dl dd ul li.keyword-text input{ background: -webkit-linear-gradient(top, #e9e9e9, #ffffff 30%, #ffffff); background: linear-gradient(top, #e9e9e9, #ffffff 30%, #ffffff); border-radius: 4px; border: 1px solid #808281; font-size: 16px; padding: 4px 6px;}
.new-search-body dl dd ul.pc-lank li p{ background-image: url("/images/search/new-search-pc-lank-icon-01.png"); background-position: left 20px top 0; background-repeat: no-repeat; height: 20px;}
.new-search-body dl dd ul.pc-lank li:nth-child(2) p{ background-position: left 20px top -30px;}
.new-search-body dl dd ul.pc-lank li:nth-child(3) p{ background-position: left 20px top -60px;}
.new-search-body dl dd ul.pc-lank li:nth-child(4) p{ background-position: left 20px top -90px;}
.new-search-body dl dd ul.pc-lank li:nth-child(5) p{ background-position: left 20px top -120px;}
.new-search-body dl dd ul.pc-lank li p span{ margin-left: 94px; vertical-align: middle;}

.p-checkbox{ color: #444444; cursor: pointer; font-size: 14px; line-height: 18px; padding-left: 16px; position:relative;}
.p-checkbox::before{ background-color: #ffffff; background: -webkit-linear-gradient(top, #ffffff, #ffffff 40%, #efefef 50%, #ffffff 60%, #ffffff); background: linear-gradient(top, #ffffff, #ffffff 40%, #efefef 50%, #ffffff 60%, #ffffff); border-radius: 4px; border: 1px solid #808281; content: ""; display: block; height: 12px; left: 0; position: absolute; top: calc(50% - 7px); width: 12px;}
.p-checkbox.radio-button::before{ border-radius: 50%; height: 14px; left: -1px; top: calc(50% - 8px); width: 14px;}
.input-checkbox:checked + .p-checkbox::after{ border-bottom: 3px solid #007edf; border-right: 3px solid #007edf; content: ""; display: block; height: 12px; left: 4px; position: absolute; top: calc(50% - 11px); transform: rotate(45deg); width: 6px;}
.input-checkbox:checked + .p-checkbox.radio-button::after{ background-color: #007edf; border-radius: 50%; border: none !important; height: 8px; left: 3px; top: calc(50% - 4px); width: 8px;}

.new-search-footer{ height: 58px;}
.new-search-outcome{ color: #ffffff; font-size: 16px; left: 20px; position: absolute; top: 18px;}
.new-search-outcome > span > span{ color: #feff01; display: inline-block; font-family: "ヒラギノ角ゴ Pro W3"; font-size: 22px; font-weight: bold; margin: 0 6px; position: relative;}
.new-search-outcome > span > span::after{ color: #ffffff; content: "件"; font-size: 14px; height: 14px; position: absolute; right: -18px; top: 2px; width: 14px;}
.new-search-result-bt{ background-color: #086af1; background: -webkit-linear-gradient(top, #498ef3, #157aff 50%, #086af1); background: linear-gradient(top, #498ef3, #157aff 50%, #086af1); border-radius: 6px; border: 1px solid #2361d8; color: #ffffff; cursor: pointer; display: block; font-size: 20px; font-weight: bold; padding: 7px 40px; position: absolute; text-decoration: none; right: 390px; top: calc(50% - 20px);}
.new-search-result-bt.search-now,.new-search-result-bt.disabled-zero{ background-color: #181818; background: -webkit-linear-gradient(top, #3f3f3f, #2b2b2b 50%, #181818); background: linear-gradient(top, #3f3f3f, #2b2b2b 50%, #181818); border: 1px solid #181818; color: #bcbcbc; display: block; opacity: .8; pointer-events: none;}
.new-search-result-bt:link,.new-search-result-bt.search-now:link,.new-search-result-bt:visited,.new-search-result-bt.search-now:visited{ color: #ffffff !important;}
.new-search-check-clear{ background-color: #ffffff; border-radius: 6px; color: #282828; cursor: pointer; font-size: 16px; line-height: 16px; padding: 7px 18px; position: absolute; right: 128px; top: calc(50% - 15px);}
.new-search-check-clear span{ border-radius: 4px; border: 1px solid #808281; display: inline-block; height: 12px; margin: 0 6px 0 2px; position: relative; vertical-align: middle; width: 12px;}
.new-search-check-clear span::after{ border-bottom: 3px solid #007edf; border-right: 3px solid #007edf; content: ""; display: block; height: 12px; left: 4px; position: absolute; top: -5px; transform: rotate(45deg); width: 6px;}
.search-now{ display: none;}
.disabled-zero{ pointer-events: none;}
.disabled-zero p,.checked-zero p{ opacity: .4;}
#detail-search-back{ background-color: #000000; height: 100%; left: 0; opacity: 0.5; position: fixed; top: 0; width: 100%; z-index: 500;}
.search-item-view-toggle{ background-color: #eaeaea; border-radius: 4px; cursor: pointer; padding: 4px;}
.search-item-view-toggle > span{ display: inline-block; padding-left: 16px; position: relative;}
.search-item-view-toggle > span::before{ border-left: 6px solid transparent; border-top: 10px solid #000000; border-right: 6px solid transparent; content: ""; left: 0; position: absolute; top: calc(50% - 5px);}
.search-item-view-toggle.open > span::before{ border-bottom: 10px solid #000000; border-top: none;}
.ul-border-bottom-01{ border-top: 1px solid #c6c6c6; margin-top: 2px; padding-top: 8px;}

@media screen and (max-width: 916px){
.new-search-popup-flame{ left: 5%; width: 90%;}
.new-search-body dl dd ul li{ width: 50%;}
.new-search-result-bt{ right: 20px;}
.new-search-header .new-search-check-clear{ display: block;}
.new-search-footer .new-search-check-clear,.new-search-footer .new-search-close{ display: none;}
}
@media screen and (max-width: 766px){
.new-search-header{ height: 80px;}
.new-search-header h3{ top: 10px; width: calc(100% - 40px);}
.new-search-header .new-search-check-clear,.new-search-header .new-search-close{ top: 40px;}
.new-search-body{ height: calc(100% - 138px);}
}
@media screen and (max-width: 740px){
.new-search-body dl dd ul li{ width: 100%;}
}
@media screen and (max-width: 699px){
.new-search-close:hover,.new-search-check-clear:hover,.new-search-result-bt:hover{ opacity: 1;}
}
@media screen and (max-width: 546px){
.new-search-body{ background-color: #f6f6f6;}
.new-search-body dl dt,.new-search-body dl dd{ border: 1px solid #4d4d4d; float: none; width: calc(100% - 42px);}
.new-search-body dl dt{ background-color: #216bce; margin: 10px 10px 0; padding: 10px;}
.new-search-body dl dt p{ color: #ffffff;}
.new-search-body dl dd{ border-bottom: none; margin: -1px 10px 10px; padding: 0; width: calc(100% - 2px);}
.new-search-body dl dd ul li,.new-search-body dl dd > p{ border-bottom: 1px solid #4d4d4d; margin-bottom: 0;}
.new-search-body dl dd > p,.new-search-body dl dd > p:first-child{ border-bottom: 1px solid #4d4d4d; margin: 0;}
.new-search-body dl dd ul li p{ padding: 10px 10px 10px 26px;}
.new-search-body dl dd ul li .input-text-01{ margin-top: 0; padding: 10px;}
.p-checkbox::before{ left: 10px;}
.input-checkbox:checked + .p-checkbox{ background-color: #ddf8ff;}
.input-checkbox:checked + .p-checkbox::after{ left: 14px;}
.p-checkbox.radio-button::before{ left: 6px;}
.input-checkbox:checked + .p-checkbox.radio-button::after{ left: 10px;}
.new-search-body dl dd ul.pc-lank li:first-child p{ background-position: left 30px top 10px;}
.new-search-body dl dd ul.pc-lank li:nth-child(2) p{ background-position: left 30px top -20px;}
.new-search-body dl dd ul.pc-lank li:nth-child(3) p{ background-position: left 30px top -50px;}
.new-search-body dl dd ul.pc-lank li:nth-child(4) p{ background-position: left 30px top -80px;}
.new-search-body dl dd ul.pc-lank li:nth-child(5) p{ background-position: left 30px top -110px;}
.new-search-body dl dd ul li.keyword-text input{ margin: 10px; width: calc(100% - 32px);}
.search-item-view-toggle{ border-bottom: 1px solid #4d4d4d; border-radius: 0;}
.ul-border-bottom-01{ border-top: none; margin-top: 0; padding-top: 0;}
}
@media screen and (max-width: 516px){
/*
.new-search-header h3{ font-size: 20px;}
.new-search-check-clear{ font-size: 12px; padding: 7px 10px; right: 104px;}
.new-search-close{ font-size: 14px; padding: 7px 30px 7px 10px;}
.new-search-close::before{ right: 8px;}
.new-search-close::after{ right: 10px;}
*/
}
@media screen and (max-width: 476px){
.new-search-outcome{ left: 1px; line-height: 24px; top: 5px; width: 100px; text-align: center;}
.new-search-outcome > span{ display: block;}
.new-search-outcome > span > span{ margin: 0 6px 0 -10px;}
.new-search-outcome.search-now{ top: 20px;}
}
@media screen and (max-width: 452px){
.new-search-header h3{ font-size: 4.7vw; text-align: center;}
.new-search-check-clear{ font-size: 12px; padding: 7px 10px; right: calc(50% - 17px);}
.new-search-close{ font-size: 14px; padding: 7px 30px 7px 10px; right: calc(50% - 109px);}
.new-search-close::before{ right: 8px;}
.new-search-close::after{ right: 10px;}
}
@media screen and (max-width: 426px){
/*
.new-search-check-clear{ right: 12px;}
.new-search-close{ background-color: #330f0d; border-radius: 6px 6px 0 0; color: #ffffff; right: -1px; top: -30px;}
.new-search-close::before{ background-color: #ffffff;}
.new-search-close::after{ color: #282828; right: 8px;}
*/
}
@media screen and (max-width: 396px){
.new-search-header h3{ left: 12px; width: calc(100% - 24px);}
.new-search-result-bt{ font-size: 16px; padding: 7px 16px;}
}