﻿@charset "UTF-8";

#header { margin: 0;}
#zerohalliburton { background: #F8F8F8; font-family: '游ゴシック', 'Yu Gothic', '游ゴシック体', YuGothic, "Noto Sans CJK JP", 'Noto Sans Japanese', sans-serif, "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

/* ========================
   PC
======================== */
html[data-browse-mode="P"] #zerohalliburton { font-size: 18px; line-height: 1.4;}
html[data-browse-mode="P"] #zerohalliburton .sp { display: none;}
html[data-browse-mode="P"] #zerohalliburton h1 { margin: 0; line-height: 0;}
html[data-browse-mode="P"] #zerohalliburton h1 img { width: 100%;}
html[data-browse-mode="P"] #zerohalliburton .inner { width: 1200px; margin: 0 auto;}

/* Message */
html[data-browse-mode="P"] #zerohalliburton .message { padding: 60px 0; text-align: center;}
html[data-browse-mode="P"] #zerohalliburton .message p { font-size: 20px; font-weight: 500; line-height: 2;}
html[data-browse-mode="P"] #zerohalliburton .message p + p { margin-top: 10px;}

/* Summary */
html[data-browse-mode="P"] #zerohalliburton .summary { 
	padding: 40px 0; margin: 0; text-align: center; color: #222; 
	background: url("../../../img/pages/zerohalliburton/bg_summary02.png") center center / auto repeat-x,url("../../../img/pages/zerohalliburton/bg_summary01.jpg") center top / cover no-repeat;
	position: relative; z-index: 1;
}
html[data-browse-mode="P"] #zerohalliburton .summary h2 { margin: 0 0 40px; font-size: 32px; color: #AD0000; font-weight: bold; text-align: center; line-height: 1.0;}
html[data-browse-mode="P"] #zerohalliburton .summary ul { display: flex; justify-content: center; column-gap: 40px;}
html[data-browse-mode="P"] #zerohalliburton .summary li { width: 220px;}
html[data-browse-mode="P"] #zerohalliburton .summary li img { vertical-align: top;}
html[data-browse-mode="P"] #zerohalliburton .summary li p { font-size: 16px; font-weight: bold; padding: 28px 0 0;}

