@charset "UTF-8";

 :root {
--main-font: "Outfit", "Gothic Medium BBB", sans-serif;
--color_font: #5A5A5A;
--color_secondary: #868E80;  
--color_white: #FFFFFF;
--color_black: #000000;
--color_background: #F5F5F5;
--color_link: #0CA2FF;
} html {
overflow-y: scroll;
}
body {
line-height: 1;
color: var(--color_font);
} html, body, div, span, object, iframe, header, footer,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
em {
font-weight: bold;
font-style: normal;
}
strong {
font-weight: normal;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
ul {
list-style: none;
}
ul,
ol,
dl {
letter-spacing: -0.4em;
}
ul li,
ol li,
dl dt,
dl dd {
letter-spacing: normal;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
content: none;
}
a {
margin: 0;
padding: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
outline: none;
}
ins {
background-color: #ff9;
color: var(--color_black);
text-decoration: none;
}
mark {
background-color: #ff9;
color: var(--color_black);
font-style: italic;
font-weight: bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom: 1px dotted;
cursor: help;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid var(--color_white);
}
input, select {
vertical-align: middle;
} body {
font: 16px/1.75 "Outfit", "Midashi Go MB31", "yu-gothic-pr6n", sans-serif;
*font-size: small;
*font: x-small;
} * html body {
font-size: 100%;
} *:first-child + html body {
font-size: 100%;
}
button {
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
} .fade {
opacity: 0.7;
-moz-opacity: 0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha(opacity=70)";
}
.inline_block {
display: inline-block;
*display: inline;
*zoom: 1;
}
.table_cell {
display: table-cell;
*display: inline;
*zoom: 1;
vertical-align: middle;
}
.fr,
.imgR {
float: right;
margin-left: 10px;
}
.fl,
.imgL {
float: left;
margin-right: 10px;
}
.imgC,
.tC,
.btn {
text-align: center;
}
.imgC {
display: block;
margin-left: auto;
margin-right: auto;
}
.tR,
.sign {
text-align: right;
}
.tL {
text-align: left;
}
.box_size {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
}
.ts_none {
-webkit-text-shadow: none !important;
-moz-text-shadow: none !important;
-ms-text-shadow: none !important;
-o-text-shadow: none !important;
text-shadow: none !important;
}
.bs_none {
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
-ms-box-shadow: none !important;
-o-box-shadow: none !important;
box-shadow: none !important;
}
.att {
color: #F00;
}
.att a {
color: #F00;
}
.mb00 {
margin-bottom: 0 !important;
}
.size_s {
font-size: 82%;
}
.size_l {
font-size: 113%;
}
ul.disc li {
list-style: disc;
margin: 0 1.4em;
}
ul.decimal li {
list-style: decimal;
margin: 0 1.4em;
} .clearfix, ul.disc {
position: relative;
*zoom: 1;
}
.clearfix:after, ul.disc:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
} .fadeIn {
opacity: 0; transition: opacity 4s ease;;
}
.fadeIn.is-show { opacity: 1;
} 
.fadeInUp {
opacity: 0;
transform: translate(0, 20%);
transition: 2s;
}
.fadeInUp.is-show {
transform: translate(0, 0);
opacity: 1;
}
.slideInLeft {
opacity: 0;
transform: translateX(-10%);
transition: 2s;
}
.slideInLeft.is-show {
transform: translateX(0%);
opacity: 1;
}
.slideInRight {
opacity: 0;
transform: translateX(15%);
transition: 2s;
}
.slideInRight.is-show {
transform: translateX(0%);
opacity: 1;
} .fadeInDown {
opacity: 0;
transform: translate(0, -35%);
transition: 2s;
}
.fadeInDown.is-show {
transform: translate(0, 0);
opacity: 1;
} .inview .line {
display: block;
opacity: 0;
transform: translateY(20px);
transition: all 0.6s ease;
}
.inview.is-show .line {
opacity: 1;
transform: translateY(0);
} .inview.is-show .line:nth-child(1) { transition-delay: 0s; }
.inview.is-show .line:nth-child(2) { transition-delay: 1s; }
.inview.is-show .line:nth-child(3) { transition-delay: 2s; } .text-focus {
filter: blur(10px);
opacity: 0;
transition: filter 1.2s ease, opacity 1.2s ease;
}
.text-focus.is-visible {
filter: blur(0);
opacity: 1;
}
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
font-size: 17px;
} body {
color: var(--color_font);
font-family: var(--main-font);
font-weight: 300;
line-height: 1.64;
position: relative;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
background-color: var(--color_background);
}
* html body, * html input, * html textarea {
font-family: var(--main-font);
}
* {
box-sizing: border-box;
}
ul li, ol li, dl dt, dl dd {
letter-spacing: 0.05em;
}
a {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
text-decoration: none;
cursor: pointer;
transition: all 0.4s ease;
color: var(--color_font);
}
a img {
transition: all 0.4s ease;
}
a:hover, a:focus, a:active {
color: var(--color_font);
}
a:hover img {
opacity: 0.7;
}
img, picture, video {
width: auto;
max-width: 100%;
height: auto;
display: block;
margin: 0 auto;
}
h1, h2, h3, h4, h5 {
margin: 0 auto;
}
sup {
font-size: 0.6em;
vertical-align: top;
}
strong {
font-weight: 700;
}
hr {
border-color: var(--color_border);
margin-top: 10px;
margin-bottom: 10px;
}
p:empty {
display: none;
}
@media screen and (max-width: 767px) {
.pc {
display: none;
}
}
@media screen and (min-width: 768px) {
.sp {
display: none;
}
}
.object_fit_img {
object-fit: contain;
font-family: "object-fit: contain;";
width: 100% !important;
height: 100% !important;
}
.object_fit_img_cover {
object-fit: cover;
font-family: "object-fit: cover;";
width: 100% !important;
height: 100% !important;
}
.container {
position: relative;
margin: 0 auto;
padding-left: 6.3636363636vw;
padding-right: 6.3636363636vw;
width: 1280px;
max-width: 100%;
}
@media screen and (min-width: 768px) {
.container {
padding-left: 40px;
padding-right: 40px;
}
}
.container--narrow {
width: 960px;
}
.link--arrow {
display: inline-block;
position: relative;
text-decoration: none;
} .link--arrow::before {
content: "";
position: absolute;
left: 0;
bottom: -2px;
width: 100%;
height: 1px;
background: currentColor;
transform: scaleX(0);
transform-origin: left;
transition: transform 0.4s ease;
}
.link--arrow:hover::before {
transform: scaleX(1);
}
.link--arrow:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
margin-top: -5px;
margin-left: 16px;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M6.68742 18.3334L5.20825 16.8542L12.0624 10L5.20825 3.14585L6.68742 1.66669L15.0208 10L6.68742 18.3334Z" fill="%235A5A5A"/></svg>') no-repeat center center;
background-size: contain;
}
.link--external {
display: inline-block;
position: relative;
}
.link--external:after {
content: "";
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
margin-top: -10px;
margin-left: 16px;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M8.33333 5V6.66667H4.16667V15.8333H13.3333V11.6667H15V16.6667C15 17.1269 14.6269 17.5 14.1667 17.5H3.33333C2.8731 17.5 2.5 17.1269 2.5 16.6667V5.83333C2.5 5.3731 2.8731 5 3.33333 5H8.33333ZM17.5 2.5V9.16667H15.8333L15.8333 5.34417L9.33925 11.8392L8.16074 10.6607L14.6541 4.16667H10.8333V2.5H17.5Z" fill="%235A5A5A"/></svg>') no-repeat center center;
background-size: contain;
}
.link--map {
display: inline-block;
position: relative;
}
.link--map:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 18px;
height: 18px;
margin-top: -6px;
margin-right: 4px;
background: url(https://blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/ico_map.svg) no-repeat center center;
background-size: contain;
}
.language__switcher,
.language__switcher_nl {
display: flex;
font-size: calc(25 / 17 * 1rem);
}
.language__switcher a {
opacity: 0.5;
}
.language__switcher li + li:before,
.language__switcher_nl li + li:before {
content: "/";
display: inline-block;
margin-left: 4px;
margin-right: 4px;
}
.button_menu {
display: flex;
flex-direction: column;
row-gap: 15px;
}
.button_menu a {
border-radius: 10px;
border: 1px solid var(--color_white);
display: block;
text-align: center;
padding: 0.8em 1em;
font-size: calc(20 / 17 * 1rem);
font-weight: 300;
letter-spacing: 0.1em;
color: var(--color_white);
position: relative;
width: 410px;
}
@media screen and (max-width: 767px) {
.button_menu a { width: 100%;
}
}
.button_menu a:before {
content: "";
display: block;
width: 28px;
height: 28px;
margin-right: 10px;
opacity: 0.5;
position: absolute;
left: 30px;
top: 50%;
transform: translateY(-50%);
}
.button_menu li:nth-child(1) a:before {
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g opacity="0.5"><path d="M3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM20 7.23792L12.0718 14.338L4 7.21594V19H20V7.23792ZM4.51146 5L12.0619 11.662L19.501 5H4.51146Z" fill="white"/></g></svg>') no-repeat center center;
background-size: contain;
}
.button_menu li:nth-child(2) a:before {
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><g opacity="0.5"><path d="M21.7267 2.95694L16.2734 22.0432C16.1225 22.5716 15.7979 22.5956 15.5563 22.1126L11 13L1.9229 9.36919C1.41322 9.16532 1.41953 8.86022 1.95695 8.68108L21.0432 2.31901C21.5716 2.14285 21.8747 2.43866 21.7267 2.95694ZM19.0353 5.09647L6.81221 9.17085L12.4488 11.4255L15.4895 17.5068L19.0353 5.09647Z" fill="white"/></g></svg>') no-repeat center center;
background-size: contain;
}
.sns_menu .instagram a {
display: inline-block;
font-size: calc(15 / 17 * 1rem);
font-weight: 300;
}
.sns_menu .instagram a:before {
content: "";
display: inline-block;
vertical-align: middle;
width: 22px;
height: 22px;
margin-right: 10px;
opacity: 0.5;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28" fill="none"><path d="M14.0012 10.5C12.0675 10.5 10.5011 12.0669 10.5011 14C10.5011 15.9335 12.0681 17.5 14.0012 17.5C15.9347 17.5 17.5012 15.933 17.5012 14C17.5012 12.0665 15.9342 10.5 14.0012 10.5ZM14.0012 8.16665C17.2216 8.16665 19.8345 10.7766 19.8345 14C19.8345 17.2206 17.2245 19.8333 14.0012 19.8333C10.7806 19.8333 8.16781 17.2234 8.16781 14C8.16781 10.7794 10.7778 8.16665 14.0012 8.16665ZM21.5845 7.87399C21.5845 8.67912 20.9302 9.33235 20.1262 9.33235C19.321 9.33235 18.6678 8.67811 18.6678 7.87399C18.6678 7.06986 19.322 6.41665 20.1262 6.41665C20.9292 6.41563 21.5845 7.06986 21.5845 7.87399ZM14.0012 4.66665C11.1142 4.66665 10.6437 4.67429 9.30098 4.73408C8.38617 4.77702 7.77295 4.90006 7.20318 5.12126C6.69685 5.31764 6.3316 5.55212 5.94244 5.94129C5.55178 6.33195 5.31771 6.69622 5.12213 7.20278C4.90042 7.77385 4.77741 8.38611 4.73524 9.29966C4.67486 10.5877 4.66781 11.0379 4.66781 14C4.66781 16.8869 4.67545 17.3574 4.73523 18.7C4.7782 19.6145 4.9014 20.2286 5.12206 20.797C5.31895 21.304 5.55391 21.6701 5.9412 22.0575C6.3334 22.4491 6.69875 22.684 7.20051 22.8776C7.77722 23.1006 8.39006 23.2238 9.3008 23.2659C10.5889 23.3262 11.039 23.3333 14.0012 23.3333C16.8881 23.3333 17.3586 23.3256 18.7012 23.2659C19.6136 23.2231 20.2282 23.0995 20.7982 22.879C21.3038 22.6827 21.6711 22.4469 22.0586 22.0599C22.4509 21.6671 22.6852 21.3026 22.8791 20.7997C23.1015 20.2251 23.2249 19.6114 23.2671 18.7004C23.3274 17.4122 23.3345 16.962 23.3345 14C23.3345 11.1131 23.3268 10.6426 23.2671 9.29991C23.2241 8.38722 23.1006 7.77172 22.8798 7.20202C22.684 6.69709 22.4486 6.33072 22.0598 5.94129C21.6685 5.54999 21.3052 5.3164 20.7983 5.12097C20.2277 4.89944 19.6145 4.77627 18.7014 4.73409C17.4134 4.6737 16.9632 4.66665 14.0012 4.66665ZM14.0012 2.33331C17.1705 2.33331 17.5663 2.34498 18.8107 2.40331C20.0522 2.46068 20.8991 2.65706 21.6428 2.94581C22.4118 3.24234 23.0613 3.6429 23.7097 4.29136C24.3572 4.93985 24.7578 5.59123 25.0553 6.35831C25.343 7.1011 25.5395 7.94887 25.5978 9.1904C25.6532 10.4348 25.6678 10.8305 25.6678 14C25.6678 17.1695 25.6562 17.5651 25.5978 18.8096C25.5404 20.0511 25.343 20.8979 25.0553 21.6416C24.7588 22.4107 24.3572 23.0601 23.7097 23.7086C23.0613 24.3561 22.4089 24.7567 21.6428 25.0542C20.8991 25.342 20.0522 25.5383 18.8107 25.5967C17.5663 25.6521 17.1705 25.6667 14.0012 25.6667C10.8317 25.6667 10.436 25.655 9.19156 25.5967C7.95002 25.5393 7.10419 25.342 6.35947 25.0542C5.59141 24.7576 4.94099 24.3561 4.29252 23.7086C3.64406 23.0601 3.24447 22.4078 2.94697 21.6416C2.65822 20.8979 2.46281 20.0511 2.40447 18.8096C2.34906 17.5651 2.33447 17.1695 2.33447 14C2.33447 10.8305 2.34614 10.4348 2.40447 9.1904C2.46183 7.9479 2.65822 7.10206 2.94697 6.35831C3.24349 5.59026 3.64406 4.93985 4.29252 4.29136C4.94099 3.6429 5.59239 3.24331 6.35947 2.94581C7.10322 2.65706 7.94906 2.46165 9.19156 2.40331C10.436 2.3479 10.8317 2.33331 14.0012 2.33331Z" fill="white"/></svg>') no-repeat center center;
background-size: contain;
}
.section {
position: relative;
padding-top: 50px;
padding-bottom: 50px;
}
@media screen and (min-width: 768px) {
.section {
padding-top: 80px;
padding-bottom: 80px;
}
}
.section .section__title {
margin-bottom: calc(40px / 2);
}
@media screen and (min-width: 768px) {
.section .section__title {
margin-bottom: 40px;
}
} ul.other-option {
display: flex;
column-gap: 20px;
border-bottom: 1px solid #C3C3C3;
padding: 20px 0;
margin: 0;
}
ul.other-option:last-child {
border-bottom: none;
}
ul.other-option li {
list-style-type: none;
}
ul.other-option li:nth-child(1) {
width: 150px;
}
ul.other-option li:nth-child(2) {
width: calc(100% - 150px);
}
ul p {
margin: 0 0 5px 0;
}
.grayout {
opacity: 0.3;
}
@media screen and (max-width: 767px) {
ul.other-option {
flex-wrap: wrap;
}
ul.other-option li:nth-child(1) {
width: 100%;
margin-bottom: 10px;
}
ul.other-option li:nth-child(2) {
width: 100%;
}
}
#wrapper {
overflow: hidden;
}
#pageHeader {
position: absolute;
left: 0;
top: 0;
width: 100%;
z-index: 99;
}
#pageHeader .container {
width: 100%;
}
#pageHeader .header__contents,
#pageHeader .header__contents_nl {
display: flex;
justify-content: flex-end;
padding-top: 40px; 
}
#pageHeader .header__contents {
padding-right: 80px;
}
@media screen and (max-width: 767px) {
#pageHeader .header__contents,
#pageHeader .header__contents_nl {
padding-top: 6.3636363636vw;
}
}
#pageHeader .header__logo {
position: fixed;
left: 40px;
top: 40px;
}
#pageHeader .header__logo img {
width: 60px;
}
@media screen and (max-width: 767px) {
#pageHeader .header__logo {
top: 6.3636363636vw;
left: 6.3636363636vw;
}
}
#pageHeader .header__menu {
display: flex;
justify-content: flex-end;
align-items: center;
column-gap: 30px;
}
#pageHeader .header__menu .menu {
display: flex;
column-gap: 30px;
font-size: calc(25 / 17 * 1rem);
font-weight: 300;
}
@media screen and (max-width: 767px) {
#pageHeader .header__menu .menu {
display: none;
}
}
#pageHeader .header__menu .menu .sub-menu {
display: none;
}
@media screen and (max-width: 767px) {
#pageHeader .header__menu .language__switcher {
display: none;
}
}
#pageHeader .header__menu__open {
position: fixed;
top: 45px;
right: 40px;
}
#pageHeader .header__menu__open:before, #pageHeader .header__menu__open:after {
content: "";
display: block;
width: 55px;
height: 2px;
margin: 8px auto;
background: var(--color_font);
}
@media screen and (max-width: 767px) {
#pageHeader .header__menu__open:before, #pageHeader .header__menu__open:after {
width: 40px;
}
}
@media screen and (max-width: 767px) {
#pageHeader .header__menu__open {
top: 6.3636363636vw;
right: 6.3636363636vw;
}
}
#pageHeader .header__navigation {
position: fixed;
right: 0;
top: 0;
height: 100vh;
background: var(--color_secondary);
z-index: 999;
width: 40%;
transform: translateX(100%);
transition: transform 0.3s ease-in-out;
padding: 60px 80px 20px;
color: var(--color_white);
}
@media screen and (max-width: 767px) {
#pageHeader .header__navigation {
padding: 13.6363636364vw 6.3636363636vw 10px;
width: 100%;
}
}
#pageHeader .header__navigation.is-open {
transform: translateX(0);
}
#pageHeader .header__navigation__close {
position: absolute;
display: block;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="53" height="21" viewBox="0 0 53 21" fill="none"><rect x="0.684052" width="55" height="2" transform="rotate(20 0.684052 0)" fill="white"/><rect y="18.8111" width="55" height="2" transform="rotate(-20 0 18.8111)" fill="white"/></svg>') no-repeat right top;
background-size: contain;
width: 53px;
height: 21px;
right: 40px;
top: 40px;
cursor: pointer;
}
@media screen and (max-width: 767px) {
#pageHeader .header__navigation__close {
width: 40px;
right: 6.3636363636vw;
top: 6.3636363636vw;
}
}
#pageHeader .header__navigation a {
color: var(--color_white);
}
#pageHeader .header__navigation .menu {
color: var(--color_white);
font-size: calc(22 / 17 * 1rem);
font-weight: 300;
line-height: 2;
}
@media screen and (min-width: 768px) {
#pageHeader .header__navigation .menu {
line-height: 1.8;
}
}
@media screen and (max-width: 767px) {
#pageHeader .header__navigation .menu {
font-size: calc(22 / 17 * 1rem);
}
}
#pageHeader .header__navigation .menu__wrapper {
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#pageHeader .header__navigation .menu__wrapper {
margin-bottom: 15px;
}
}
#pageHeader .header__navigation .menu .sub-menu {
margin-left: 0.6em;
}
#pageHeader .header__navigation .menu .sub-menu li:before {
content: "-";
display: inline-block;
font-size: calc(22 / 17 * 1rem);
margin-left: -0.6em;
width: 1em;
text-align: left; opacity: 0.3;
}
@media screen and (max-width: 767px) {
#pageHeader .header__navigation .menu .sub-menu li:before {
font-size: calc(26 / 17 * 1rem);
}
}
#pageHeader .header__navigation .language__switcher {
font-size: calc(22 / 17 * 1rem);
font-weight: 400;
}
#pageHeader .header__navigation .language__switcher__wrapper {
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#pageHeader .header__navigation .language__switcher {
font-size: calc(22 / 17 * 1rem);
}
#pageHeader .header__navigation .language__switcher__wrapper {
margin-bottom: 15px;
}
}
#pageHeader .header__navigation .button_menu__wrapper {
margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#pageHeader .header__navigation .button_menu__wrapper {
margin-bottom: 15px;
}
}
#pageFooter {
background: #3F3F3F;
color: var(--color_white);
padding-top: 80px;
padding-bottom: 60px;
}
#pageFooter .container {
width: 100%;
}
@media screen and (max-width: 767px) {
#pageFooter {
padding-top: 60px;
}
}
#pageFooter .footer__contents {
display: flex;
justify-content: space-between;
align-items: flex-start;
color: var(--color_white);
}
@media screen and (max-width: 767px) {
#pageFooter .footer__contents {
flex-direction: column;
row-gap: 6.3636363636vw;
}
}
#pageFooter .footer__contents a {
color: var(--color_white);
font-weight: 200;
}
#pageFooter .footer__logo {
flex-shrink: 0;
}
#pageFooter .footer__logo a {
display: block;
}
#pageFooter .footer__logo a:hover img {
opacity: 0.2;
}
#pageFooter .footer__logo img {
width: 200px;
opacity: 0.4;
}
@media screen and (max-width: 767px) {
#pageFooter .footer__logo img {
width: 160px;
}
}
#pageFooter .footer__menu {
display: flex;
justify-content: flex-end;
align-items: flex-start;
column-gap: 40px;
font-size: calc(20 / 17 * 1rem);
font-weight: 300;
}
#pageFooter .footer__menu .menu {
display: flex;
justify-content: flex-end;
align-items: flex-start;
column-gap: 40px;
}
#pageFooter .footer__menu .language__switcher,
#pageFooter .footer__menu .language__switcher_nl {
font-size: calc(20 / 17 * 1rem);
font-weight: 300;
}
@media screen and (max-width: 767px) {
#pageFooter .footer__menu {
display: block;
column-gap: 20px;
row-gap: 20px;
font-size: calc(22 / 17 * 1rem);
}
#pageFooter .footer__menu .menu {
display: block;
column-gap: 20px;
justify-content: flex-start;
}
#pageFooter .footer__menu .language__switcher,
#pageFooter .footer__menu .language__switcher_nl {
margin-top: 16px;
font-size: calc(22 / 17 * 1rem);
}
}
#pageFooter .footer__menu .menu .sub-menu {
margin-left: 0.6em;
}
#pageFooter .footer__menu .menu .sub-menu li:before {
content: "-";
display: inline-block;
font-size: calc(22 / 17 * 1rem);
margin-left: -0.6em;
width: 1em;
text-align: left; opacity: 0.3;
}
@media screen and (max-width: 767px) {
#pageFooter .footer__menu .menu .sub-menu li:before {
font-size: calc(26 / 17 * 1rem);
}
}
#pageFooter .footer__sns {
display: flex;
justify-content: flex-end;
margin-top: 30px;
}
@media screen and (max-width: 767px) {
#pageFooter .footer__sns {
display: block;
}
}
#pageFooter .footer__sns .sns_menu .instagram a {
text-indent: -1000px;
overflow: hidden;
width: 24px;
height: 24px;
position: relative;
}
#pageFooter .footer__sns .sns_menu .instagram a:before {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
#pageFooter .footer__bottom {
margin-top: 30px;
border-top: 1px solid rgba(217, 217, 217, 0.3);
padding-top: 30px;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 767px) {
#pageFooter .footer__bottom {
flex-direction: column;
row-gap: 10px;
}
}
#pageFooter .footer__address {
opacity: 0.6;
font-size: calc(12 / 17 * 1rem);
}
#pageFooter .footer__address__map {
display: inline-block;
font-weight: 200;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M8 15.8188L3.75736 11.5762C1.41421 9.23296 1.41421 5.434 3.75736 3.09086C6.10051 0.747709 9.89947 0.747709 12.2427 3.09086C14.5858 5.434 14.5858 9.23296 12.2427 11.5762L8 15.8188ZM11.2998 10.6333C13.1223 8.8109 13.1223 5.85611 11.2998 4.03366C9.4774 2.21122 6.52261 2.21122 4.70017 4.03366C2.87772 5.85611 2.87772 8.8109 4.70017 10.6333L8 13.9332L11.2998 10.6333ZM8 8.66683C7.2636 8.66683 6.66667 8.0699 6.66667 7.3335C6.66667 6.59712 7.2636 6.00016 8 6.00016C8.7364 6.00016 9.33333 6.59712 9.33333 7.3335C9.33333 8.0699 8.7364 8.66683 8 8.66683Z" fill="white" /></svg>') no-repeat left center;
background-size: 16px auto;
padding-left: 20px;
margin-left: 10px;
color: var(--color_white);
}
@media screen and (max-width: 767px) {
#pageFooter .footer__address {
font-size: calc(14 / 17 * 1rem);
}
#pageFooter .footer__address__map {
margin-left: 0px;
}
}
#pageFooter .footer__copyright {
opacity: 0.6;
font-size: calc(15 / 17 * 1rem);
font-weight: 200;
}
#pageMain {
margin-top: 150px; }
@media screen and (max-width: 767px) {
#pageMain {
margin-top: 80px;
}
}
@keyframes mmfadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes mmfadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes mmslideIn {
from {
transform: translateY(15%);
}
to {
transform: translateY(0);
}
}
@keyframes mmslideOut {
from {
transform: translateY(0);
}
to {
transform: translateY(-10%);
}
}
#pageMain .modal {
display: none;
}
#pageMain .modal.is-open {
display: block;
}
#pageMain .modal[aria-hidden=false] .modal-overlay {
animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}
#pageMain .modal[aria-hidden=false] .modal-container {
animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}
#pageMain .modal[aria-hidden=true] .modal-overlay {
animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}
#pageMain .modal[aria-hidden=true] .modal-container {
animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}
#pageMain .modal-overlay {
align-items: center;
background: rgba(0, 0, 0, 0.6);
bottom: 0;
display: flex;
justify-content: center;
left: 0;
position: fixed;
right: 0;
top: 0;
z-index: 100;
will-change: transform;
}
#pageMain .modal-close {
background: transparent;
border: 0;
width: 70px;
height: 70px;
background: var(--color_secondary);
border-radius: 50%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
#pageMain .modal-close:before {
content: "";
display: block;
width: 33px;
height: 33px;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="33" height="33" viewBox="0 0 33 33" fill="none"><path d="M8.8 26.125L6.875 24.2L14.575 16.5L6.875 8.8L8.8 6.875L16.5 14.575L24.2 6.875L26.125 8.8L18.425 16.5L26.125 24.2L24.2 26.125L16.5 18.425L8.8 26.125Z" fill="white"/></svg>') no-repeat center center;
background-size: contain;
}
@media screen and (max-width: 767px) {
#pageMain .modal-close {
width: 35px;
height: 35px;
}
#pageMain .modal-close:before {
width: 17px;
height: 17px;
}
}
#pageMain .modal-container {
background-color: var(--color_white);
border-radius: 30px;
width: 800px;
height: 600px;
max-width: 80%;
max-height: 90vh;
padding: 60px;
will-change: transform;
position: relative;
}
#pageMain .modal-container .modal-close {
position: absolute;
right: 20px;
top: 20px;
}
@media screen and (max-width: 767px) {
#pageMain .modal-container {
border-radius: 15px;
padding: 9.0909090909vw 4.5454545455vw 4.5454545455vw;
max-width: 90vw;
}
#pageMain .modal-container .modal-close {
right: 2.2727272727vw;
top: 2.2727272727vw;
}
}
#pageMain .modal-contents {
height: 100%;
overflow-y: auto;
}
#pageMain .flexslider {
margin: 0;
border-radius: 0;
border: none;
background: transparent;
}
#pageMain .flexslider__wrapper {
position: relative;
}
#pageMain .flexslider .flex-direction-nav .flex-prev, #pageMain .flexslider .flex-direction-nav .flex-next {
opacity: 0;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="31" height="31" viewBox="0 0 31 31" fill="none"><path d="M20.6344 28.4166L22.9271 26.1239L12.3031 15.4999L22.9271 4.87596L20.6344 2.58325L7.71771 15.4999L20.6344 28.4166Z" fill="%231F1F1F"/></svg>') no-repeat center center rgba(255, 255, 255, 0.3);
border-radius: 50%;
width: 70px;
height: 70px;
text-indent: -1000px;
text-align: left;
overflow: hidden;
margin: 0;
transform: translateY(-50%);
}
#pageMain .flexslider .flex-direction-nav .flex-prev::before, #pageMain .flexslider .flex-direction-nav .flex-next::before {
display: none;
}
@media screen and (max-width: 767px) {
#pageMain .flexslider .flex-direction-nav .flex-prev, #pageMain .flexslider .flex-direction-nav .flex-next {
width: 46px;
height: 46px;
}
}
#pageMain .flexslider .flex-direction-nav .flex-next {
background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="26" viewBox="0 0 16 26" fill="none"><path d="M2.29271 25.8333L0 23.5406L10.624 12.9167L0 2.29271L2.29271 0L15.2094 12.9167L2.29271 25.8333Z" fill="%231F1F1F"/></svg>');
}
#pageMain .flexslider:hover .flex-direction-nav .flex-prev {
opacity: 1;
left: 10px;
top: 50%; transition: unset;
}
#pageMain .flexslider:hover .flex-direction-nav .flex-next {
opacity: 1;
right: 10px;
top: 50%; }
#pageMain .product_slider .product__block a {
display: block;
height: 100%;
position: relative;
transition: opacity 0.3s ease-in-out;
overflow: hidden;
aspect-ratio: 3/4;
}
#pageMain .product_slider .product__block a:after {
opacity: 0;
content: "View Product";
background: rgba(0, 0, 0, 0.7);
color: var(--color_white);
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-size: calc(20 / 17 * 1rem);
font-weight: 300;
}
#pageMain .product_slider .product__block a:hover:after {
opacity: 1;
}
#pageMain .product_slider .product__block a:hover img {
transform: scale(1.1);
}
#pageMain .product_slider--gallery .product__block {
aspect-ratio: 3/4;
overflow: hidden;
}
#pageMain .pagination {
margin-top: 40px;
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
} @media screen and (min-width: 768px) {
#pageMain .pagination a, #pageMain .pagination span {
font-size: calc(18 / 17 * 1rem);
line-height: 1.6;
}
}
@media screen and (max-width: 767px) {
#pageMain .breadcrumb {
margin-bottom: 20px;
}
}
#pageMain .breadcrumb ul {
display: flex;
gap: 10px;
overflow: hidden;
}
#pageMain .breadcrumb ul li {
font-size: calc(19 / 17 * 1rem);
font-weight: 200;
flex-shrink: 0;
}
@media screen and (max-width: 767px) {
#pageMain .breadcrumb ul li {
font-size: calc(12 / 17 * 1rem);
}
}
#pageMain .breadcrumb ul li:after {
content: "/";
display: inline-block;
margin-left: 10px;
}
#pageMain .breadcrumb ul li:last-of-type:after {
display: none;
}
#pageMain .breadcrumb ul li a {
color: var(--color_link);
text-decoration: underline;
}
#pageMain .mention__list {
font-size: calc(12 / 17 * 1rem);
margin-left: 1em;
}
#pageMain .mention__list li:before {
content: "*";
display: inline-block;
width: 1em;
margin-left: -1em;
}
#pageMain .product__list {
display: flex;
column-gap: 32px;
row-gap: 76px;
flex-wrap: wrap;
align-items: flex-start;
justify-content: flex-start;
}
#pageMain .product__list > div {
width: calc((100% - 64px) / 3);
flex-shrink: 0;
}
@media screen and (max-width: 767px) {
#pageMain .product__list {
column-gap: 2.6666666667vw;
row-gap: 8vw;
}
#pageMain .product__list > div {
width: calc((100% - 2.6666666667vw) / 2);
}
}
#pageMain .product__main {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
@media screen and (max-width: 767px) {
#pageMain .product__main {
flex-direction: column;
}
}
#pageMain .product__main--sold_out .product__price__price__amount {
text-decoration: line-through;
}
#pageMain .product__images {
width: 55%;
}
@media screen and (max-width: 767px) {
#pageMain .product__images {
width: 100%;
}
}
#pageMain .product__images .aside-visual {
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
align-items: flex-start;
}
#pageMain .product__images .slider {
width: calc(100% - 90px);
}
#pageMain .product__images .thumbnail {
width: 85px;
}
#pageMain .product__images .thumbnail .slides li {
float: none !important;
margin-bottom: 5px;
}
#pageMain .product__images .thumbnail:hover .flex-direction-nav .flex-prev {
opacity: 0.7;
left: 50%;
top: 10px;
transform: translate(-50%, 0);
transition: unset;
}
#pageMain .product__images .thumbnail:hover .flex-direction-nav .flex-next {
opacity: 0.7;
left: 50%;
transform: translate(-50%, 0);
bottom: unset;
right: unset;
top: unset;
}
#pageMain .product__images .thumbnail .flex-direction-nav {
display: none;
}
#pageMain .product__contents {
width: 38.3333333333%;
}
@media screen and (max-width: 767px) {
#pageMain .product__contents {
width: 100%;
}
}
#pageMain .product__contents h2 {
color: #5A5A5A;
font-size: calc(65 / 17 * 1rem);
font-weight: 300;
}
@media screen and (max-width: 767px) {
#pageMain .product__contents h2 {
font-size: calc(54 / 17 * 1rem);
}
}
#pageMain .product__contents h3 {
color: var(--color_secondary);
font-size: calc(41 / 17 * 1rem);
font-weight: 300;
}
@media screen and (max-width: 767px) {
#pageMain .product__contents h3 {
font-size: calc(30 / 17 * 1rem);
}
}
#pageMain .product__contents > div {
border-bottom: 1px solid #C3C3C3;
padding-bottom: 30px;
margin-bottom: 30px;
}
#pageMain .product__contents > div:last-child {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 0;
}
#pageMain .product__specification dl {
display: flex;
column-gap: 20px;
font-size: calc(21 / 17 * 1rem);
}
#pageMain .product__specification dl dt {
width: 90px;
flex-shrink: 0;
}
#pageMain .product__specification dl dd {
flex-grow: 1;
}
#pageMain .product__label {
display: inline-block;
border-radius: 2px;
background: #9D9B7D;
color: var(--color_white);
font-size: calc(14 / 17 * 1rem);
font-weight: 300;
line-height: 1.4;
padding: 0 6px;
vertical-align: middle;
margin-left: 10px;
}
#pageMain .product__buttons {
text-align: center;
}
#pageMain .product__button {
display: inline-block;
border-radius: 10px;
background: var(--color_black);
border: 2px solid var(--color_black);
color: var(--color_white);
text-align: center;
font-size: calc(24 / 17 * 1rem);
font-weight: 300;
letter-spacing: 0.01em;
width: 460px;
max-width: 100%;
padding: 30px 0;
position: relative;
}
@media screen and (max-width: 767px) {
#pageMain .product__button {
font-size: calc(20 / 17 * 1rem);
padding-top: 1em;
padding-bottom: 1em;
}
}
#pageMain .product__button:before {
content: "";
display: block;
position: absolute;
left: 10.8695652174%;
top: 50%;
width: 21px;
height: 21px;
background: url(https://blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/ico_check.svg) no-repeat center center;
transform: translateY(-50%);
transition: left 0.3s ease-in-out;
}
#pageMain .product__button:hover, #pageMain .product__button:focus, #pageMain .product__button:active {
background: var(--color_white);
color: var(--color_black);
}
#pageMain .product__button:hover:before, #pageMain .product__button:focus:before, #pageMain .product__button:active:before {
left: 11.9565217391%;
}
#pageMain .product__button--cart:before {
width: 28px;
height: 28px;
background-image: url(https://blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/ico_cart.svg);
}
#pageMain .product__button + .product__button {
margin-top: 30px;
}
#pageMain .product__paypal, #pageMain .product__paypal form {
width: 100% !important;
}
#pageMain .product__paypal input[type=submit] {
width: 100% !important;
height: 80px !important;
border-radius: 10px !important;
}
#pageMain .product__paypal section {
display: flex;
align-items: center;
column-gap: 10px;
}
#pageMain .product__option h3 {
color: var(--color_secondary);
font-size: calc(41 / 17 * 1rem);
font-weight: 300;
}
@media screen and (max-width: 767px) {
#pageMain .product__option h3 {
font-size: calc(20 / 17 * 1rem);
}
}
#pageMain .product__option dl {
display: flex;
column-gap: 50px;
border-bottom: 1px solid #C3C3C3;
padding: 10px 0;
align-items: center;
}
#pageMain .product__option dl:before {
width: 40px;
content: "01";
display: block;
color: #C3C3C3;
font-size: calc(50 / 17 * 1rem);
font-size: 40px;
font-weight: 200;
letter-spacing: 0.05em;
flex-shrink: 0;
}
#pageMain .product__option dl dt {
width: 150px;
flex-shrink: 0;
font-size: calc(19 / 17 * 1rem); }
@media screen and (max-width: 767px) {
#pageMain .product__option dl {
flex-wrap: wrap;
column-gap: 20px;
}
#pageMain .product__option dl:before {
font-size: calc(25 / 17 * 1rem);
}
#pageMain .product__option dl dt {
width: auto;
}
#pageMain .product__option dl dd {
width: 100%;
padding-left: 60px;
}
}
#pageMain .product__option dl:nth-of-type(2):before {
content: "02";
}
#pageMain .product__option dl:nth-of-type(3):before {
content: "03";
}
#pageMain .product__option dl:nth-of-type(4):before {
content: "04";
}
#pageMain .product__option dl:nth-of-type(5):before {
content: "05";
}
#pageMain .product__option dl:nth-of-type(6):before {
content: "06";
}
#pageMain .product__sample h3 {
color: var(--color_secondary);
font-size: calc(41 / 17 * 1rem);
font-weight: 300;
}
@media screen and (max-width: 767px) {
#pageMain .product__sample h3 {
font-size: calc(20 / 17 * 1rem);
}
}
#pageMain .product__sample .slides a {
display: block;
width: 100%;
height: 100%;
text-decoration: none;   	
aspect-ratio: 3/4;
}
#pageMain .product__sample .slides img {
display: block;
font-family: "object-fit: cover;";
width: 100% !important;
height: 100% !important;
aspect-ratio: 3/4;
object-fit: cover; } #pageMain .product__images .slides li {
aspect-ratio: 3/4;
}
#pageMain .product__images .slides li img {
object-fit: cover;
font-family: "object-fit: cover;";
width: 100% !important;
height: 100% !important;
}
#pageMain .product__thumbnail {
margin-bottom: 16px;
display: block;
height: 100%;
position: relative;
transition: opacity 0.3s ease-in-out;
overflow: hidden;
}
#pageMain .product__thumbnail:after {
opacity: 0;
content: "View Product";
background: rgba(0, 0, 0, 0.7);
color: var(--color_white);
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-size: calc(20 / 17 * 1rem);
font-weight: 300;
}
#pageMain .product__thumbnail:hover:after {
opacity: 1;
}
#pageMain .product__thumbnail:hover img {
transform: scale(1.1);
}
#pageMain .product__block .product__title {
font-size: calc(19 / 17 * 1rem);
font-weight: 400;
}
@media screen and (max-width: 767px) {
#pageMain .product__block .product__title {
font-size: calc(16 / 17 * 1rem);
}
}
#pageMain .product__block .product__price__price {
color: #0CA2FF;
font-size: calc(24 / 17 * 1rem);
}
@media screen and (max-width: 767px) {
#pageMain .product__block .product__price__price {
font-size: calc(20 / 17 * 1rem);
}
}
#pageMain .product__block--sold_out .product__price__price {
text-decoration-line: line-through;
}
#pageContents {
padding-bottom: 300px;
}
@media screen and (max-width: 767px) {
#pageContents {
padding-bottom: 30vw;
}
}
#pageTitle {
padding-top: 30px;
}
#pageTitle h1 {
font-size: calc(110 / 17 * 1rem);
font-weight: 100;
}
@media screen and (max-width: 767px) {
#pageTitle h1 {
font-size: calc(50 / 17 * 1rem);
}
} #newsletter {
width: 100%;
margin: 0;
padding: 0;
}
#newsletter a {
position: relative;
display: block;
background: #0070E0;
padding-top: 40px;
padding-bottom: 40px;
}
#newsletter a:hover {
background-color: #045BB2;
}
#newsletter a .container {
width: 100%;
display: flex;
color: var(--color_white);
column-gap: 20px;
}
#newsletter a .container:after {
content: "";
display: block;
position: absolute;
right: 40px;
top: 50%;
width: 60px;
height: 60px;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.3); background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M6.68742 18.3334L5.20825 16.8542L12.0624 10L5.20825 3.14585L6.68742 1.66669L15.0208 10L6.68742 18.3334Z" fill="white"/></svg>');
background-repeat: no-repeat;
background-position: center;
background-size: 20px; transform: translateY(-50%) translateZ(0); 
transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);  backface-visibility: hidden;
perspective: 1000px ;
z-index: 10;
}
#newsletter a:hover .container:after {
transform: translateY(-50%) translateX(-10px) translateZ(0);
}
#newsletter .section__sp {
display: none;
}
@media screen and (max-width: 767px) {
#newsletter {
overflow: visible;
}	
#newsletter .container {
flex-direction: column;
}
#newsletter a .container:after {
display: none;
}
#newsletter .section__sp {
display: inline-block;
margin-top: 5px;
font-size: calc(17 / 17 * 1rem);
letter-spacing: 0.07em;
}
}
#newsletter .section__title { flex-shrink: 0;
flex-direction: row;
flex-wrap: wrap;
display: flex;
align-items: center;
column-gap: 30px;
margin-bottom: 0;
transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
will-change: transform;
transform: translateX(0) translateZ(0); 
text-align: left;
}
#newsletter a:hover .section__title,
.section__title a:hover .section__title_text {
transform: translateX(10px) translateZ(0);
}
#newsletter .section__title h2 {
font-size: calc(39 / 17 * 1rem);
font-weight: 200;
line-height: 1;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="31" height="31" viewBox="0 0 31 31" fill="none"><g opacity="0.3"><path d="M2.51368 12.0324C1.83874 11.8075 1.8334 11.4445 2.52757 11.2131L27.1805 2.99541C27.8632 2.76787 28.2547 3.14995 28.0634 3.8194L21.0197 28.4725C20.8246 29.155 20.4312 29.1788 20.1428 28.5298L15.4999 18.0834L23.2499 7.75008L12.9166 15.5L2.51368 12.0324Z" fill="white"/></g></svg>') no-repeat left center;
background-size: 31px auto;
padding-left: 50px;
flex-shrink: 0;
margin: 0;
}
#newsletter .section__title p {
width: clamp(300px, 55vw, 900px);
font-size: calc(14 / 17 * 1rem);
margin: 5px 0 0;
}
#newsletter .section__title a {
color: var(--color_white);
}
@media screen and (max-width: 767px) {
#newsletter .section__title {
flex-direction: column;
width: 100%;
}
#newsletter .section__title h2 {
margin-left: 0;
font-size: calc(24 / 17 * 1rem);
margin-bottom: 20px;    
width: auto;
margin-left: 0;
margin-right: auto;
text-align: left;
}
#newsletter .section__title p {
width: 100%;  
font-size: calc(15 / 17 * 1rem);
}
}
#newsletter .section__contents {
flex-grow: 1;
}
@media screen and (max-width: 767px) {
#newsletter .section__contents {
width: 100%;
}
}
body.page .page__title {
text-align: center;
}
body.page .page__title h1 {
font-size: calc(20 / 17 * 1rem);
font-weight: 700;
} @media screen and (max-width: 767px) {
body.single #ez-toc-container, body.page #ez-toc-container {
width: 100%;
}
}
body.single #ez-toc-container .ez-toc-list li, body.page #ez-toc-container .ez-toc-list li {
padding-top: 0.5em;
}
body[class*=page_home] #wrapper {
overflow: unset;
}
body[class*=page_home] #pageHeader {
color: var(--color_white);
}
body[class*=page_home] #pageHeader a {
color: var(--color_white);
}
body[class*=page_home] #pageHeader .header__menu__open:before, body[class*=page_home] #pageHeader .header__menu__open:after {
background-color: var(--color_white);
}
body[class*=page_home] #pageMain {
margin-top: 0;
}
body[class*=page_home] .section {
overflow: hidden;
padding-top: 180px;
padding-bottom: 180px;
top: 0;
}
@media screen and (max-width: 767px) {
body[class*=page_home] .section {
padding-top: 100px;
padding-bottom: 100px;
}
}
body[class*=page_home] #mv {
position: sticky;
width: 100%;
height: 100vh;
padding: 0;
}
body[class*=page_home] #mv:after {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(32, 31, 28, 0.45);
z-index: 1;
}
body[class*=page_home] #mv .mv__bg {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
object-fit: contain;
height: 100%;
width: auto;
max-width: 1000vw;
z-index: 0;
display: block;
pointer-events: none; }
@media (min-aspect-ratio: 16/9) {
body[class*=page_home] #mv .mv__bg {
height: auto;
width: 100%;   
}
} @media (max-width: 767px) {
.pc-only { display: none !important; }
.sp-only { display: block !important; }
}
@media (min-width: 768px) {
.pc-only { display: block !important; }
.sp-only { display: none !important; }
} video::-webkit-media-controls-start-playback-button {
display: none !important;
-webkit-appearance: none;
}
body[class*=page_home] #mv .container {
height: 100%;
width: 1560px;
position: relative;
z-index: 2;
}
body[class*=page_home] #mv .container .section__contents {
height: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #mv .container .section__contents {
align-items: center;
padding-bottom: 13.6363636364vw;
}
}
body[class*=page_home] #mv h1 {
color: var(--color_white);
font-size: calc(90 / 17 * 1rem);
font-weight: 200;
line-height: 1.1;
margin: 0;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #mv h1 {
font-size: calc(50 / 440 * 100vw);
}
}
body[class*=page_home] #philosophy {
background: url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/home/philosophy_bg_01.webp) no-repeat center center;
background-attachment: fixed;
position: relative;
transition: all 0.4s ease;
background-size: cover;
color: var(--color_white);
text-align: center;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #philosophy {
background-image: url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/home/philosophy_bg_sp.webp);
background-position: center bottom;
padding-bottom: 40vw;
}
}
body[class*=page_home] #philosophy:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(122, 119, 84, 0.7);
}
body[class*=page_home] #philosophy:after {
content: "";
display: block;
position: absolute;
left: 38%;
top: 0;
width: 480px;
height: 1px;
background: var(--color_white);
transform: rotate(135deg);
}
@media screen and (max-width: 767px) {
body[class*=page_home] #philosophy:after {
width: 250px;
}
}
body[class*=page_home] #philosophy h2 {
font-size: calc(110 / 17 * 1rem);
font-weight: 200;
line-height: 1;
position: relative;
z-index: 1;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #philosophy h2 {
font-size: calc(50 / 17 * 1rem);
}
}
body[class*=page_home] #philosophy p + p {
margin-top: 2em;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #philosophy .section__title {
margin-bottom: 80px;
}
}
@media screen and (max-width: 767px) {
body[class*=page_home] #philosophy .section__contents {
font-size: calc(17 / 440 * 100vw);
}
}
body[class*=page_home] #philosophy .philosophy__block + .philosophy__block {
padding-top: 90px;
} body[class*=page_home] #philosophy .philosophy__block + .philosophy__block:nth-child(2) { transition-delay: 14.0s; }
body[class*=page_home] #philosophy .philosophy__block + .philosophy__block:nth-child(3) { transition-delay: 16.0s; }
body[class*=page_home] #philosophy .philosophy__block p {
position: relative;
z-index: 1;
opacity: 0; transform: translate(0, 10%);
transition: 2s;
}
body[class*=page_home] #philosophy .philosophy__block p.is-show {
opacity: 1;
}  body[class*=page_home] #philosophy .philosophy__block .philosophy__image {
opacity: 0;
transition: 2s;
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
display: block;
}
body[class*=page_home] #philosophy .philosophy__block .philosophy__image:after {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(122, 119, 84, 0.7);
}
body[class*=page_home] #philosophy .philosophy__block .philosophy__text {
margin-top: 60px;
}
body[class*=page_home] #philosophy .philosophy__block.is-show p {
transform: translate(0, 0);
opacity: 1;
}
body[class*=page_home] #philosophy .philosophy__block.is-show .philosophy__image {
opacity: 1;
z-index: 0;
}
body[class*=page_home] #profile {
background: #7B898B;
color: var(--color_white);
}
body[class*=page_home] #profile .container {
width: 1560px;
}
body[class*=page_home] #profile .section__contents {
display: flex;
justify-content: space-between;
column-gap: 100px;
align-items: flex-start;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #profile .section__contents {
flex-direction: column;
}
}
body[class*=page_home] #profile .section__contents p + p {
margin-top: 1em;
}
body[class*=page_home] #profile .profile__images {
flex-grow: 1;
}
body[class*=page_home] #profile .profile__images .profile__image {
opacity: 0;
transform: translateX(-50px);
transition: all 0.6s ease;
}
body[class*=page_home] #profile .profile__images .profile__image.is-show {
opacity: 1;
transform: translateX(0);
}
body[class*=page_home] #profile .profile__images .profile__image:nth-of-type(1).is-show {
transition-delay: 0s;
}
body[class*=page_home] #profile .profile__images .profile__image:nth-of-type(2).is-show {
transition-delay: 0.8s;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #profile .profile__images {
width: 100%;
}
}
body[class*=page_home] #profile .profile__image {
position: relative;
}
body[class*=page_home] #profile .profile__image:nth-of-type(1) { z-index: 1;
}
body[class*=page_home] #profile .profile__image:nth-of-type(1) img { margin-right: 0;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #profile .profile__image:nth-of-type(1) {
width: 59.0909090909vw;
margin: 0 auto;
}
}
body[class*=page_home] #profile .profile__image:nth-of-type(2) {
margin-top: -80px;
z-index: 0;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #profile .profile__image:nth-of-type(2) {
display: none;
}
}
body[class*=page_home] #profile .profile__contents {
width: 32.0512820513%;
flex-shrink: 0;
padding-top: 100px;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #profile .profile__contents {
width: auto; 
}
body[class*=page_home] #profile .profile__contents p {
font-size: calc(15 / 17 * 1rem); 
}
}
body[class*=page_home] #profile h2 {
font-size: calc(90 / 17 * 1rem);
font-weight: 200;
line-height: 1;
margin-bottom: 30px;
position: relative;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #profile h2 {
font-size: calc(50 / 17 * 1rem);
}
}
body[class*=page_home] #profile h2:before {
content: "";
display: block;
position: absolute;
width: 450px;
height: 1px;
transform: rotate(-45deg);
background: var(--color_secondary);
left: -64px;
top: -170px;
background: var(--color_white);
}
@media screen and (max-width: 767px) {
body[class*=page_home] #profile h2:before {
width: 80px;
left: 20px;
top: -50px;
}
}
body[class*=page_home] #profile .profile__name {
font-size: calc(26 / 17 * 1rem);
margin-bottom: 40px;
}
body[class*=page_home] #profile .profile__name__sub {
display: block;
font-size: calc(17 / 17 * 1rem);
}
body[class*=page_home] #products {
background: #DEDBD2;
}
body[class*=page_home] #products .container {
position: relative;
}
body[class*=page_home] #products .container:after {
content: "";
display: block;
position: absolute;
right: -190px;
top: -120px;
width: 280px;
height: 1px;
background: #5A5A5A;
transform: rotate(135deg);
}
body[class*=page_home] #products .section__title {
text-align: right;
}
body[class*=page_home] #products .section__title h2 {
font-size: calc(90 / 17 * 1rem);
font-weight: 200;
line-height: 1;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #products .section__title h2 {
font-size: calc(50 / 17 * 1rem);
}
}
body[class*=page_home] #products .product_slider {
position: absolute;
width: 100vw;
top: 0;
left: 50%;
transform: translateX(-50%);
}
body[class*=page_home] #products .product_slider__wrapper {
height: 413px;
position: relative;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #products .product_slider__wrapper {
height: 266.6666666667px;
}
}
body[class*=page_home] #products .product__links {
margin-top: 40px;
text-align: right;
font-size: calc(26 / 17 * 1rem);
font-weight: 200;
}
body[class*=page_home] #news {
background: url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/home/news_bg.webp) no-repeat center center;
background-size: cover;
color: var(--color_white);
position: relative;
}
body[class*=page_home] #news:before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
}
body[class*=page_home] #news:after {
content: "";
display: block;
position: absolute;
left: -20vw;
top: 0;
width: 100vw;
height: 1px;
background: var(--color_white);
transform: rotate(135deg);
}
body[class*=page_home] #news .container {
display: flex;
align-items: flex-start;
justify-content: flex-start;
width: 1280px;
column-gap: 100px;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #news .container {
flex-direction: column;
}
}
body[class*=page_home] #news .section__title {
text-align: left;
position: relative;
z-index: 1;
}
body[class*=page_home] #news .section__title img {
position: absolute;
right: 0;
width: 360px;
max-width: 100vw;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #news .section__title img {
display: none;
}
}
body[class*=page_home] #news .section__contents {
flex-grow: 1;
}
body[class*=page_home] #news h2 {
font-size: calc(90 / 17 * 1rem);
font-weight: 200;
line-height: 1;
text-align: right;
margin-bottom: 80px;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #news h2 {
font-size: calc(50 / 17 * 1rem);
}
}
body[class*=page_home] #news .news__list {
border-top: 1px solid #8297AA;
margin-bottom: 20px;
}
body[class*=page_home] #news .news__block {
border-bottom: 1px solid #8297AA;
}
body[class*=page_home] #news .news__block > a {
display: block;
position: relative;
font-size: calc(15 / 17 * 1rem);
font-weight: 400;
letter-spacing: 0.01em;
color: var(--color_white);
padding: 20px 30px 20px 0;
}
body[class*=page_home] #news .news__block > a:after {
content: "";
display: block;
position: absolute;
right: 0;
top: 50%;
width: 20px;
height: 20px;
transform: translateY(-50%);
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M6.68742 18.3334L5.20825 16.8542L12.0624 10L5.20825 3.14585L6.68742 1.66669L15.0208 10L6.68742 18.3334Z" fill="white"/></svg>') no-repeat center center;
transition: all 0.4s ease;
}
body[class*=page_home] #news .news__block > a:hover:after {
right: 10px;
}
body[class*=page_home] #news .news__date {
font-size: calc(15 / 17 * 1rem);
font-weight: 400;
letter-spacing: 0.01em;
}
body[class*=page_home] #news .news__mention {
color: var(--color_white);
}
body[class*=page_home] #news .news__mention a {
color: var(--color_white);
}
body[class*=page_home] #news .news__article {
color: var(--color_font);
}
body[class*=page_home] #news .news__article__title {
font-size: calc(20 / 17 * 1rem);
text-align: left;
}
body[class*=page_home] #news .news__article__date {
font-size: calc(15 / 17 * 1rem);
color: #7B898B;
font-weight: 200;
letter-spacing: 0.01em;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #news .news__article__date {
font-size: calc(12 / 17 * 1rem);
}
}
body[class*=page_home] #news .news__article__contents {
margin-top: 24px;
font-size: calc(17 / 17 * 1rem);
line-height: 1.8;
}
body[class*=page_home] #news .news__article__contents a {
color: var(--color_link);
text-decoration: underline;
}
@media screen and (max-width: 767px) {
body[class*=page_home] #news .news__article__contents {
font-size: calc(15 / 17 * 1rem);
}
}
body.page_home_en #profile {
padding-bottom: 300px;
}
@media screen and (max-width: 767px) {
body.page_home_en #profile {
padding-bottom: 30vw;
}
}
body[class*=page_products] #pageTitle {
padding-bottom: 35px;
}
body[class*=page_products] #lead {
padding-top: 0;
}
@media screen and (min-width: 768px) {
body[class*=page_products] #lead {
width: 50%;
padding-bottom: 20px;
}
}
body[class*=page_products] #custom, body[class*=page_products] #cs_series, body[class*=page_products] #small_items {
display: flex;
align-items: flex-end;
}
@media screen and (min-width: 768px) {
body[class*=page_products] #custom, body[class*=page_products] #cs_series, body[class*=page_products] #small_items {
padding-top: 100px;
padding-bottom: 100px;
}
}
@media screen and (max-width: 767px) {
body[class*=page_products] #custom, body[class*=page_products] #cs_series, body[class*=page_products] #small_items {
flex-direction: column;
}
}
body[class*=page_products] #custom .section__title, body[class*=page_products] #cs_series .section__title, body[class*=page_products] #small_items .section__title {
padding: 0 6.3333333333%;
width: 33.3333333333%;
flex-shrink: 0;
}
@media screen and (min-width: 768px) {
body[class*=page_products] #custom .section__title, body[class*=page_products] #cs_series .section__title, body[class*=page_products] #small_items .section__title {
margin-bottom: 0;
}
}
body[class*=page_products] #custom .section__title h2, body[class*=page_products] #cs_series .section__title h2, body[class*=page_products] #small_items .section__title h2 {
font-size: calc(65 / 17 * 1rem);
font-weight: 200;
line-height: 1;
margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
body[class*=page_products] #custom .section__title, body[class*=page_products] #cs_series .section__title, body[class*=page_products] #small_items .section__title {
width: 100%;
padding-left: 0;
padding-right: 0;
}
body[class*=page_products] #custom .section__title h2, body[class*=page_products] #cs_series .section__title h2, body[class*=page_products] #small_items .section__title h2 {
font-size: calc(42 / 17 * 1rem);
}
}
body[class*=page_products] #custom .section__contents, body[class*=page_products] #cs_series .section__contents, body[class*=page_products] #small_items .section__contents {
width: calc(66.6666% + (100vw - 1200px) / 2);
}
@media screen and (max-width: 1200px) {
body[class*=page_products] #custom .section__contents, body[class*=page_products] #cs_series .section__contents, body[class*=page_products] #small_items .section__contents {
width: calc(66.6666% + 40px);
}
}
@media screen and (max-width: 767px) {
body[class*=page_products] #custom .section__contents, body[class*=page_products] #cs_series .section__contents, body[class*=page_products] #small_items .section__contents {
width: calc(100% + 12.7272727273vw);
margin-left: -6.3636363636vw;
margin-right: auto;
}
}
body[class*=page_products] #custom .product_slider__wrapper, body[class*=page_products] #cs_series .product_slider__wrapper, body[class*=page_products] #small_items .product_slider__wrapper {
width: calc(800px + (100vw - 1200px) / 2);
}
@media screen and (max-width: 1200px) {
body[class*=page_products] #custom .product_slider__wrapper, body[class*=page_products] #cs_series .product_slider__wrapper, body[class*=page_products] #small_items .product_slider__wrapper {
width: calc(100% + 40px);
}
}
@media screen and (max-width: 767px) {
body[class*=page_products] #custom .product_slider__wrapper, body[class*=page_products] #cs_series .product_slider__wrapper, body[class*=page_products] #small_items .product_slider__wrapper {
width: 100%;
}
}
body[class*=page_products] #custom .custom__links, body[class*=page_products] #cs_series .custom__links, body[class*=page_products] #small_items .custom__links {
margin-top: 40px;
}
body[class*=page_products] #custom .custom__links a, body[class*=page_products] #cs_series .custom__links a, body[class*=page_products] #small_items .custom__links a {
font-size: calc(26 / 17 * 1rem);
font-weight: 200;
}
@media screen and (max-width: 767px) {
body[class*=page_products] #custom .custom__links a, body[class*=page_products] #cs_series .custom__links a, body[class*=page_products] #small_items .custom__links a {
font-size: calc(18 / 17 * 1rem);
}
}
body[class*=page_products] #cs_series {
flex-direction: row-reverse;
}
body[class*=page_products] #cs_series .section__title {
position: relative;
}
body[class*=page_products] #cs_series .section__title:before {
content: "";
display: block;
position: absolute;
width: 288px;
height: 1px;
transform: rotate(-45deg);
background: var(--color_secondary);
top: -129.6px;
left: 34.4827586207%;
}
@media screen and (max-width: 767px) {
body[class*=page_products] #cs_series .section__title:before {
width: 100px;
left: auto;
top: -30px;
right: -30px;
}
}
@media screen and (max-width: 1200px) {
body[class*=page_products] #cs_series .product_slider__wrapper {
margin-left: -40px;
}
}
@media screen and (max-width: 767px) {
body[class*=page_products] #cs_series .product_slider__wrapper {
margin-left: auto;
}
}
@media screen and (max-width: 767px) {
body[class*=page_products] #cs_series {
flex-direction: column;
}
}
body[class*=page_products] #small_items .section__title {
position: relative;
}
body[class*=page_products] #small_items .section__title:before {
content: "";
display: block;
position: absolute;
width: 288px;
height: 1px;
transform: rotate(-45deg);
background: var(--color_secondary);
bottom: -129.6px;
left: -17.2413793103%;
}
@media screen and (max-width: 767px) {
body[class*=page_products] #small_items .section__title:before {
display: none;
}
}
body[class*=page_atelier] #pageTitle {
padding-bottom: 0;
}
body[class*=page_atelier] #pageContents {
padding-bottom: 0;
}
body[class*=page_atelier] #concept {
padding-top: 0;
}
body[class*=page_atelier] #concept:before {
content: "";
display: block;
position: absolute;
width: 218px;
height: 1px;
transform: rotate(-45deg);
background: var(--color_secondary);
top: -70px;
left: 30%;
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #concept {
padding-top: 20px;
}
body[class*=page_atelier] #concept:before {
width: 100px;
left: auto;
right: -30px;
}
}
body[class*=page_atelier] #concept .concept__block {
display: flex;
column-gap: 100px;
justify-content: space-between;
align-items: center;
position: relative;
z-index: 1;
}
body[class*=page_atelier] #concept .concept__contents {
width: 48.3333333333%;
flex-shrink: 0;
}
body[class*=page_atelier] #concept .concept__image img {
width: 720px;
max-width: 100vw;
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #concept .concept__block {
flex-direction: column;
}
body[class*=page_atelier] #concept .concept__contents {
width: auto;
margin-bottom: 60px;
}
body[class*=page_atelier] #concept .concept__image {
width: 100%;
}
body[class*=page_atelier] #concept .concept__image img {
width: 60vw;
margin-right: -6.3636363636vw;
}
}
body[class*=page_atelier] #concept .concept__bottom {
margin-top: -80px;
position: relative;
}
body[class*=page_atelier] #concept .concept__bottom img {
width: 1185px;
max-width: 100vw;
left: 50%;
transform: translateX(-18.3333333333%);
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #concept .concept__bottom {
margin-top: -9.0909090909vw;
}
}
body[class*=page_atelier] #info {
padding-bottom: 200px; }
@media screen and (max-width: 767px) {
body[class*=page_atelier] #info {
padding-bottom: 100px;
}
}
body[class*=page_atelier] #info .info__wrapper {
display: flex;
flex-direction: row-reverse; align-items: center;
}
body[class*=page_atelier] #info .info__wrapper > div {
flex: 1;
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #info .info__wrapper {
flex-direction: column;
}
}
body[class*=page_atelier] #info .info__info__title {
position: relative;
}
body[class*=page_atelier] #info .info__info__title:before {
content: "";
display: block;
position: absolute;
left: -20px;
bottom: 50px;
width: 916px;
height: 743px;
background: url(https://blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/atelier/info_bg.svg) no-repeat center center;
background-size: contain; }
body[class*=page_atelier] #info .info__info__title h2 {
font-size: calc(110 / 17 * 1rem);
font-weight: 200;
position: relative;
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #info .info__info__title {
margin-bottom: 20px;
}
body[class*=page_atelier] #info .info__info__title:before {
width: 80vw;
height: 64.8908296943vw;
left: 30vw;
top: -40vw;
}
body[class*=page_atelier] #info .info__info__title h2 {
font-size: calc(42 / 17 * 1rem);
}
}
body[class*=page_atelier] #info .info__info__contents {
border-top: 1px solid #D9D9D9;
border-bottom: 1px solid #D9D9D9;
padding: 30px 0;
}
body[class*=page_atelier] #info .info__info__contents a {
color: #0CA2FF;
text-decoration: underline;
}
body[class*=page_atelier] #info .info__info__contents dl {
display: flex;
justify-content: flex-start;
align-items: flex-start;
}
body[class*=page_atelier] #info .info__info__contents dl dt {
width: 110px;
flex-shrink: 0;
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #info .info__info__contents dl dt {
width: 90px;
}
}
body[class*=page_atelier] #info .info__info__contents dl dd {
flex-grow: 1;
}
body[class*=page_atelier] #info .info__info__contents dl + dl {
margin-top: 1em;
}
body[class*=page_atelier] #info .info__schedule {
padding-right: 10%;
}
body[class*=page_atelier] #info .info__schedule__title {
text-align: center;
font-size: calc(22 / 17 * 1rem);
margin-bottom: 10px;
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #info .info__schedule__title {
text-align: left;
font-size: calc(18 / 17 * 1rem);
}
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #info .info__schedule {
padding-right: 0;
margin-top: 40px;
}
}
body[class*=page_atelier] #map {
padding: 0;
height: 31.8287037037vw;
}
body[class*=page_atelier] #map .section__contents {
position: absolute;
width: 100vw;
height: 100%;
left: 50%;
transform: translateX(-50%);
top: 0;
}
body[class*=page_atelier] #map iframe {
width: 100%;
height: 100%;
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}
@media screen and (max-width: 767px) {
body[class*=page_atelier] #map {
height: 66.6666666667vw;
}
}
@media screen and (min-width: 768px) {
body.single-custom-order #pageTitle, body.single-cs-series #pageTitle {
padding-bottom: 50px;
}
}
body.single-custom-order #pageContents .modal-container, body.single-cs-series #pageContents .modal-container {
width: 580px;
height: 460px;
padding: 50px 60px;
}
@media screen and (max-width: 767px) {
body.single-custom-order #pageContents .modal-container, body.single-cs-series #pageContents .modal-container {
padding: 9.0909090909vw 4.5454545455vw 4.5454545455vw;
}
}
@media screen and (max-width: 767px) {
body.single-custom-order .product__contents, body.single-cs-series .product__contents {
margin-top: 30px;
}
}
body.single-custom-order .product__contents h2, body.single-cs-series .product__contents h2 {
line-height: 1;
}
body.single-custom-order .product__contents h3, body.single-cs-series .product__contents h3 {
margin-bottom: 10px;
}
body.single-custom-order .product__contents p + p, body.single-cs-series .product__contents p + p {
margin-top: 1em;
}
body.single-custom-order .product__price, body.single-cs-series .product__price {
display: flex;
flex-wrap: wrap;
column-gap: 20px;
justify-content: flex-start;
align-items: center;
border-bottom: none !important;
}
body.single-custom-order .product__price__title, body.single-cs-series .product__price__title {
color: var(--color_secondary);
font-size: calc(27 / 17 * 1rem);
font-weight: 400;
}
body.single-custom-order .product__price__price, body.single-cs-series .product__price__price {
color: #0CA2FF;
font-size: calc(41 / 17 * 1rem);
}
body.single-custom-order .product__price__mention, body.single-cs-series .product__price__mention {
width: 100%;
color: #5A5A5A;
font-size: calc(14 / 17 * 1rem);
margin-top: 10px;
}
@media screen and (max-width: 767px) {
body.single-custom-order .product__price__title, body.single-cs-series .product__price__title {
font-size: calc(20 / 17 * 1rem);
}
body.single-custom-order .product__price__price, body.single-cs-series .product__price__price {
font-size: calc(25 / 17 * 1rem);
}
body.single-custom-order .product__price__mention, body.single-cs-series .product__price__mention {
font-size: calc(12 / 17 * 1rem);
}
}
body.single-custom-order .product__option, body.single-cs-series .product__option {
padding-top: 130px;
position: relative;
}
body.single-custom-order .product__option:before, body.single-cs-series .product__option:before {
content: "";
display: block;
position: absolute;
width: 218px;
height: 1px;
transform: rotate(-45deg);
background: var(--color_secondary);
top: 26px;
left: 38%;
}
body.single-custom-order .product__option__contents, body.single-cs-series .product__option__contents {
padding-bottom: 80px;
}
body.single-custom-order .product__option__contents__wrapper, body.single-cs-series .product__option__contents__wrapper {
position: relative;
max-height: 400px;
overflow: hidden;
transition: max-height 0.3s linear;
}
body.single-custom-order .product__option__contents__wrapper.is-open, body.single-cs-series .product__option__contents__wrapper.is-open {
max-height: 100vh;
}
body.single-custom-order .product__option__contents__wrapper.is-open .product__option__button:after, body.single-cs-series .product__option__contents__wrapper.is-open .product__option__button:after {
content: "Close";
background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12" fill="none"><path d="M-2.98023e-07 10L1.775 11.775L10 3.55002L18.225 11.775L20 10L10 2.42386e-05L-2.98023e-07 10Z" fill="%230070E0"/></svg>');
}
body.single-custom-order .product__option__button, body.single-cs-series .product__option__button {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 170px;
cursor: pointer;
background: linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #F5F5F5 75%);
z-index: 1;
}
body.single-custom-order .product__option__button:after, body.single-cs-series .product__option__button:after {
content: "Read more";
display: block;
position: absolute;
text-align: center;
left: 0;
width: 100%;
bottom: 0;
padding-bottom: 20px;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12" fill="none"><path d="M0 1.775L1.775 0L10 8.225L18.225 0L20 1.775L10 11.775L0 1.775Z" fill="%230070E0"/></svg>') no-repeat center bottom;
font-weight: 300;
color: #0070E0;
}
@media screen and (max-width: 767px) {
body.single-custom-order .product__option, body.single-cs-series .product__option {
padding-top: 80px;
}
body.single-custom-order .product__option:before, body.single-cs-series .product__option:before {
width: 100px;
left: auto;
right: -30px;
top: 64px;
}
}
body.single-custom-order .product__option h3, body.single-cs-series .product__option h3 {
padding-bottom: 26px;
border-bottom: 1px solid #C3C3C3;
}
body.single-custom-order .product__sample, body.single-cs-series .product__sample {
padding-top: 130px;
position: relative;
}
@media screen and (max-width: 767px) {
body.single-custom-order .product__sample, body.single-cs-series .product__sample {
padding-top: 80px;
}
}
@media screen and (min-width: 768px) {
body.single-custom-order .product__sample h3, body.single-cs-series .product__sample h3 {
position: relative;
width: 100vw;
left: 50%;
transform: translateX(-50%);
padding-bottom: 26px;
padding-left: 40px;
}
}
body.single-custom-order .product__sample .flexslider, body.single-cs-series .product__sample .flexslider {
position: relative;
width: 100vw;
left: 50%;
transform: translateX(-50%);
}
body.single-custom-order .product__sample .slides a, body.single-cs-series .product__sample .slides a {
display: block;
height: 100%;
position: relative;
transition: opacity 0.3s ease-in-out;
overflow: hidden;
}
body.single-custom-order .product__sample .slides a:before, body.single-cs-series .product__sample .slides a:before {
content: "";
display: block;
position: absolute;
right: 20px;
bottom: 20px;
width: 30px;
height: 30px;
background: url(https://blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/ico_zoom.svg) no-repeat center center;
background-size: contain;
}
body.single-custom-order .product__sample .slides a:after, body.single-cs-series .product__sample .slides a:after {
opacity: 0;
white-space: pre;
content: "View \a customization \a details";
text-align: center;
background: rgba(0, 0, 0, 0.7);
color: var(--color_white);
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-size: calc(20 / 17 * 1rem);
font-weight: 300;
}
body.single-custom-order .product__sample .slides a:hover:before, body.single-cs-series .product__sample .slides a:hover:before {
opacity: 0;
}
body.single-custom-order .product__sample .slides a:hover:after, body.single-cs-series .product__sample .slides a:hover:after {
opacity: 1;
}
body.single-custom-order .product__sample .slides a:hover img, body.single-cs-series .product__sample .slides a:hover img {
transform: scale(1.1);
}
body.single-custom-order .product__sample__dlg__title, body.single-cs-series .product__sample__dlg__title {
font-size: calc(20 / 17 * 1rem);
margin-bottom: 16px;
}
body.single-custom-order .product__sample__dlg__contents, body.single-cs-series .product__sample__dlg__contents {
border-top: 1px solid #D9D9D9;
border-bottom: 1px solid #D9D9D9;
padding: 30px 0;
}
body.single-custom-order .product__sample__dlg__contents a, body.single-cs-series .product__sample__dlg__contents a {
color: #0CA2FF;
text-decoration: underline;
}
body.single-custom-order .product__sample__dlg__contents dl, body.single-cs-series .product__sample__dlg__contents dl {
display: flex;
justify-content: flex-start;
align-items: flex-start;
column-gap: 30px;
font-size: calc(14 / 17 * 1rem);
}
body.single-custom-order .product__sample__dlg__contents dl dt, body.single-cs-series .product__sample__dlg__contents dl dt {
width: 100px;
flex-shrink: 0;
}
@media screen and (max-width: 767px) {
body.single-custom-order .product__sample__dlg__contents dl dt, body.single-cs-series .product__sample__dlg__contents dl dt {
width: 90px;
}
}
body.single-custom-order .product__sample__dlg__contents dl dd, body.single-cs-series .product__sample__dlg__contents dl dd {
flex-grow: 1;
}
body.single-custom-order .product__sample__dlg__contents dl + dl, body.single-cs-series .product__sample__dlg__contents dl + dl {
margin-top: 1em;
}
body.single-custom-order .product__buttons--bottom, body.single-cs-series .product__buttons--bottom {
margin-top: 90px;
}
@media screen and (max-width: 767px) {
body.single-custom-order .product__buttons--bottom, body.single-cs-series .product__buttons--bottom {
margin-top: 40px;
}
}
body.single-custom-order .notice, body.single-cs-series .notice {
color: #999;
font-size: 80%;
}
body.page_custom-order #pageTitle h1, body.page_cs-series #pageTitle h1 {
position: relative;
}
body.page_custom-order #pageTitle h1:before, body.page_cs-series #pageTitle h1:before {
content: "";
display: block;
position: absolute;
width: 288px;
height: 1px;
transform: rotate(-45deg);
background: var(--color_secondary);
right: -42px;
top: 102px;
}
@media screen and (max-width: 767px) {
body.page_custom-order #pageTitle h1, body.page_cs-series #pageTitle h1 {
margin-top: 10vw;
}
body.page_custom-order #pageTitle h1:before, body.page_cs-series #pageTitle h1:before {
width: 20vw;
right: -8vw;
top: -5vw;
}
}
body.page_custom-order #pageContents > .container, body.page_cs-series #pageContents > .container {
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: row-reverse;
column-gap: 72px;
}
@media screen and (max-width: 767px) {
body.page_custom-order #pageContents > .container, body.page_cs-series #pageContents > .container {
flex-direction: column;
}
}
body.page_custom-order #pageContents .page__contents__side, body.page_cs-series #pageContents .page__contents__side {
width: 210px;
border-top: 1px solid var(--color_border);
flex-shrink: 0;
}
@media screen and (max-width: 767px) {
body.page_custom-order #pageContents .page__contents__side, body.page_cs-series #pageContents .page__contents__side {
display: none;
}
}
body.page_custom-order #pageContents .page__contents__main, body.page_cs-series #pageContents .page__contents__main {
flex-grow: 1;
}
@media screen and (min-width: 768px) {
body.page_custom-order #pageContents .side__product__list, body.page_cs-series #pageContents .side__product__list {
padding-top: 30px;
background: var(--color_background);
position: relative;
z-index: 100;
border-top: 1px solid #D9D9D9;
}
body.page_custom-order #pageContents .side__product__list.is-fixed, body.page_cs-series #pageContents .side__product__list.is-fixed {
position: fixed;
top: 0;
left: 0;
width: 210px;
}
}
body.page_custom-order #pageContents .side__product__item, body.page_cs-series #pageContents .side__product__item {
margin-bottom: 8px;
}
body.page_custom-order #pageContents .side__product__item a, body.page_cs-series #pageContents .side__product__item a {
position: relative;
padding-left: 24px;
font-size: calc(18 / 17 * 1rem);
transition: all 0.4s ease;
}
body.page_custom-order #pageContents .side__product__item a:before, body.page_cs-series #pageContents .side__product__item a:before {
content: "";
position: absolute;
display: inline-block;
vertical-align: middle;
width: 10px;
height: 10px;
left: 0;
top: 50%;
transform: translateY(-50%);
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 10 10" fill="none"><path d="M3.34383 9.16665L2.60425 8.42706L6.03133 4.99998L2.60425 1.5729L3.34383 0.833313L7.5105 4.99998L3.34383 9.16665Z" fill="%23C3C3C3"/></svg>') no-repeat center center;
background-size: contain;
transition: all 0.4s ease;
}
body.page_custom-order #pageContents .side__product__item a:hover, body.page_cs-series #pageContents .side__product__item a:hover {
opacity: 0.7;
}
body.page_custom-order #pageContents .side__product__item a:hover:before, body.page_cs-series #pageContents .side__product__item a:hover:before {
left: 6px;
}
@media screen and (min-width: 768px) {
body.page_custom-order #pageContents .products_category__block--available .product__list, body.page_cs-series #pageContents .products_category__block--available .product__list {
column-gap: 90px;
}
body.page_custom-order #pageContents .products_category__block--available .product__list > div, body.page_cs-series #pageContents .products_category__block--available .product__list > div {
width: calc((100% - 90px) / 2);
}
}
body.page_custom-order #pageContents .products_category__block--archives .products_category__contents, body.page_cs-series #pageContents .products_category__block--archives .products_category__contents {
position: relative;
overflow: hidden;
transition: max-height 0.3s linear;
max-height: unset;
padding-bottom: 50px;
}
body.page_custom-order #pageContents .products_category__block--archives .products_category__contents.is-open .products_category__contents__button:after, body.page_cs-series #pageContents .products_category__block--archives .products_category__contents.is-open .products_category__contents__button:after {
content: "Close";
background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12" fill="none"><path d="M-2.98023e-07 10L1.775 11.775L10 3.55002L18.225 11.775L20 10L10 2.42386e-05L-2.98023e-07 10Z" fill="%230070E0"/></svg>');
}
body.page_custom-order #pageContents .products_category__block--archives .products_category__contents__button, body.page_cs-series #pageContents .products_category__block--archives .products_category__contents__button {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 50px;
cursor: pointer;
background: linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #F5F5F5 25%);
z-index: 1;
}
@media screen and (max-width: 767px) {
body.page_custom-order #pageContents .products_category__block--archives .products_category__contents__button, body.page_cs-series #pageContents .products_category__block--archives .products_category__contents__button {
background: #F5F5F5;
}
}
body.page_custom-order #pageContents .products_category__block--archives .products_category__contents__button:after, body.page_cs-series #pageContents .products_category__block--archives .products_category__contents__button:after {
content: "Load more";
display: block;
position: absolute;
text-align: center;
left: 0;
width: 100%;
bottom: 0;
padding-bottom: 20px;
background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="12" viewBox="0 0 20 12" fill="none"><path d="M0 1.775L1.775 0L10 8.225L18.225 0L20 1.775L10 11.775L0 1.775Z" fill="%230070E0"/></svg>') no-repeat center bottom;
font-weight: 300;
color: #0070E0;
}
body.page_custom-order #pageContents .products_category__block--archives .products_category__contents .product__thumbnail, body.page_cs-series #pageContents .products_category__block--archives .products_category__contents .product__thumbnail {
aspect-ratio: 3/4;
overflow: hidden;
}
body.page_custom-order #pageContents .products_category__block--archives .products_category__contents .product__thumbnail img, body.page_cs-series #pageContents .products_category__block--archives .products_category__contents .product__thumbnail img {
object-fit: cover;
font-family: "object-fit: cover;";
width: 100% !important;
height: 100% !important;
}
body.page_custom-order .products_category__block, body.page_cs-series .products_category__block {
padding-top: 100px;
position: relative;
}
@media screen and (max-width: 767px) {
body.page_custom-order .products_category__block, body.page_cs-series .products_category__block {
padding-top: 40px;
}
}
body.page_custom-order .products_category__block:before, body.page_cs-series .products_category__block:before {
content: "";
display: block;
position: absolute;
width: 468px;
height: 1px;
transform: rotate(-45deg);
background: var(--color_secondary);
right: -210.6px;
top: 50px;
}
@media screen and (max-width: 767px) {
body.page_custom-order .products_category__block:before, body.page_cs-series .products_category__block:before {
width: 100px;
right: -36px;
top: 24px;
}
}
body.page_custom-order .products_category__block:nth-of-type(2):before, body.page_cs-series .products_category__block:nth-of-type(2):before {
display: none;
}
body.page_custom-order .products_category__description, body.page_cs-series .products_category__description {
margin-bottom: 30px;
}
body.page_custom-order .products_category__description .mention__list, body.page_cs-series .products_category__description .mention__list {
font-size: calc(14 / 17 * 1rem);
}
body.page_custom-order .products_category__title, body.page_cs-series .products_category__title {
position: relative;
}
body.page_custom-order .products_category__title:before, body.page_cs-series .products_category__title:before {
content: "";
display: block;
position: absolute;
right: 0;
top: 50%;
width: 100%;
height: 1px;
background: #5A5A5A;
transform: translateY(-50%);
}
body.page_custom-order .products_category__title h2, body.page_cs-series .products_category__title h2 {
font-size: calc(60 / 17 * 1rem);
font-weight: 200;
display: inline-block;
background: var(--color_background);
position: relative;
padding-right: 20px;
margin-bottom: 20px;
}
@media screen and (max-width: 767px) {
body.page_custom-order .products_category__title, body.page_cs-series .products_category__title {
margin-bottom: 20px;
}
body.page_custom-order .products_category__title h2, body.page_cs-series .products_category__title h2 {
font-size: calc(40 / 17 * 1rem);
}
}
body.page_custom-order div[class*=products_category__block--available] .product__block .product__lead, body.page_cs-series div[class*=products_category__block--available] .product__block .product__lead {
display: block !important;
}
body.page_custom-order .cs_series__block, body.page_cs-series .cs_series__block {
position: relative;
}
body.page_custom-order .cs_series__contents, body.page_cs-series .cs_series__contents {
width: 36.63%;
margin-left: 0;
margin-right: auto;
font-size: calc(17 / 17 * 1rem);
}
body.page_custom-order .cs_series__contents p + p, body.page_cs-series .cs_series__contents p + p {
margin-top: 30px;
}
@media screen and (max-width: 767px) {
body.page_custom-order .cs_series__contents, body.page_cs-series .cs_series__contents {
width: auto;
}
}
@media screen and (max-width: 767px) {
body.page_custom-order .cs_series__images, body.page_cs-series .cs_series__images {
position: relative;
margin-top: 30px;
}
}
@media screen and (max-width: 767px) {
body.page_custom-order .cs_series__images img:nth-of-type(1), body.page_cs-series .cs_series__images img:nth-of-type(1) {
padding-top: 20vw;
width: 69.3333333333vw;
margin-left: 0;
}
body.page_custom-order .cs_series__images img:nth-of-type(2), body.page_cs-series .cs_series__images img:nth-of-type(2) {
position: absolute;
width: 37.3333333333vw;
top: 0;
right: 0;
}
}
@media screen and (min-width: 768px) {
body.page_custom-order .cs_series__images img:nth-of-type(1), body.page_cs-series .cs_series__images img:nth-of-type(1) {
position: absolute;
width: 43.60%;
bottom: 0;
left: 42.7325581395%;
transform: translateY(-45%);
}
body.page_custom-order .cs_series__images img:nth-of-type(2), body.page_cs-series .cs_series__images img:nth-of-type(2) {
position: absolute;
width: 28.34%;
bottom: 67.4418604651%;
left: 69.7674418605%;
transform: translateY(5%);
}
}
body[class*=term-cs_series] #pageTitle h1:before {
display: none;
} .policy {
margin: 0;
}
.policy > div {
margin: 25px 0;
}
.policy h2 {
font-size: 115%;
margin-bottom: 7px;
font-weight: 300;
}
.policy p {
font-size: 80%;
}
.policy ol,
.policy ul {
margin: 15px 0 15px 25px;
list-style-position: outside;
font-size: 80%;
}   .contact {
width: 800px;
margin: 0 auto;
}
.form-body {
padding: 70px 0;
}
.form-body p.note {
text-align: right;
font-size: 80%;
}
.form-body .policy {
display: flex;
justify-content: center;
margin: 20px 0;
font-size: 90%;
}
.form-body .mark {
color: #0CA2FF;
}
.form-body .form-list {
display: flex;
margin: 20px 0;
padding: 0;
}
.form-body .form-list div:nth-child(1) {
width: 20%;
}
.form-body .form-list div:nth-child(2) {
width: 80%;
} input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus {
-webkit-text-fill-color: var(--color_black);
transition: background-color 5000s ease-in-out 0s;
font-family: inherit !important;
}
.form-body input, 
.form-body textarea, 
.form-body button {
font-family: inherit !important;
font-size: 16px;
color: var(--color_black);
}
.form-body input[type=text],
.form-body input[type=email],
.form-body input[type=tel],
.form-body textarea {
font-family: inherit !important;
font-size: 16px;
color: var(--color_black);
width: 100%;
padding: 20px;
border: none;
box-sizing: border-box;
border-radius: 6px;
}
#checkval {
appearance: none;
-webkit-appearance: none;
width: 24px;
height: 24px;
border: 2px solid #ccc;
border-radius: 4px;
vertical-align: middle;
cursor: pointer;
position: relative;
} #checkval:checked {
background-color: #0070E0; border-color: #0070E0;
} #checkval:checked::after {
content: '';
position: absolute;
left: 6px;
top: 1px;
width: 5px;
height: 11px;
border: solid white;
border-width: 0 3px 3px 0;
transform: rotate(45deg);
}
#errmsg {
font-size: calc(16 / 17 * 1rem);
margin: 20px 0;
color: #0070E0;
} .contact-submit {
width: 460px;
margin: 60px auto;
position: relative;
}
.contact-submit:before {
content: "";
display: block;
position: absolute;
left: 10.8695652174%;
top: 50%;
width: 21px;
height: 21px;
background: url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/images/ico_check.svg) no-repeat center center;
transform: translateY(-50%);
transition: left 0.3s ease-in-out;
}
.contact-submit > input[type=submit] {
width: 100%;
font-family: var(--main-font);
color: var(--color_white);
text-align: center;
font-size: calc(24 / 17 * 1rem);
font-weight: 300;
letter-spacing: 0.14em;
background: var(--color_black);
padding: 30px 0;
border: 2px solid var(--color_black);
border-radius: 10px;
}
.contact-submit > input[type=submit]:hover,
.contact-submit:hover, .contact-submit:focus, .contact-submit:active {
background: var(--color_white);
color: var(--color_black);
text-decoration: none;
}
.contact-submit:hover:before, .contact-submit:focus:before, .contact-submit:active:before {
left: 11.9565217391%;
}
@media screen and (max-width: 767px) {
.contact-submit {
max-width: 100%;
}
.contact-submit > input[type=submit] {
font-size: calc(20 / 17 * 1rem);
padding-top: 1.65em;
padding-bottom: 1.65em;
}
}
@media screen and (max-width: 810px) {
.contact {
width: 100%;
}
}
@media screen and (max-width: 767px) {
.form-body {
padding: 40px 0;
}
.form-body .form-list {
display: block;
}
.form-body .form-list div:nth-child(1) {
width: 100%;
margin-bottom: 7px;
}
.form-body .form-list div:nth-child(2) {
width: 100%;
margin-bottom: 15px;
}
} #newsletter-page .btn {
position: relative;
width: auto;
margin: 45px 0 0;
text-align: left;
}
#newsletter-page .btn a {
display: inline-block;
background-color: var(--color_black);
color: var(--color_white);
border-radius: 8px;
padding: 18px 40px;
font-size: 14px;
font-weight: 300;
letter-spacing: 0.07em;
cursor: pointer;
width: auto;
transition: background-color 0.3s ease;
}
#newsletter-page .btn a:hover {
background-color: #0CA2FF;
}
@media screen and (max-width: 767px) {
#newsletter-page .btn { width: 100%; }
} @media screen and (max-width: 767px) {
#mailpoet_form_1, #mailpoet_form_1 .mailpoet_paragraph.last {
width: 100% !important;
}
#newsletter-page .btn a {
width: 100%;
text-align: center;
padding: 20px;
}
}
html.is-locked {
overflow: hidden;
left: 0;
right: 0;
top: 0;
bottom: 0;
position: fixed;
}
html.is-locked .inview {
transition: none;
}
html.is-locked .inview.fadeInUp {
transform: translate(0, 0);
opacity: 1;
}
html.is-locked .inview.slideInLeft {
transform: translateX(0%);
opacity: 1;
}@font-face {
font-family: 'flexslider-icon';
src: url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/js/flexslider/fonts/flexslider-icon.eot);
src: url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/js/flexslider/fonts/flexslider-icon.eot?#iefix) format('embedded-opentype'), url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/js/flexslider/fonts/flexslider-icon.woff) format('woff'), url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/js/flexslider/fonts/flexslider-icon.ttf) format('truetype'), url(//blooperbackpacks.com/bbp_admin/wp-content/themes/bbp/assets/js/flexslider/fonts/flexslider-icon.svg#flexslider-icon) format('svg');
font-weight: normal;
font-style: normal;
} .flex-container a:hover,
.flex-slider a:hover {
outline: none;
}
.slides,
.slides > li,
.flex-control-nav,
.flex-direction-nav {
margin: 0;
padding: 0;
list-style: none;
}
.flex-pauseplay span {
text-transform: capitalize;
} .flexslider {
margin: 0;
padding: 0;
}
.flexslider .slides > li {
display: none;
-webkit-backface-visibility: hidden;
}
.flexslider .slides img {
width: 100%;
display: block;
}
.flexslider .slides:after {
content: "\0020";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
html[xmlns] .flexslider .slides {
display: block;
}
* html .flexslider .slides {
height: 1%;
}
.no-js .flexslider .slides > li:first-child {
display: block;
} .flexslider {
margin: 0 0 60px;
background: #fff;
border: 4px solid #fff;
position: relative;
zoom: 1;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
-moz-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
-o-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
}
.flexslider .slides {
zoom: 1;
}
.flexslider .slides img {
height: auto;
-moz-user-select: none;
}
.flex-viewport {
max-height: 2000px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.loading .flex-viewport {
max-height: 300px;
}
@-moz-document url-prefix() {
.loading .flex-viewport {
max-height: none;
}
}
.carousel li {
margin-right: 5px;
}
.flex-direction-nav {
*height: 0;
}
.flex-direction-nav a {
text-decoration: none;
display: block;
width: 40px;
height: 40px;
margin: -20px 0 0;
position: absolute;
top: 50%;
z-index: 10;
overflow: hidden;
opacity: 0;
cursor: pointer;
color: rgba(0, 0, 0, 0.8);
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.flex-direction-nav a:before {
font-family: "flexslider-icon";
font-size: 40px;
display: inline-block;
content: '\f001';
color: rgba(0, 0, 0, 0.8);
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
}
.flex-direction-nav a.flex-next:before {
content: '\f002';
}
.flex-direction-nav .flex-prev {
left: -50px;
}
.flex-direction-nav .flex-next {
right: -50px;
text-align: right;
}
.flexslider:hover .flex-direction-nav .flex-prev {
opacity: 0.7;
left: 10px;
}
.flexslider:hover .flex-direction-nav .flex-prev:hover {
opacity: 1;
}
.flexslider:hover .flex-direction-nav .flex-next {
opacity: 0.7;
right: 10px;
}
.flexslider:hover .flex-direction-nav .flex-next:hover {
opacity: 1;
}
.flex-direction-nav .flex-disabled {
opacity: 0!important;
filter: alpha(opacity=0);
cursor: default;
z-index: -1;
}
.flex-pauseplay a {
display: block;
width: 20px;
height: 20px;
position: absolute;
bottom: 5px;
left: 10px;
opacity: 0.8;
z-index: 10;
overflow: hidden;
cursor: pointer;
color: #000;
}
.flex-pauseplay a:before {
font-family: "flexslider-icon";
font-size: 20px;
display: inline-block;
content: '\f004';
}
.flex-pauseplay a:hover {
opacity: 1;
}
.flex-pauseplay a.flex-play:before {
content: '\f003';
}
.flex-control-nav {
width: 100%;
position: absolute;
bottom: -40px;
text-align: center;
}
.flex-control-nav li {
margin: 0 6px;
display: inline-block;
zoom: 1;
*display: inline;
}
.flex-control-paging li a {
width: 11px;
height: 11px;
display: block;
background: #666;
background: rgba(0, 0, 0, 0.5);
cursor: pointer;
text-indent: -9999px;
-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
-o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.flex-control-paging li a:hover {
background: #333;
background: rgba(0, 0, 0, 0.7);
}
.flex-control-paging li a.flex-active {
background: #000;
background: rgba(0, 0, 0, 0.9);
cursor: default;
}
.flex-control-thumbs {
margin: 5px 0 0;
position: static;
overflow: hidden;
}
.flex-control-thumbs li {
width: 25%;
float: left;
margin: 0;
}
.flex-control-thumbs img {
width: 100%;
height: auto;
display: block;
opacity: .7;
cursor: pointer;
-moz-user-select: none;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}
.flex-control-thumbs img:hover {
opacity: 1;
}
.flex-control-thumbs .flex-active {
opacity: 1;
cursor: default;
} @media screen and (max-width: 860px) {
.flex-direction-nav .flex-prev {
opacity: 1;
left: 10px;
}
.flex-direction-nav .flex-next {
opacity: 1;
right: 10px;
}
}