@charset "UTF-8";
.aw_modal_overflow { overflow: hidden; }

.aw_modal { display: none; position: fixed; background-color: rgba(0, 0, 0, 0.6); top: 0; left: 0; width: 100%; height: 100%; z-index: 20; overflow: hidden; overflow-y: scroll; }
.aw_modal form { height: 100%; }
.aw_modal .overlay { z-index: 21; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.aw_modal__inner { z-index: 22; -webkit-transition: all 1s; transition: all 1s; transform: translate3d(0px, 0px, 0px); width: 200vw; height: 100vh; display: flex; justify-content: flex-start; top: 0; left: 0; position: absolute; overflow: hidden; }
.aw_modal__wrap { z-index: 22; position: relative; width: 100vw; height: 100vh; background-color: #ffffff; overflow: hidden; }
.aw_modal__header { width: 100%; background-color: #f2f1ee; display: flex; align-items: center; padding-left: 3.2%; padding-top: 1.86667%; padding-bottom: 1.86667%; }
.aw_modal__header button { border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }
.aw_modal__header__headline { font-size: 3.46667vw; color: #555555; position: absolute; margin: auto; left: 0; right: 0; display: inline-block; text-align: center; width: 50%; }
.aw_modal__header__btns--close, .aw_modal__header__btns--back { display: flex; justify-content: center; align-items: center; width: 21.33333%; border: solid 1px #999999; color: #555555; border-radius: 3px; cursor: pointer; position: relative; }
.aw_modal__header__btns--close > p, .aw_modal__header__btns--back > p { font-size: 3.2vw; position: absolute; }
.aw_modal__header__btns--close::after, .aw_modal__header__btns--back::after { content: ""; display: block; width: 100%; padding: 45% 0 0; }
.aw_modal__footer { width: 100%; background-color: #f2f1ee; padding-top: 1.86667%; padding-bottom: 1.86667%; position: absolute; bottom: 0; }
.aw_modal__footer button { border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }
.aw_modal__footer__btn { margin: 0 auto; display: flex; justify-content: center; align-items: center; width: 93.33333%; border-radius: 4px; cursor: pointer; position: relative; background-color: #a8a59a; }
.aw_modal__footer__btn > p { font-size: 3.46667vw; position: absolute; color: #ffffff; }
.aw_modal__footer__btn::after { content: ""; display: block; width: 100%; padding: 14.28571% 0 0; }
.aw_modal__content { height: 100%; overflow-y: scroll; padding-bottom: 30%; }
.aw_modal__content__select1 { width: 100%; order: 3; }
.aw_modal__content__select2 { width: 100%; padding: 14px 24px; border-bottom: solid #e6e4dd 1px; order: 1; }
.aw_modal__content__result { padding: 14px 24px; border-top: solid #e6e4dd 1px; border-bottom: solid #e6e4dd 1px; width: 100%; order: 2; }
.aw_modal__search__list { width: 100%; height: 48px; color: #555555; border-bottom: solid 1px #e6e4dd; display: flex; justify-content: space-between; align-items: center; padding: 4.66667% 0; padding-left: 2.8%; padding-right: 4.13333%; cursor: pointer; }
.aw_modal__search__list:hover { opacity: 0.8; }
.aw_modal__search__list--category { font-size: 2.8vw; width: 30%; }
.aw_modal__search__list--text-block { width: 70%; position: relative; font-size: 2.93333vw; color: #999999; display: flex; justify-content: flex-end; align-items: center; }
.aw_modal__search__list--text-block::after { width: 10px; height: 10px; margin-left: 4%; content: ""; background-image: url(https://official.itembox.design/item/img/common/icon_modal_arrow_right.png); background-repeat: no-repeat; background-size: auto 100%; }
.aw_modal__reset_btn { width: 100%; padding: 10px; text-align: right; cursor: pointer; outline: none; appearance: none; background-color: transparent; border: none; display: flex; justify-content: flex-end; align-items: center; }
.aw_modal__reset_btn > img { width: 12px; margin-right: 1.33333%; }
.aw_modal__keyword__in { padding: 4.53333% 3.2% 4.26667% 3.2%; }
.aw_modal__keyword--label { font-size: 3.46667vw; }
.aw_modal__keyword--label p { margin-bottom: 2.66667%; }
.aw_modal__keyword--searchbox { height: 44px; }
.aw_modal__keyword__result { border-top: solid #e6e4dd 1px; border-bottom: solid #e6e4dd 1px; padding: 4% 2.66667% 2.66667% 2.66667%; }
.aw_modal__keyword__result__headline { font-size: 3.46667vw; color: #555555; margin-bottom: 4%; }
.aw_modal__keyword__result__list { overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
.aw_modal__keyword__result__item { display: inline-block; width: 28.0%; }
.aw_modal__keyword__result__item:not(:last-of-type) { margin-right: 1.06667%; }
.aw_modal__keyword__result__thumbnail { overflow: hidden; width: 100%; /* トリミングしたい枠の幅 */ position: relative; margin-bottom: 2.66667%; }
.aw_modal__keyword__result__thumbnail::before { content: ""; display: block; width: 100%; padding: 100% 0 0; }
.aw_modal__keyword__result__thumbnail > img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: auto; height: 100%; }
.aw_modal__keyword__result__name { color: #999999; font-size: 2.66667vw; margin-bottom: 2.66667%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aw_modal__keyword__result__price { color: #555555; font-size: 2.66667vw; }
.aw_modal__result { z-index: 23; position: relative; width: 100vw; height: 100vh; background-color: #ffffff; padding-bottom: 9%; }
.aw_modal__result__content { display: none; height: 100%; overflow-y: scroll; padding-bottom: 15%; }
.aw_modal__result__content__headline { font-size: 3.46667vw; color: #555555; margin-bottom: 4%; }
.aw_modal__result__item { width: 100%; color: #555555; cursor: pointer; }
.aw_modal__result__item--category { font-size: 2.8vw; width: 100%; border-bottom: solid 1px #e6e4dd; display: flex; justify-content: flex-start; align-items: center; position: relative; }
.aw_modal__result__item--category::before { content: ""; display: block; width: 100%; padding: 13.33333% 0 0; }
.aw_modal__result__item--text-block { width: 70%; position: relative; font-size: 2.93333vw; color: #999999; display: flex; justify-content: flex-end; align-items: center; }
.aw_modal__result__item--text-block::after { width: 10px; height: 10px; margin-left: 4%; content: ""; background-image: url(https://official.itembox.design/item/img/common/icon_modal_arrow_right.png); background-repeat: no-repeat; background-size: auto 100%; }
.aw_modal__result__item--text { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: space-between; align-items: center; padding: 0 3.73333%; }
.aw_modal__result__item--text.parent-icon::after { width: 2.66667%; height: 10px; margin-left: 4%; content: ""; background-repeat: no-repeat; background-size: 100%; background-position: center; background-image: url(https://official.itembox.design/item/img/common/icon_modal_list_close.png); }
.aw_modal__result__item--text.parent-icon .check-icon::before { display: none; }
.aw_modal__result__item--text .check-icon { display: flex; justify-content: flex-start; align-items: center; width: 90%; }
.aw_modal__result__item--text .check-icon::before { width: 13px; height: 13px; content: ""; margin-right: 6.66667%; display: block; background-repeat: no-repeat; background-size: 100%; background-position: center; background-image: url(https://official.itembox.design/item/img/common/icon_modal_select_off.png); }
.aw_modal__result__item input[type="radio"] { display: none; }
.aw_modal__result .result_child_content { display: none; }
.aw_modal__result .select .check-icon::before { background-image: url(https://official.itembox.design/item/img/common/icon_modal_select_on.png); }
.aw_modal__result .open .result_child_content { display: block; }
.aw_modal__result .open .parent-icon::after { background-image: url(https://official.itembox.design/item/img/common/icon_modal_list_open.png); }
.aw_modal .price { padding: 4% 2.66667% 2.66667% 2.66667%; }
.aw_modal .price__wrap { padding-left: 7.2%; }
.aw_modal .price__wrap input[type="text"] { width: 100%; height: 44px; }
.aw_modal .price__text { text-align: center; }
.aw_modal .price__btn { background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; width: 100%; height: 42px; border-radius: 4px; margin-top: 8.53333%; color: #ffffff; background-color: #a8a59a; }
.aw_modal .price__btn p { font-size: 3.46667vw; }
.aw_modal .color { padding: 4% 2.66667% 2.66667% 2.66667%; }
.aw_modal .color__wrap { display: flex; justify-content: flex-start; flex-wrap: wrap; max-width: 230px; margin: 0 auto; }
.aw_modal .color__list { width: 38px; margin-bottom: 10px; position: relative; }
.aw_modal .color__list:not(:nth-of-type(5n)) { margin-right: 10px; }
.aw_modal .color__list::after { content: ""; display: block; width: 38px; height: 38px; position: absolute; top: 0px; left: 0px; }
.aw_modal .color__list.checked::after { content: ""; display: block; border: solid 4px #f2f1ee; border-radius: 4px; width: 38px; height: 38px; position: absolute; top: -4px; left: -4px; }
.aw_modal .color__list label { width: 38px; height: 38px; display: block; background-repeat: no-repeat; background-position: center; background-size: 100%; }
.aw_modal .color__list input[type="radio"] { display: none; }
.aw_modal .color__list:hover { opacity: 0.8; }
.aw_modal .color__text { text-align: center; }
.aw_modal .color__btn { background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; width: 100%; height: 42px; border-radius: 4px; margin-top: 8.53333%; color: #ffffff; background-color: #a8a59a; }
.aw_modal .color__btn p { font-size: 3.46667vw; }