/* Navigation */
html[data-browse-mode="P"] #zerohalliburton .navigation { padding: 60px 0 0 0; margin: 0 0 120px 0;}
html[data-browse-mode="P"] #zerohalliburton .navigation ul { display: flex; justify-content: center; column-gap: 32px;}
html[data-browse-mode="P"] #zerohalliburton .navigation li { width: 120px;}
html[data-browse-mode="P"] #zerohalliburton .navigation li .image { width: 120px; height: 120px; margin: 0 0 24px 0;}
html[data-browse-mode="P"] #zerohalliburton .navigation li .image img { vertical-align: top;}
html[data-browse-mode="P"] #zerohalliburton .navigation li .name { font-size: 16px; font-weight: 700; text-align: center; letter-spacing: -1px;}
html[data-browse-mode="P"] #zerohalliburton .navigation .navigation-wrap { display: flex; align-items: center; margin: 0 0 44px;}
html[data-browse-mode="P"] #zerohalliburton .navigation .navigation-title { font-size: 24px; font-weight: bold; color: #96000B; flex-shrink: 0; width: 320px;}
html[data-browse-mode="P"] #zerohalliburton .zerohalliburton-title{width: 1200px; margin: 80px auto 0; font-size: 40px; font-weight: bold; color: #96000B; text-align: center; background: url(../../../img/pages/zerohalliburton/bg_title.png) center left repeat-x;}
html[data-browse-mode="P"] #zerohalliburton .zerohalliburton-title span{display: inline-block; background: #F8F8F8; padding: 0 26px ;}
/* Item */
html[data-browse-mode="P"] #zerohalliburton .item { padding: 60px 0 0 0; position: relative; z-index: 1;}
html[data-browse-mode="P"] #zerohalliburton .item + .item { margin-top: 20px;}
html[data-browse-mode="P"] #zerohalliburton .item .inner { position: relative; padding: 55px 0 0;}
html[data-browse-mode="P"] #zerohalliburton .item h2 { width: 100%; height: 74px; padding: 6px 16px; margin: 0 0 40px 0; display: flex; align-items: center; background: linear-gradient(180deg, #E3E3E3 0%, #C1C1C1 100%); position: relative; z-index: 1;}
html[data-browse-mode="P"] #zerohalliburton .item h2 .goods-tag { width: 140px; height: 42px; padding: 0 16px; font-size: 16px; font-weight: bold; line-height: 1.28; color: #FFF; display: flex; align-items: center; background: #9B262A; position: absolute; top: -42px; left: 0; z-index: 1;}
html[data-browse-mode="P"] #zerohalliburton .item h2 .goods-tag::after { content: ''; width: 0; height: 0; border-right: 16px solid transparent; border-bottom: 42px solid #9B262A; position: absolute; right: -16px; top: 0;}
html[data-browse-mode="P"] #zerohalliburton .item h2 .goods-name { font-size: 32px; font-weight: bold; line-height: 1.28; color: #000;}
html[data-browse-mode="P"] #zerohalliburton .item h2 .goods-name.new{display: flex; align-items: center; gap: 16px;}
html[data-browse-mode="P"] #zerohalliburton .item h2 .goods-name.new::before {content: "NEW"; width: 42px; height: 42px; background: #FFF; border-radius: 50%; font-size: 12px; font-weight: bold; color: #96000B; display: flex; align-items: center; justify-content: center;}
html[data-browse-mode="P"] #zerohalliburton .item h2 + .img { position: absolute; z-index: 2;}
html[data-browse-mode="P"] #zerohalliburton .item .info { width: 700px; padding: 0 16px; margin: 0 0 100px;}
html[data-browse-mode="P"] #zerohalliburton .item#headcover .info { margin-bottom: 80px;}
html[data-browse-mode="P"] #zerohalliburton .item h3 { color: #96000B; font-size: 24px; font-weight: bold; margin: 0 0 15px; width: 100%;}
html[data-browse-mode="P"] #zerohalliburton .item .comment { font-size: 16px; line-height: 1.67; margin: 0 0 24px; width: 100%;}
html[data-browse-mode="P"] #zerohalliburton .item .desc h4 { font-size: 20px; font-weight: bold; margin: 10px 0 20px;}
html[data-browse-mode="P"] #zerohalliburton .item .price { margin: 0 0 25px 0; font-size: 36px; font-weight: bold; letter-spacing: -0.5px; color: #96000B;}
html[data-browse-mode="P"] #zerohalliburton .item .price span:not(.tax) { font-size: 18px; margin: 0 3px 0 5px;}
html[data-browse-mode="P"] #zerohalliburton .item .price span.tax { font-size: 16px; font-weight: bold; font-feature-settings: 'palt'; letter-spacing: 0;}
html[data-browse-mode="P"] #zerohalliburton .item .btn { display: block; width: 224px; background: #96000B; border-radius: 50px; text-align: center; color: #FFF; font-weight: bold; letter-spacing: 1px; padding: 12px 0; transition: .3s ease;}
html[data-browse-mode="P"] #zerohalliburton .item .btn:hover { background: #5B000D;}
html[data-browse-mode="P"] #zerohalliburton .item .swiper { position: relative; width: 1080px; margin: 0 auto; overflow: hidden;}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-slide { position: relative; width: 360px !important; transition: .3s ease;}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-slide:before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(14, 14, 14, 0) 43.51%, rgba(36, 36, 36, .43) 73.23%, #000 100%);}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-slide:not(.swiper-slide-active) { transform: scale(.55);}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-slide:not(.swiper-slide-active) p{ display: none;}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-slide p { width: 100%; position: absolute; left: 0; bottom: 0; font-size: 12px; color: #FFF; font-weight: bold; line-height: 1.66; padding: 16px;}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-button-prev,
html[data-browse-mode="P"] #zerohalliburton .item .swiper-button-next { width: 60px; height: 60px; background: transparent; border-radius: 50%; left: 290px; cursor: pointer;}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-button-next { left: auto; right: 290px;}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-button-prev:after,
html[data-browse-mode="P"] #zerohalliburton .item .swiper-button-next:after { content: ''; width: 20px; height: 31px; background-position: center center; background-repeat: none; -webkit-background-size: 20px auto; background-size: 20px auto; position: absolute; top: calc(50% - 15px); left: calc(50% - 10px);}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-button-prev:after { background-image: url("../../../img/pages/zerohalliburton/prev.png");}
html[data-browse-mode="P"] #zerohalliburton .item .swiper-button-next:after { background-image: url("../../../img/pages/zerohalliburton/next.png");}
html[data-browse-mode="P"] #zerohalliburton .item .btn-list { display: block; width: 320px; margin: 40px auto 0; padding: 13px 0; background: #96000B; text-align: center; color: #FFF; font-weight: bold; letter-spacing: 1px; transition: .3s ease;}

