/*===== ! mobile first ! ======*/

.spOnly {display: block;!important;}
.pcOnly {display: none!important;}

/*=====modal======*/
.modal {display: none;background: rgba(0, 0, 0, 0.8);position: fixed;width: 100%;height: 100vh;top: 0;left: 0;z-index: 9999;overflow: auto;}
.modal .modalContent {}
.modal .modalInner {box-sizing: border-box;width: 100%;background: #fff;border-radius: 8.53333vw;padding:10vw;z-index: 9999;position: relative;margin: 5vw auto;}
.modal .modalInner .closeBtn {width: 6.4vw;height: 6.4vw;position: absolute;top: 6.4vw;right: 6.4vw;}
.modal .modalInner .closeBtn a {}
.modal .modalInner .closeBtn a img {}
.modal .modalInner .txtBox {margin-bottom: 10vw;}
.modal .modalInner .ttl {text-align: center; font-family: "Noto Sans JP";font-size: 7vw;padding:10vw 0 2.666666vw;margin-bottom: 5.33333vw;border-bottom: 1.066666vw solid;font-weight: bold;}
.modal .modalInner .txtBox .txt {font-family: "Noto Sans JP";font-size: 4.26666vw;margin-bottom:5vw;line-height: 1.5}
.modal .modalInner .txtBox .note {font-family: "Noto Sans JP";font-size: 4.26666vw;margin-left: 1em;text-indent: -1em;line-height: 1.5;}
.modal .modalInner .txtBox .note:before {content: "・";}
.modal .modalInner .imgBox {}
.modal .modalInner .imgBox img {}
.modal .modalInner .contentsBox {margin-bottom: 9.333333vw;}
.modal .modalInner .contentsBox .ttl03 {font-size: 5.333333vw;font-weight: bold;margin-bottom: 4.266666vw; font-family: "Noto Sans JP";}
.modal .modalInner .contentsBox .txt {font-size: 4.266666vw;line-height: 1.5; font-family: "Noto Sans JP";margin-bottom: 4.266666vw;}
.modal .modalInner .contentsBox .imgBox {}


.modal.ver2 .modalInner {background: #444;color: #fff;}
.modal.ver2 .modalInner .subTtl {font-size: 3.2vw;font-family: "Noto Sans JP";margin-bottom: 6.4vw;text-align: center;}
.modal.ver2 .modalInner .itemList {}
.modal.ver2 .modalInner .itemList .itemBox {}
.modal.ver2 .modalInner .itemList .itemBox .imgBox {}
.modal.ver2 .modalInner .itemList .ttl03 {font-family: 'Noto Serif JP', serif;font-weight: bold;font-size: 4.8vw;margin: 3.2vw auto 2.13333vw;}
.modal.ver2 .modalInner .itemList .ttl04 {font-family: "Noto Sans JP";font-size: 3.733333vw;margin-bottom: 2.66666vw;}
.modal.ver2 .modalInner .itemList .infoList01 {}
.modal.ver2 .modalInner .itemList .infoList01 .infoItem {font-family: "Noto Sans JP";background: #fff;color: #000;font-size: 3.733333vw;line-height: 1.5;display: flex;justify-content: space-between;padding:0 2.13333vw;height: 8.53333vw;align-items: center;margin-bottom: 2.13333vw;}
.modal.ver2 .modalInner .itemList .infoList01 .infoItem .left {}
.modal.ver2 .modalInner .itemList .infoList01 .infoItem .right {}
.modal.ver2 .modalInner .itemList .itemBox {margin-bottom:8vw;}
.modal.ver2 .modalInner .itemList .noteList02 {}
.modal.ver2 .modalInner .itemList .noteList02 .note {font-family: "Noto Sans JP";font-size: 3.7333333vw;line-height: 1.5;}

.modal#modal03 .modalInner {padding: 3vw;}
.modal#modal03 .modalInner .wrap {padding: 0 8vw 5vw;}

.modal.active {display: block;}
.noscroll {overflow-y: hidden;}
.modalBtn a {transition: all .3s ease; font-family: "Noto Sans JP"; background: #000;color: #fff;font-size: 3.7333333vw;height: 10.66666vw;max-height: 80px;box-sizing: border-box; display: flex;cursor: pointer;align-items: center;justify-content: center;margin-top: 8.5333333vw;}
.modalBtn a:hover {background: #fff;color: #000;}
.ttl01,.ttl02,.txt,.sub,.note,.subTtl,.ttl {font-family: 'Noto Serif JP', serif;}
.ttl01 {text-align: center;font-size: 6.933333vw;padding: 4.26666vw 0;line-height: 1.384615;font-weight: 600;}
.ttl02 {text-align: center;font-size: 6.4vw;line-height: 1.3333333;}
.txt {line-height: 1.3333333;font-size: 4.2666666vw;margin-top: 2.66666vw;}
.wrapInner {}
.imgBox {}
.sub {font-size: 3.2vw;margin-top: 10px;}
/*===========*/
.mainVisual {background-color: #000;color: #fff;}
.mainVisual .logo {width: 53.33333333333333vw;margin: auto;}
.mainVisual .logo img {}
.mainVisual .txtBox {text-align: center;width: 95%;margin: auto;padding: 6.4vw 0 4.26666vw}
.mainVisual .txtBox .ttl01 {}
.mainVisual .modalBtn a {border: 1px solid #fff;}
/*=====contentsSection======*/
.contentsSection {}
.section01 {margin-top: 2.13333vw;}
.productInfo01 li,.productInfo02 li,.productInfo3 li {border-bottom: none!important;display: block;text-align: left;max-width: auto!important;}
.section01 .wrapInner {display: flex;justify-content: center;padding: 4.266666vw 4.266666vw 6.4vw;flex-wrap: wrap;}
.section01 .characterBox {display: flex!important;background: #fff;align-items: center;width: 100%;margin-bottom: 4.266666vw;}
.section01 .characterBox.pcOnly{display: none!important;}
.section01 .characterBox.spOnly{display: flex!important;}
.section01 .characterBox .imgBox {width: 25.6vw;}
.section01 .characterBox .txtBox {text-align: center;width: 65.86666vw;}
.section01 .characterBox .txtBox .ttl {font-size: 4.8vw;line-height: 1.33333;}
.section01 .characterBox .txtBox .subTtl {font-size: 3.2vw;margin-top: 2.13333vw;font-weight: bold}
.section01 .wrapInner .leftBox {margin-bottom: 10.1333333vw;}
.section01 .wrapInner .leftBox .imgBox {}
.section01 .wrapInner .leftBox .imgBox img {}
.section01 .wrapInner .leftBox .txtBox {}
.section01 .wrapInner .leftBox .txtBox .txt {}
.section01 .wrapInner .rightBox {}
.section01 .wrapInner .rightBox .imgBox {}
.section01 .wrapInner .rightBox .txtBox {}
.section01 .wrapInner .rightBox .txtBox .txtTtl01,.txtTtl02,.infoList02 .infoItem, .section01 .wrapInner .rightBox .txtBox .txt {font-family: "Noto Sans JP";}
.section01 .wrapInner .rightBox .txtBox .txtTtl01 {font-weight: bold;font-size:4.8vw;margin-bottom: 2.1333333vw;}
.section01 .wrapInner .rightBox .txtBox .noteList {margin:0 auto 5.8666666vw;}
.section01 .wrapInner .rightBox .txtBox .noteList .note {line-height: 1.44444;font-size: 4.8vw;text-indent: -1em;margin-left: 1em;}
.section01 .wrapInner .rightBox .txtBox .noteList .note:before {content: "・";}
.section01 .wrapInner .rightBox .txtBox .txtTtl02 {font-size: 3.733333vw;}
.section01 .wrapInner .rightBox .txtBox .infoList02 {margin-top: 3.2vw;}
.section01 .wrapInner .rightBox .txtBox .infoList02 .infoItem {display: flex;align-items: center; margin-bottom: 2.133333vw; padding: 1.07vw 2.13333vw; background: rgba(255, 255, 255, 0.49);line-height: 1.42857; min-height: 8.533333vw;font-size: 3.733333vw; }
.section01 .wrapInner .rightBox .txtBox .infoList02 .infoItem .left {width: 26.66666vw;color: #B26337;}
.section01 .wrapInner .rightBox .txtBox .infoList02 .infoItem .right {width: 60vw;}
.section01 .wrapInner .rightBox .txtBox .txt {font-size: 3.73333vw;line-height: 1.58;}
.section01 .wrapInner .rightBox .btnBox {max-width: 420px;width: 56vw;margin: 7vw auto 0;}
.section01 {position: relative;background: rgba(223, 194, 146, 0.35);margin-bottom: 2.13333vw;}

/*=====section01.productInfo01======*/
.section01.productInfo01 {}
.section01.productInfo01 .wrapInner{}
.section01.productInfo01 .wrapInner .leftBox {margin-bottom: 6.4vw;}
.section01.productInfo01 .wrapInner .leftBox .imgBox {}
.section01.productInfo01 .wrapInner .rightBox .imgBox {}

/*=====section01.productInfo02======*/
.section01.productInfo02 {position: relative;margin-bottom: 2.13333vw;}
.section01.productInfo02 .wrapInner .leftBox {}


/*===== ! pc !  ======*/

@media screen and (min-width: 768px) {
.pcOnly {display: block!important;}
.spOnly {display: none!important;}
.modal {}
.modal .modalInner {width: 1164px;border-radius: 32px;padding:40px 90px;height: auto;margin: 5vw auto;}
.modal .modalInner .closeBtn {width: 24px;height: 24px;position: absolute;top:24px;right:24px;}
.modal .modalInner .closeBtn a {}
.modal .modalInner .closeBtn a img {}
.modal .modalInner .txtBox {margin-bottom: 0;width: 470px;}
.modal .modalInner .ttl {font-size: 36px;padding:40px 0 20px;margin-bottom:70px;border-bottom: 4px solid;width: 310px;margin: auto;}
.modal .modalInner .wrap {display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 70px;}
.modal .modalInner .txtBox .txt {font-size: 18px;margin-bottom:40px;margin-top: 0;}
.modal .modalInner .txtBox .note {font-size: 18px;}
.modal .modalInner .txtBox .note:before {content: "・";}
.modal .modalInner .imgBox {}
.modal .modalInner .imgBox img {}
.modalBtn a {font-size: 20px; margin-top: 0;height: 64px;}


.modal .modalInner .imgBox {}
.modal .modalInner .imgBox img {}
.modal .modalInner .contentsBox {margin-bottom: 0;width: 466px;}
.modal .modalInner .contentsBox:nth-child(n+3){margin-top: 90px;}
.modal .modalInner .contentsBox .ttl03 {font-size: 28px;margin-bottom: 16px;}
.modal .modalInner .contentsBox .txt {font-size: 16px;margin-bottom: 24px;margin-top: 0;}
.modal .modalInner .contentsBox .imgBox {}


.modal.ver2 .modalInner {}
.modal.ver2 .modalInner .subTtl {font-size: 14px;margin: 15px auto 70px}
.modal.ver2 .modalInner .itemList {display: flex;flex-wrap: wrap;width: 700px;margin: auto;justify-content: space-between;}
.modal.ver2 .modalInner .itemList .itemBox {width: 320px;}
.modal.ver2 .modalInner .itemList .itemBox .imgBox {}
.modal.ver2 .modalInner .itemList .ttl03 {font-size: 22px;margin: 15px auto 5px;}
.modal.ver2 .modalInner .itemList .ttl04 {font-size: 16px;margin-bottom: 15px;}
.modal.ver2 .modalInner .itemList .infoList01 {}
.modal.ver2 .modalInner .itemList .infoList01 .infoItem {font-size: 14px;padding:0 8px;height:32px;margin-bottom:8px;}
.modal.ver2 .modalInner .itemList .infoList01 .infoItem .left {}
.modal.ver2 .modalInner .itemList .infoList01 .infoItem .right {}
.modal.ver2 .modalInner .itemList .itemBox {margin-bottom:0;}
.modal.ver2 .modalInner .itemList .itemBox:nth-child(n+3){margin-top: 50px;}
.modal.ver2 .modalInner .itemList .noteList02 {}
.modal.ver2 .modalInner .itemList .noteList02 .note {font-size: 14px;}

.modal#modal03 .modalInner {padding: 40px 90px 100px;}
.modal#modal03 .modalInner .wrap {padding:0;width: 470px;margin: auto;}
.modal#modal03 .modalInner .ttl {width: 470px;margin: 0 auto 30px}
.modal#modal03 .modalInner .txtBox .note {font-size: 16px;}
.modal#modal03 .modalInner .contentsBox {width: 100%;}

.ttl01 {font-size: 40px;line-height: 1.2;margin: 0}
.ttl02 {font-size: 32px;line-height: 1.25;}
.txt {line-height: 1.5555555;font-size: 18px}
.section01 {margin-bottom: 8px;margin-top:0;}
.wrapInner {}
.imgBox {}
/*===========*/
.mainVisual {position: relative;background: url(/whisky/craft_bourbon/knobcreek/img/mv.jpg) center/cover no-repeat;}
.mainVisual .txtBox {width:1164px;width: 80.84%; margin: auto;padding: 150px 0 45px;padding: 10.4155% 0 3.125%}
.mainVisual .imgBox {display: none;}
.mainVisual .logo {margin: auto;width: 100%;} 
.mainVisual .txtBoxInner {width: 511px;width: 43.9%;}
.mainVisual .txtBox .txt {font-size: 32px;font-size: 2.222222vw;}
.mainVisual .txtBox .ttl01 {margin-bottom: 0;color: #000;padding-bottom: 124px;}
.mainVisual .modalBtn a {margin-top: 8vw;border: none;}
/*=====contentsSection======*/
.contentsSection {}
.section01 {padding: 32px 0 40px;}
.section01 .characterBox.pcOnly{display: flex!important;}
.section01 .characterBox.spOnly{display: none!important;}
.section01 .characterBox {margin-bottom: 32px;}
.section01 .characterBox.spOnly{display: none!important;}
.section01 .characterBox .imgBox {width:182px;}
.section01 .characterBox .txtBox {text-align: center;width:384px;}
.section01 .characterBox .txtBox .ttl {font-size:24px;line-height: 1.5;}
.section01 .characterBox .txtBox .subTtl {font-size: 14px;margin-top: 15px;}

.section01 .wrapInner {justify-content: space-around;width: 1164px;padding: 0}
.section01 .wrapInner .leftBox {max-width: 550px;}
.section01 .wrapInner .leftBox .imgBox {margin: auto;margin-bottom: 24px;}
.section01 .wrapInner .leftBox .imgBox img {}
.section01 .wrapInner .leftBox .imgBox .fukidashi {padding: 22px 0 ;margin-top: 16px;}
.section01 .wrapInner .leftBox .imgBox .fukidashi:before {width: 24px;height: 24px;top: -8px;left: 24px;}
.section01 .wrapInner .leftBox .imgBox .fukidashi .txt {font-size: 24px;margin-top: 0;}
.section01 .wrapInner .leftBox .imgBox .fukidashi .sub {font-size: 14px;}
.section01 .wrapInner .rightBox {width: 550px;}
.section01 .wrapInner .rightBox .imgBox+.imgBox {margin-top: 8px}
.section01 .wrapInner .txtBox .ttl02 {margin-bottom: 16px;}
.section01 .wrapInner .rightBox .modalBtn {font-size: 20px;height: 56px;margin-top: 48px;}

.section01 .wrapInner .rightBox .txtBox .txtTtl01 {font-weight: bold;font-size:22px;margin-bottom: 16px}
.section01 .wrapInner .rightBox .txtBox .txtTtl01:nth-child(n+2){font-size: 18px;margin-bottom: 5px;}
.section01 .wrapInner .rightBox .txtBox .noteList {margin:0 0 32px;}
.section01 .wrapInner .rightBox .txtBox .noteList .note {font-size:22px;}
.section01 .wrapInner .rightBox .txtBox .txtTtl02 {font-size:14px;}
.section01 .wrapInner .rightBox .txtBox .infoList02 {margin-top: 16px;}
.section01 .wrapInner .rightBox .txtBox .infoList02 .infoItem {margin-bottom: 8px; padding: 0 8px; min-height: 32px;font-size: 14px;width: 100%;}
.section01 .wrapInner .rightBox .txtBox .txt {margin-top: 20px;font-size: 14px;}
.section01 .wrapInner .rightBox .txtBox .infoList02 .infoItem .left {width: 105px;color: #B26337;}
.section01 .wrapInner .rightBox .txtBox .infoList02 .infoItem .right {width: 420px}
.section01 .wrapInner .rightBox .btnBox {width: auto;margin:30px 0 40px;}



/*=====section01.productInfo01======*/
.section01.productInfo01 {}
.section01.productInfo01 .wrapInner{}
.section01.productInfo01 .wrapInner .leftBox {margin-bottom:0;}

/*=====section01.productInfo02======*/
.section01.productInfo02 {margin-bottom: 8px;}
.section01.productInfo02 .wrapInner .leftBox {margin-bottom: 0;}
}