html[data-browse-mode="P"] #zerohalliburton .item .btn-list:hover { background: #5B000D;}
html[data-browse-mode="P"] #zerohalliburton .item .info ul { display: flex; justify-content: center;}
html[data-browse-mode="P"] #zerohalliburton .item .info li { width: 330px; margin: 0 12px;}
html[data-browse-mode="P"] #zerohalliburton .item .info li h4 { font-weight: bold; margin: 0 0 10px;}
html[data-browse-mode="P"] #zerohalliburton .item .info li .btn { margin: 20px auto 0;}

html[data-browse-mode="P"] #zerohalliburton .item.even h2 { justify-content: flex-end;}
html[data-browse-mode="P"] #zerohalliburton .item.even h2 .goods-tag { left: auto; right: 0;}
html[data-browse-mode="P"] #zerohalliburton .item.even h2 .goods-tag::after { border-right: none; border-left: 16px solid transparent; border-bottom: 42px solid #9B262A; position: absolute; left: -16px; right: auto;}
html[data-browse-mode="P"] #zerohalliburton .item.even .info { margin-left: auto;}

html[data-browse-mode="P"] #zerohalliburton #lockertote h2 + .img { width: 410px; top: 75px; right: 0;}
html[data-browse-mode="P"] #zerohalliburton #carttote h2 + .img { width: 321px; top: 135px; left: 65px;}
html[data-browse-mode="P"] #zerohalliburton #headcover h2 + .img { width: 396px; top: 10px; right: 25px;}
html[data-browse-mode="P"] #zerohalliburton #standbag h2 + .img { width: 249px; top: -5px; right: 95px;}
html[data-browse-mode="P"] #zerohalliburton #cadybag h2 + .img { width: 204px; top: -5px; left: 100px;}
html[data-browse-mode="P"] #zerohalliburton #headcover ul { margin: 0 0 72px; padding: 0 70px; display: flex; justify-content: space-between;}
html[data-browse-mode="P"] #zerohalliburton #headcover ul li { width: 240px; margin: 0; text-align: center;}
html[data-browse-mode="P"] #zerohalliburton #headcover ul li .img img { height: 285px; vertical-align: top;}
html[data-browse-mode="P"] #zerohalliburton #headcover ul li .btn { width: 240px;}

/* Animation */
html[data-browse-mode="P"] #zerohalliburton .item:not(.even) h2 + .img { opacity: 0;}
html[data-browse-mode="P"] #zerohalliburton .item.action-start h2 + .img { opacity: 0; -webkit-animation: RightIn 0.5s ease-in forwards; animation: RightIn 0.5s ease-in forwards;}
html[data-browse-mode="P"] #zerohalliburton .item.even h2 + .img { opacity: 0;}
html[data-browse-mode="P"] #zerohalliburton .item.even.action-start h2 + .img { opacity: 0; -webkit-animation: LeftIn 0.5s ease-in forwards; animation: LeftIn 0.5s ease-in forwards;}

/* Brand */
html[data-browse-mode="P"] #zerohalliburton .brand {
	width: 100%; min-height: 345px; padding: 40px 0; margin: 120px 0 0 0; text-align: center; color: #fff;
	display: flex; justify-content: center; align-items: center;
	background: url("../../../img/pages/zerohalliburton/bg_brand.png") center 215px repeat-x #222;
	position: relative;
}
html[data-browse-mode="P"] #zerohalliburton .brand .inner { width: 800px; position: relative;}
html[data-browse-mode="P"] #zerohalliburton .brand h2 { font-size: 16px; font-weight: bold; margin: 0 0 36px;}
html[data-browse-mode="P"] #zerohalliburton .brand .logo { width: 130px; margin: 0 auto 100px;}
html[data-browse-mode="P"] #zerohalliburton .brand .logo img { width: 130px; vertical-align: top;}
html[data-browse-mode="P"] #zerohalliburton .brand .text { font-size: 16px; font-weight: bold; text-align: left; line-height: 1.25; color: #fff; text-align: center;}

/* for GOODS */
html[data-browse-mode="P"] #zerohalliburton #for_goods .for-goods-button { width: 86px; height: 86px; position: fixed; right: 40px; top: calc(50% - 43px); z-index: 11;}
html[data-browse-mode="P"] #zerohalliburton #for_goods .for-goods-button a { width: 86px; height: 86px; padding: 3px 0 0 0; border: #fff 2px solid; border-radius: 86px; font-size: 14px; font-weight: 800; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; background: #96000B; transition: 0.3s;}
html[data-browse-mode="P"] #zerohalliburton #for_goods .for-goods-button a:hover { background: #5B000D;}

/* popup */
html[data-browse-mode="P"] #zerohalliburton #sp_navi_list { display: none !important;}

html[data-browse-mode="P"] #zerohalliburton .btn-list02 { display: block; width: 734px; margin: 75px auto 0; padding: 22px 0; background: #222222; text-align: center; color: #FFF; font-weight: bold; letter-spacing: 1px; transition: .3s ease;}

/* ========================
   SP
======================== */
html[data-browse-mode="S"] #zerohalliburton .pc { display: none;}
html[data-browse-mode="S"] #zerohalliburton h1 { margin: 0;}
html[data-browse-mode="S"] #zerohalliburton h1 img { width: 100%;}

/* Message */
html[data-browse-mode="S"] #zerohalliburton .message { padding: 30px 15px; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton .message p { font-size: 15px; font-weight: 500; line-height: 1.73; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton .message p + p { margin-top: 10px;}

/* summary */
html[data-browse-mode="S"] #zerohalliburton .summary { 
	padding: 20px 0 40px; margin: 0; text-align: center; color: #222; 
	background: url("../../../img/pages/zerohalliburton/bg_summary02_sp.png") center center / auto repeat-x,url("../../../img/pages/zerohalliburton/bg_summary01_sp.jpg") center top / cover no-repeat;
	position: relative; z-index: 1;
}
html[data-browse-mode="S"] #zerohalliburton .summary h2 { padding: 7px 5px 5px; margin: 0 0 12px; font-size: 24px; font-weight: bold; color: #AD0001; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton .summary ul { width: 100%; padding: 0 15px; display: flex; justify-content: space-between;}
html[data-browse-mode="S"] #zerohalliburton .summary li { width: calc((100% - 30px)/3);}
html[data-browse-mode="S"] #zerohalliburton .summary p { font-size: 13px; font-weight: bold; margin: 15px 0 0; text-align: left;}

/* Navigation */
html[data-browse-mode="S"] #zerohalliburton .navigation { padding: 40px 0 0 0; margin: 0 0 18vw 0;}
html[data-browse-mode="S"] #zerohalliburton .navigation ul { padding: 0 24px 15px; display: flex; flex-wrap: nowrap; justify-content: center; column-gap: 30px; overflow-x: scroll;}
html[data-browse-mode="S"] #zerohalliburton .navigation ul:has(li:nth-child(3)) { justify-content: flex-start;}
html[data-browse-mode="S"] #zerohalliburton .navigation li { width: 110px; min-width: 110px;}
html[data-browse-mode="S"] #zerohalliburton .navigation li .image { width: 110px; height: 110px; margin: 0 0 15px 0;}
html[data-browse-mode="S"] #zerohalliburton .navigation li .image img { vertical-align: top;}
html[data-browse-mode="S"] #zerohalliburton .navigation li .name { font-size: 14px; font-weight: 700; text-align: center; letter-spacing: -1px;}
html[data-browse-mode="S"] #zerohalliburton .navigation .navigation-wrap { margin: 0 0 40px;}
html[data-browse-mode="S"] #zerohalliburton .navigation .navigation-wrap:last-of-type { margin: 0;}
html[data-browse-mode="S"] #zerohalliburton .navigation .navigation-title { font-size: 24px; font-weight: bold; color: #96000B; text-align: center; margin: 0 0 16px;}
html[data-browse-mode="S"] #zerohalliburton .zerohalliburton-title{margin: 60px auto 40px; font-size: 24px; font-weight: bold; color: #96000B; text-align: center; background: url(../../../img/pages/zerohalliburton/bg_title.png) center left repeat-x;}
html[data-browse-mode="S"] #zerohalliburton .zerohalliburton-title span{display: inline-block; background: #F8F8F8; padding: 0 18px;}
html[data-browse-mode="S"] #zerohalliburton .item { padding: 40px 0 0; z-index: 1;}
html[data-browse-mode="S"] #zerohalliburton .item + .item { margin-top: 80px;}
html[data-browse-mode="S"] #zerohalliburton .item + .item#headcover { margin-top: 160px;}
html[data-browse-mode="S"] #zerohalliburton .item h2 { width: 100%; padding: 16px 15px; margin: 0; display: flex; align-items: center; background: linear-gradient(180deg, #E3E3E3 0%, #C1C1C1 100%); position: relative; z-index: 1;}
html[data-browse-mode="S"] #zerohalliburton .item h2 .goods-tag { width: 140px; height: 42px; padding: 0 0 0 16px; font-size: 15px; font-weight: bold; line-height: 1.28; color: #FFF; display: flex; align-items: center; background: #9B262A; position: absolute; top: -42px; left: 0; z-index: 1;}
html[data-browse-mode="S"] #zerohalliburton .item h2 .goods-tag::after { content: ''; width: 0; height: 0; border-right: 16px solid transparent; border-bottom: 42px solid #9B262A; position: absolute; right: -16px; top: 0;}
html[data-browse-mode="S"] #zerohalliburton .item h2 .goods-name { font-size: 22px; font-weight: bold; line-height: 1.28; color: #222;}
html[data-browse-mode="S"] #zerohalliburton .item h2 + .img { position: relative; z-index: 2;}
html[data-browse-mode="S"] #zerohalliburton .item .info { padding: 0 15px; margin: 0 0 40px;}
html[data-browse-mode="S"] #zerohalliburton .item h3 { margin: 0 0 10px; color: #96000B; font-size: 23px; line-height: 1.27; text-align: left;}
html[data-browse-mode="S"] #zerohalliburton .item .comment { margin: 0 0 20px; font-size: 16px; text-align: left;}
html[data-browse-mode="S"] #zerohalliburton .item .price { margin: 0 0 15px; font-size: 35px; font-weight: bold; text-align: center; color: #96000B;}
html[data-browse-mode="S"] #zerohalliburton .item .price span:not(.tax) { font-size: 18px; margin: 0 2px 0 4px;}
html[data-browse-mode="S"] #zerohalliburton .item .price .tax { font-size: 16px; font-weight: bold; font-feature-settings: 'palt';}
html[data-browse-mode="S"] #zerohalliburton .item .btn { display: block; width: 58%; min-width: 232px; margin: 0 auto; padding: 12px 0; color: #FFF; font-size: 18px; font-weight: bold; letter-spacing: 1px; text-align: center; background: #96000B; border-radius: 50px !important;}
html[data-browse-mode="S"] #zerohalliburton .item .slider { margin: 0 0 40px;}
html[data-browse-mode="S"] #zerohalliburton .item .swiper { position: relative;}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-slide { position: relative; transition: .3s ease;}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-slide:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(14, 14, 14, 0) 43.51%, rgba(36, 36, 36, .43) 73.23%, #000 100%);}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-slide:not(.swiper-slide-active) { transform: scale(.68);}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-slide:not(.swiper-slide-active) p { display: none;}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-slide p { position: absolute; left: 0; bottom: 0; width: 100%; font-size: 12px; color: #FFF; font-weight: bold; line-height: 1.38; padding: 16px;}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-button-prev,
html[data-browse-mode="S"] #zerohalliburton .item .swiper-button-next { width: 50px; height: 50px; background: transparent; border-radius: 50%; left: 4.5%; z-index: 7;}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-button-next { left: auto; right: 4.5%;}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-button-prev:after,
html[data-browse-mode="S"] #zerohalliburton .item .swiper-button-next:after { content: ''; width: 20px; height: 31px; background-position: center center; background-repeat: none; -webkit-background-size: 20px auto; background-size: 20px auto; position: absolute; top: calc(50% - 15px); left: calc(50% - 10px);}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-button-prev:after { background-image: url("../../../img/pages/zerohalliburton/prev.png");}
html[data-browse-mode="S"] #zerohalliburton .item .swiper-button-next:after { background-image: url("../../../img/pages/zerohalliburton/next.png");}
html[data-browse-mode="S"] #zerohalliburton .item .btn-list { width: calc(100% - 100px); padding: 12px 0; margin: 0 auto; display: block; color: #FFF; font-size: 18px; font-weight: bold; letter-spacing: 1px; text-align: center; background: #96000B;}
html[data-browse-mode="S"] #zerohalliburton .item ul { padding: 0; margin: 0 0 80px;}
html[data-browse-mode="S"] #zerohalliburton .item li { margin: 0 0 60px; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton .item li:last-child { margin: 0;}
html[data-browse-mode="S"] #zerohalliburton .item li .img { margin: 0 0 5px;}
html[data-browse-mode="S"] #zerohalliburton .item li h4 { font-size: 18px; line-height: 1.38; margin: 0 0 7px;}
html[data-browse-mode="S"] #zerohalliburton .item li .price { text-align: center;}

html[data-browse-mode="S"] #zerohalliburton .item.even h2 { justify-content: flex-end;}
html[data-browse-mode="S"] #zerohalliburton .item.even h2 .goods-tag { left: auto; right: 0;}
html[data-browse-mode="S"] #zerohalliburton .item.even h2 .goods-tag::after { border-right: none; border-left: 16px solid transparent; border-bottom: 42px solid #9B262A; position: absolute; left: -16px; right: auto;}
html[data-browse-mode="S"] #zerohalliburton .item.even h2 .goods-name { text-align: right;}
html[data-browse-mode="S"] #zerohalliburton .item.even .info { margin-left: auto;}
html[data-browse-mode="S"] #zerohalliburton #lockertote h2 + .img { width: 82%; height: 62vw; padding: 0 15px 0 0; margin: 0 0 0 auto; top: -16vw;}
html[data-browse-mode="S"] #zerohalliburton #carttote h2 + .img { width: 65%; height: 50vw; padding: 0 0 0 10px; margin: 0 auto 0 0; top: -15vw;}
html[data-browse-mode="S"] #zerohalliburton #standbag h2 + .img { width: 58%; height: 86vw; padding: 0 15px 0 0; margin: 0 0 0 auto; top: -24vw;}
html[data-browse-mode="S"] #zerohalliburton #cadybag h2 + .img { width: 48%; height: 96vw; padding: 0 0 0 15px; margin: 0 auto 0 0; top: -25vw;}
html[data-browse-mode="S"] #zerohalliburton #headcover h2 + .img { width: 54%; height: 40vw; padding: 0; margin: 0 0 0 auto; top: -44vw;}

html[data-browse-mode="S"] #zerohalliburton #headcover ul { margin-bottom: 50px;}
html[data-browse-mode="S"] #zerohalliburton #headcover ul li { margin: 30px 0; display: flex; justify-content: space-between; align-items: center; padding: 0 15px;}
html[data-browse-mode="S"] #zerohalliburton #headcover ul li:nth-child(2n) { display: flex; justify-content: space-between; flex-direction: row-reverse;}
html[data-browse-mode="S"] #zerohalliburton #headcover ul li .img  { width: 40%; padding: 0; margin: 0; box-sizing: border-box;}
html[data-browse-mode="S"] #zerohalliburton #headcover ul li .desc { width: 55%;}
html[data-browse-mode="S"] #zerohalliburton #headcover ul li .desc h4 { font-size: 20px; font-weight: bold; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton #headcover ul li .desc .price { margin: 0 0 10px 0; font-size: 30px; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton #headcover ul li .btn  { width: 60%; min-width: 152px; padding: 10px 0;}

/* Animation */
html[data-browse-mode="S"] #zerohalliburton .item:not(.even) h2 + .img { opacity: 0;}
html[data-browse-mode="S"] #zerohalliburton .item.action-start h2 + .img { opacity: 0; -webkit-animation: RightIn 0.5s ease-in forwards; animation: RightIn 0.5s ease-in forwards;}
html[data-browse-mode="S"] #zerohalliburton .item.even h2 + .img { opacity: 0;}
html[data-browse-mode="S"] #zerohalliburton .item.even.action-start h2 + .img { opacity: 0; -webkit-animation: LeftIn 0.5s ease-in forwards; animation: LeftIn 0.5s ease-in forwards;}

/* Brand */
html[data-browse-mode="S"] #zerohalliburton .brand {
	width: 100%; padding: 40px 0; margin: 80px 0 0 0; text-align: center; color: #fff;
	background: url("../../../img/pages/zerohalliburton/bg_brand.png") center 215px repeat-x #222;
	position: relative;
}
html[data-browse-mode="S"] #zerohalliburton .brand .inner { padding: 0 15px; position: relative;}
html[data-browse-mode="S"] #zerohalliburton .brand h2 { margin: 0 0 40px 0; font-size: 16px; font-weight: bold; text-align: center; color: #fff;}
html[data-browse-mode="S"] #zerohalliburton .brand .logo { width: 130px; margin: 0 auto 90px;}
html[data-browse-mode="S"] #zerohalliburton .brand .logo img { width: 130px; vertical-align: top;}
html[data-browse-mode="S"] #zerohalliburton .brand .text { font-size: 16px; font-weight: 500; text-align: left; line-height: 1.375; color: #fff;}

/* for GOODS */
html[data-browse-mode="S"] #zerohalliburton #for_goods .for-goods-button { width: 72px; height: 72px; position: fixed; right: 10px; bottom: 120px; z-index: 8;}
html[data-browse-mode="S"] #zerohalliburton #for_goods .for-goods-button a { width: 72px; height: 72px; padding: 2px 0 0 0; border: #fff 1px solid; border-radius: 70px; font-size: 12px; font-weight: 800; letter-spacing: -0.5px; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; background: #96000B; cursor: pointer;}

/* popup */
body.callaway-pop-fixed { overflow: hidden;}
body.callaway-pop-fixed #footer_pagetop { z-index: 8;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list { padding: 80px 15px 40px; background: rgba(34,34,34,0.84); display: none; position: fixed; z-index: 9; top: 0; left: 0; right: 0; bottom: 0;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list .inner { padding: 25px 15px; background: #FFF; position: relative; max-height: calc(100vh - 100px); max-height: calc(100dvh - 100px); overflow-y: auto;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list .navigation-title { font-size: 24px; font-weight: bold; text-align: center; color: #96000B; margin: 0 0 15px;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list ul { display: flex; flex-wrap: wrap; justify-content: center; column-gap: 30px;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list ul li { width: calc((100% - 60px)/3); margin: 0 0 20px 0; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list ul li .image { margin: 0 0 10px 0; text-align: center;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list ul li .name { font-size: clamp(0.813rem, 0.386rem + 1.82vw, 0.875rem); font-weight: bold; text-align: center; letter-spacing: -1px;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list #sp_navi_list_close { width: 50px; height: 50px; margin: 0; border-radius: 50%; font-size: 0px; background: #E2E2E2; position: absolute; top: 5px; right: 5px;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list #sp_navi_list_close::before,html[data-browse-mode="S"] #zerohalliburton #sp_navi_list #sp_navi_list_close::after {content:""; width: 50%; height: 3px; background: #8E8E8E; position: absolute; top: 50%; left: 50%;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list #sp_navi_list_close::before{transform: translate(-50%,-50%) rotate(45deg);}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list #sp_navi_list_close::after{transform: translate(-50%,-50%) rotate(-45deg);}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list .btn-list{width: calc(100% - 20px); font-size: 18px; font-weight: bold; text-align: center; color: #FFF; display: block;background: #96000B; margin: 20px auto 0; padding: 12px;}
html[data-browse-mode="S"] #zerohalliburton #sp_navi_list .btn-list02{width: calc(100% - 20px); margin-top: 6px; padding: 12px;}

html[data-browse-mode="S"] #zerohalliburton .btn-list02 { display: block; width: calc(100% - 30px); margin: 40px auto 0; padding: 40px 0; background: #222222; text-align: center; font-size: 18px; color: #FFF; font-weight: bold; letter-spacing: 1px; transition: .3s ease;}

@-webkit-keyframes LeftIn {
  0%   { opacity: 0; transform: translateX(-200px) scale(1.3);}
  100% { opacity: 1; transform: translateX(0) scale(1.0);}
}
@keyframes LeftIn {
  0%   { opacity: 0; transform: translateX(-200px) scale(1.3);}
  100% { opacity: 1; transform: translateX(0) scale(1.0);}
}

@-webkit-keyframes RightIn {
  0%   { opacity: 0; transform: translateX(-200px) scale(1.3);}
  100% { opacity: 1; transform: translateX(0) scale(1.0);}
}
@keyframes RightIn {
  0%   { opacity: 0; transform: translateX(200px) scale(1.3);}
  100% { opacity: 1; transform: translateX(0) scale(1.0);}
}
